Update static/script.js

static/script.js

@@ -42,29 +42,50 @@ function updateSelectionBox() {
     const existingBox = document.querySelector('.selection-box');
     if (existingBox) existingBox.remove();
 
-    if (selectedItems.length > 0) {
-        const selectionBox = document.createElement('div');
-        selectionBox.className = 'selection-box';
+    const selectionBox = document.createElement('div');
+    selectionBox.className = 'selection-box';
 
-        const label = document.createElement('span');
-        label.textContent = 'Selected Items:';
-        selectionBox.appendChild(label);
+    const label = document.createElement('span');
+    label.textContent = 'Selected Items:';
+    selectionBox.appendChild(label);
 
-        selectedItems.forEach(item => {
-            const itemSpan = document.createElement('span');
-            itemSpan.textContent = item.name;
-            selectionBox.appendChild(itemSpan);
-        });
+    selectedItems.forEach(item => {
+        const itemSpan = document.createElement('span');
+        itemSpan.textContent = item.name;
+        selectionBox.appendChild(itemSpan);
+    });
+
+    // Add text input for manual item entry
+    const textInput = document.createElement('input');
+    textInput.type = 'text';
+    textInput.placeholder = 'Add item manually...';
+    textInput.className = 'manual-input';
+    textInput.addEventListener('keypress', (e) => {
+        if (e.key === 'Enter' && textInput.value.trim()) {
+            const manualItem = {
+                name: textInput.value.trim(),
+                description: 'Manually added',
+                ingredients: 'Not specified',
+                image_url: ''
+            };
+            selectedItems.push(manualItem);
+            addMessage('bot', `Added "${manualItem.name}" to your selection! Check the box below.`);
+            textInput.value = '';
+            updateSelectionBox();
+        }
+    });
+    selectionBox.appendChild(textInput);
 
+    if (selectedItems.length > 0) {
         const submitButton = document.createElement('button');
         submitButton.textContent = 'Submit to Salesforce';
         submitButton.className = 'submit-button';
         submitButton.onclick = submitToSalesforce;
         selectionBox.appendChild(submitButton);
-
-        chatMessages.appendChild(selectionBox);
-        chatMessages.scrollTop = chatMessages.scrollHeight;
     }
+
+    chatMessages.appendChild(selectionBox);
+    chatMessages.scrollTop = chatMessages.scrollHeight;
     console.log('Updated selection box with items:', selectedItems.map(item => item.name));
 }
 
@@ -105,7 +126,6 @@ function fetchMenuItems(dietaryPreference) {
             if (data.error) {
                 addMessage('bot', `Oops! Trouble fetching ${dietaryPreference} items: ${data.error}. Want to try again or search something specific?`);
             } else if (data.menu_items.length > 0) {
-                // Removed the message: "Here’s a tasty selection of ${dietaryPreference} items from Sector_Detail__c:"
                 displayItemsList(data.menu_items, 'menuItemsList');
             } else {
                 addMessage('bot', `Looks like we’re out of ${dietaryPreference} items in Sector_Detail__c. Try searching for something like "paneer" or "chicken"!`);
@@ -151,7 +171,8 @@ function fetchItemDetails(itemName) {
         .then(response => response.json())
         .then(data => {
             if (data.error) {
-                addMessage('bot', `Sorry, couldn’t get details for "${itemName}": ${data.error}. Double-check the name!`);
+                addMessage('bot', `Couldn’t find "${itemName}" in Salesforce. Add it manually in the box below!`);
+                updateSelectionBox(); // Show the box with text input even if no items are selected yet
             } else {
                 const details = data.item_details;
                 selectedItems.push(details);
@@ -161,7 +182,8 @@ function fetchItemDetails(itemName) {
             }
         })
         .catch(error => {
-            addMessage('bot', `Trouble fetching details for "${itemName}": ${error.message}. Retrying...`);
+            addMessage('bot', `Trouble fetching details for "${itemName}": ${error.message}. Add it manually below or I’ll retry...`);
+            updateSelectionBox(); // Show the box with text input on error
             setTimeout(() => fetchItemDetails(itemName), 2000);
         });
 }