Update templates/chef-bot.html

templates/chef-bot.html

@@ -502,8 +502,6 @@
         <div class="chat-messages" id="chatMessages">
             <div class="bot-message">Hello! I’m Chef Bot, your culinary assistant! What’s your name?</div>
         </div>
-        <div class="suggestions-list" id="suggestionsList"></div>
-        <div class="ingredients-list" id="menuItemsList"></div>
         <div class="chat-input">
             <input type="text" id="userInput" placeholder="Type here (e.g., paneer, chicken)...">
             <button onclick="sendMessage()">Send</button>
@@ -516,6 +514,7 @@
         ];
         let selectedItems = [];
         let selectionBoxVisible = false;
+        let currentDietaryPreference = '';
 
         function addMessage(role, message) {
             const chatMessages = document.getElementById('chatMessages');
@@ -555,7 +554,7 @@
             let botResponse = '';
 
             if (conversation.length === 2) {
-                botResponse = `Hi ${userInput}! 🍳 Search for a dish or choose a preference below!`;
+                botResponse = `Hi ${userInput}! 🍳 Please choose a dietary preference: Vegetarian, Non-Vegetarian, or Both.`;
                 displayOptions([
                     { text: 'Vegetarian', class: 'green' },
                     { text: 'Non-Vegetarian', class: 'red' },
@@ -563,13 +562,14 @@
                 ]);
                 addMessage('bot', botResponse);
             } else if (lowerInput === 'vegetarian' || lowerInput === 'non-vegetarian' || lowerInput === 'both') {
+                currentDietaryPreference = lowerInput;
                 botResponse = `Fetching ${lowerInput} dishes...`;
                 addMessage('bot', botResponse);
                 fetchMenuItems(lowerInput);
             } else {
                 botResponse = `Looking for "${userInput}"...`;
                 addMessage('bot', botResponse);
-                fetchMenuItems(null, userInput);
+                fetchMenuItems(currentDietaryPreference, userInput);
             }
         }
 
@@ -648,7 +648,6 @@
                     contentDiv.appendChild(showButton);
                 }
 
-                // Add ingredient input for customization
                 const ingredientInput = document.createElement('input');
                 ingredientInput.type = 'text';
                 ingredientInput.placeholder = 'Add ingredient...';
@@ -676,7 +675,6 @@
 
                 selectionBox.appendChild(itemContainer);
 
-                // Display original item if customized
                 if (item.additionalIngredients && item.additionalIngredients.length > 0) {
                     const originalContainer = document.createElement('div');
                     originalContainer.className = 'selected-item';
@@ -703,6 +701,19 @@
                         originalContentDiv.appendChild(originalShowButton);
                     }
 
+                    const originalIngredientInput = document.createElement('input');
+                    originalIngredientInput.type = 'text';
+                    originalIngredientInput.placeholder = 'Add ingredient...';
+                    originalIngredientInput.className = 'ingredient-input';
+                    originalIngredientInput.addEventListener('keypress', (e) => {
+                        if (e.key === 'Enter' && originalIngredientInput.value.trim()) {
+                            const ingredientName = originalIngredientInput.value.trim();
+                            fetchSectorItemDetails(ingredientName, index);
+                            originalIngredientInput.value = '';
+                        }
+                    });
+                    originalContentDiv.appendChild(originalIngredientInput);
+
                     originalContainer.appendChild(originalContentDiv);
 
                     const originalRemoveButton = document.createElement('button');
@@ -726,6 +737,8 @@
             textInput.addEventListener('keypress', (e) => {
                 if (e.key === 'Enter' && textInput.value.trim()) {
                     const itemName = textInput.value.trim();
+                    addMessage('user', itemName);
+                    conversation.push({ role: 'user', message: itemName });
                     fetchSectorItemDetails(itemName);
                     textInput.value = '';
                 }
@@ -795,11 +808,19 @@
                 .then(response => response.json())
                 .then(data => {
                     if (data.error) {
-                        addMessage('bot', `No "${itemName}" found. Try another!`);
+                        addMessage('bot', `No "${itemName}" found in Sector_Detail__c. Try another!`);
                     } else {
                         const details = data.item_details;
+                        // Validate dietary preference
+                        if (currentDietaryPreference === 'vegetarian' && details.category !== 'Veg') {
+                            addMessage('bot', `"${details.name}" is not vegetarian. Please choose a vegetarian item.`);
+                            return;
+                        }
+                        if (currentDietaryPreference === 'non-vegetarian' && details.category !== 'Non-Veg') {
+                            addMessage('bot', `"${details.name}" is not non-vegetarian. Please choose a non-vegetarian item.`);
+                            return;
+                        }
                         if (itemIndex !== null) {
-                            // Adding as an additional ingredient
                             if (!selectedItems[itemIndex].additionalIngredients) {
                                 selectedItems[itemIndex].additionalIngredients = [];
                             }
@@ -811,7 +832,6 @@
                                 addMessage('bot', `"${details.name}" already added to "${selectedItems[itemIndex].name}"!`);
                             }
                         } else {
-                            // Adding as a new item
                             if (selectedItems.some(item => item.name === details.name && !item.additionalIngredients)) {
                                 addMessage('bot', `"${details.name}" already selected!`);
                             } else {
@@ -852,10 +872,25 @@
                 return;
             }
 
+            // Filter items based on dietary preference
+            const filteredItems = items.filter(item => {
+                if (currentDietaryPreference === 'vegetarian') {
+                    return item.veg_nonveg === 'Vegetarian' || item.category === 'Veg';
+                } else if (currentDietaryPreference === 'non-vegetarian') {
+                    return item.veg_nonveg === 'Non-Vegetarian' || item.category === 'Non-Veg';
+                }
+                return true;
+            });
+
+            if (filteredItems.length === 0) {
+                addMessage('bot', `No ${currentDietaryPreference} items found. Try another search!`);
+                return;
+            }
+
             const itemsGrid = document.createElement('div');
             itemsGrid.className = 'items-grid';
 
-            items.forEach(item => {
+            filteredItems.forEach(item => {
                 const itemDiv = document.createElement('div');
                 itemDiv.className = 'item-card';
 
@@ -1020,9 +1055,10 @@
             conversation = [
                 { role: 'bot', message: `Hello! I’m Chef Bot, your culinary assistant! What’s your name?` },
                 { role: 'user', message: userName },
-                { role: 'bot', message: `Hi ${userName}! 🍳 Search for a dish or choose a preference below!` }
+                { role: 'bot', message: `Hi ${userName}! 🍳 Please choose a dietary preference: Vegetarian, Non-Vegetarian, or Both.` }
             ];
             selectedItems = [];
+            currentDietaryPreference = '';
             selectionBoxVisible = true;
             const chatMessages = document.getElementById('chatMessages');
             chatMessages.innerHTML = '';