Update app.py

app.py

@@ -355,8 +355,9 @@ def app():
                     font-size: 16px;
                     cursor: pointer;
                     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
-                " onclick="openCartModal()">View Cart</div>
-            ''')
+                    " onclick="openCartModal()">View Cart</div>
+                ''')
+
 
             # Modal window for item customization
             modal_window = gr.HTML("""
@@ -430,6 +431,7 @@ def app():
                 </div>
             ''')
 
+
             selected_preference.change(filter_menu, inputs=[selected_preference], outputs=[menu_output])
             gr.Row([selected_preference])
             gr.Row(menu_output)
@@ -453,32 +455,32 @@ def app():
                         document.getElementById('cart-content').innerHTML = htmlContent;
                     }
 
-                    // Update the cart display dynamically
+                    // Ensure existing updateCartDisplay logic works
                     function updateCartDisplay() {
-                        let totalBill = 0;
-                        let cartHTML = "<div>";
-                        cart.forEach((item, index) => {
-                            totalBill += item.itemTotal;
-                            cartHTML += `<div style="margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; padding: 10px;">
-                                <strong>${item.name}</strong> (x${item.quantity}) - $${item.itemTotal.toFixed(2)}
-                                <br>Extras: ${item.extras.join(", ") || "None"}
-                                <br>Instructions: ${item.instructions || "None"}
-                            </div>`;
-                        });
-                        cartHTML += `</div><p><strong>Total Bill: $${totalBill.toFixed(2)}</strong></p>`;
-                        cartHTML += `<button onclick="submitCart()" style="
-                            background-color: #007bff;
-                            color: white;
-                            padding: 10px 20px;
-                            border: none;
-                            border-radius: 5px;
-                            font-size: 16px;
-                            cursor: pointer;
+                    let totalBill = 0;
+                    let cartHTML = "<div>";
+                    cart.forEach((item, index) => {
+                        totalBill += item.itemTotal;
+                        cartHTML += `<div style="margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; padding: 10px;">
+                            <strong>${item.name}</strong> (x${item.quantity}) - $${item.itemTotal.toFixed(2)}
+                            <br>Extras: ${item.extras.join(", ") || "None"}
+                            <br>Instructions: ${item.instructions || "None"}
+                        </div>`;
+                    });
+                    cartHTML += `</div><p><strong>Total Bill: $${totalBill.toFixed(2)}</strong></p>`;
+                    cartHTML += `<button onclick="submitCart()" style="
+                        background-color: #007bff;
+                        color: white;
+                        padding: 10px 20px;
+                        border: none;
+                        border-radius: 5px;
+                        font-size: 16px;
+                        cursor: pointer;
                         ">Submit</button>`;
-                        updateCartContent(cartHTML);
-                    }
-                </script>
-            ''')
+                    updateCartContent(cartHTML);
+                }
+            </script>
+        ''')
 
         # Cart & Final Order Page (Not needed as the cart is shown in the modal now)