Update static/script.js

static/script.js

@@ -71,10 +71,22 @@ function updateSelectionBox() {
     label.textContent = 'Selected Items:';
     selectionBox.appendChild(label);
 
+    // Display selected items with images
     selectedItems.forEach(item => {
+        const itemContainer = document.createElement('div');
+        itemContainer.className = 'selected-item';
+
+        const img = document.createElement('img');
+        img.src = item.image_url || 'https://via.placeholder.com/30';
+        img.alt = item.name;
+        img.className = 'selected-item-image';
+        itemContainer.appendChild(img);
+
         const itemSpan = document.createElement('span');
         itemSpan.textContent = item.name;
-        selectionBox.appendChild(itemSpan);
+        itemContainer.appendChild(itemSpan);
+
+        selectionBox.appendChild(itemContainer);
     });
 
     const textInput = document.createElement('input');
@@ -87,7 +99,7 @@ function updateSelectionBox() {
                 name: textInput.value.trim(),
                 description: 'Manually added',
                 ingredients: 'Not specified',
-                image_url: '',
+                image_url: '', // Default to empty; will use placeholder
                 category: 'Both'
             };
             selectedItems.push(manualItem);