feat: Add product kit creation view and its corresponding template.

myproject/products/templates/products/productkit_create.html

@@ -1373,12 +1373,38 @@
                         reader.readAsDataURL(file);
                     });
                 } else {
-                    photoPreviewContainer.style.display = 'none';
+                    photoPreviewContainer.style.display = 'none'; // Only hide if no source photos too (will check later)
                     photoPreview.innerHTML = '';
+
+                    // Re-render source photos if they exist and we just cleared new files
+                    if (document.querySelectorAll('.source-photo-item').length > 0) {
+                        photoPreviewContainer.style.display = 'block';
+                    }
                 }
             });
         }
 
+        // Render source photos if present
+        {% if source_photos %}
+        photoPreviewContainer.style.display = 'block';
+        {% for photo in source_photos %}
+        (function () {
+            const col = document.createElement('div');
+            col.className = 'col-4 col-md-3 col-lg-2 source-photo-item';
+            col.innerHTML = `
+                        <div class="card position-relative border-0 shadow-sm">
+                            <img src="{{ photo.image.url }}" class="card-img-top" alt="Source Photo">
+                            <button type="button" class="btn btn-sm btn-danger position-absolute top-0 end-0 m-1" onclick="this.closest('.col-4').remove();">
+                                <i class="bi bi-x"></i>
+                            </button>
+                            <input type="hidden" name="copied_photos" value="{{ photo.id }}">
+                        </div>
+                    `;
+            photoPreview.appendChild(col);
+        })();
+        {% endfor %}
+        {% endif %}
+
         window.removePhoto = function (index) {
             selectedFiles.splice(index, 1);
             const dataTransfer = new DataTransfer();