Update static/script.js

static/script.js

@@ -105,13 +105,21 @@ function displayIngredientsList(ingredients) {
     ingredients.forEach(ingredient => {
         const item = document.createElement('div');
         item.className = 'ingredient-item';
-        const img = document.createElement('img');
-        img.src = ingredient.image_url || 'https://via.placeholder.com/80';
-        img.alt = ingredient.name;
+        // Only use image if provided, otherwise just show name and button
+        const img = ingredient.image_url ? document.createElement('img') : null;
+        if (img) {
+            img.src = ingredient.image_url;
+            img.alt = ingredient.name;
+            img.style.width = '80px';
+            img.style.height = '80px';
+            img.style.objectFit = 'cover';
+            img.style.borderRadius = '5px';
+            item.appendChild(img);
+        }
         const name = document.createElement('div');
         name.textContent = ingredient.name;
         name.style.textAlign = 'center';
-        name.style.marginTop = '5px';
+        name.style.marginTop = img ? '5px' : '0';
         name.style.fontSize = '12px';
         const button = document.createElement('button');
         button.textContent = 'Add';
@@ -121,8 +129,8 @@ function displayIngredientsList(ingredients) {
                 displaySelectedIngredients();
             }
         };
-        item.appendChild(img);
         item.appendChild(name);
+        if (img) item.appendChild(img); // Add image only if it exists
         item.appendChild(button);
         ingredientsList.appendChild(item);
     });
@@ -194,7 +202,7 @@ function displayOptions(options) {
     optionsDiv.appendChild(backButton);
 }
 
-// New function to handle sending selected ingredients
+// Function to handle sending selected ingredients
 function sendSelectedIngredients() {
     if (selectedIngredients.length === 0) {
         addMessage('bot', 'Please select at least one ingredient before sending!');
@@ -202,7 +210,7 @@ function sendSelectedIngredients() {
     }
     const ingredientsList = selectedIngredients.map(ing => ing.name).join(', ');
     addMessage('user', `Selected ingredients: ${ingredientsList}`);
-    addMessage('bot', `Great! I’ll suggest a recipe with ${ingredientsList}. How about a spicy prawn dish with rice flour coating? Let me know if you'd like to adjust!`);
+    addMessage('bot', `Great! I’ll suggest a recipe with ${ingredientsList}. How about a stir-fried veggie mix? Let me know if you'd like to adjust!`);
     selectedIngredients = []; // Reset after sending
     displaySelectedIngredients(); // Update the display
 }