Update templates/menu.html

templates/menu.html

@@ -598,6 +598,7 @@ form-check-input addon-option{
   console.log("Most common add-ons: ", window.most_common_addons);
 // Show item details and fetch customization options
 // Show item details and fetch customization options
+// Show item details and fetch customization options
 function showItemDetails(name, price, image, description, section, selectedCategory) {
     console.log(`Showing details for: ${name}`);
     document.getElementById('modal-name').innerText = name;
@@ -657,15 +658,31 @@ function showItemDetails(name, price, image, description, section, selectedCateg
             // Pre-select the most common add-ons (if any)
             if (window.most_common_addons && window.most_common_addons.length > 0) {
                 const checkboxes = document.querySelectorAll('.addon-option');
+                
+                // Group add-ons by category
+                const categorySelection = {
+                    "Spice Level": null,  // Ensure only one spice level is selected
+                    // Add other categories like "Oil/Ghee" if needed
+                };
+
                 checkboxes.forEach(checkbox => {
                     const checkboxName = checkbox.getAttribute('data-name').trim(); // Trim spaces for checkbox value
-
-                    // Normalize the most common add-ons to avoid spaces, then check if it's in the list
-                    const normalizedAddons = window.most_common_addons.map(addon => addon.trim().toLowerCase());  // Normalize all to lowercase
-
-                    // If the checkbox option is one of the most common add-ons, select it
-                    if (normalizedAddons.includes(checkboxName.trim().toLowerCase())) {
-                        checkbox.checked = true;
+                    const checkboxGroup = checkbox.getAttribute('data-group'); // Get the category/group of this checkbox
+
+                    // If the checkbox belongs to a predefined category like "Spice Level"
+                    if (checkboxGroup === "Spice Level") {
+                        // If we haven't already selected a spice level, select this one
+                        if (categorySelection["Spice Level"] === null) {
+                            console.log(`Pre-selecting spice level: ${checkboxName}`);
+                            checkbox.checked = true;
+                            categorySelection["Spice Level"] = checkboxName; // Mark as selected
+                        }
+                    } else {
+                        // For other categories, select matching add-ons
+                        if (window.most_common_addons.includes(checkboxName)) {
+                            console.log(`Pre-selecting add-on: ${checkboxName}`);
+                            checkbox.checked = true;
+                        }
                     }
                 });
             }
@@ -678,6 +695,7 @@ function showItemDetails(name, price, image, description, section, selectedCateg
 
 
 
+
   function handleToggle(source) {
         const form = document.getElementById("filter-form");
         const veg = document.getElementById("veg-toggle");