Update app.py

app.py

@@ -34,7 +34,7 @@ def filter_menu(preference):
             </div>
             <div style="flex-shrink: 0; text-align: center;">
                 <img src="{item['Image URL']}" alt="{item['Dish Name']}" style="width: 100px; height: 100px; border-radius: 8px; object-fit: cover; margin-bottom: 10px;">
-                <button value="{item['Dish Name']}" onclick="selectDish('{item['Dish Name']}')" style="background-color: #28a745; color: white; border: none; padding: 8px 15px; font-size: 14px; border-radius: 5px; cursor: pointer;">Add</button>
+                <button value="{item['Dish Name']}" style="background-color: #28a745; color: white; border: none; padding: 8px 15px; font-size: 14px; border-radius: 5px; cursor: pointer;">Add</button>
             </div>
         </div>
         """
@@ -42,13 +42,14 @@ def filter_menu(preference):
 
 # Function to render dish details for the suggestion page
 def render_dish_details(dish_name):
-    print(f"Dish name received: {dish_name}")  # Debugging line
+    print(f"Dish name received: {dish_name}")  # Debugging
     menu_data = load_menu()
     try:
         dish = menu_data[menu_data["Dish Name"] == dish_name].iloc[0]
+        print(f"Dish details: {dish}")  # Debugging
         return (
             dish["Image URL"],
-            dish_name,
+            f"## {dish_name}",
             dish["Description"],
             f"${dish['Price ($)']}"
         )
@@ -58,11 +59,12 @@ def render_dish_details(dish_name):
 # Gradio app definition
 def app():
     with gr.Blocks() as demo:
-        gr.Markdown("## Menu with Dynamic Filters")
+        gr.Markdown("## Dynamic Menu with Preferences")
 
-        selected_dish = gr.State("")  # State for the selected dish name
+        # Track selected dish
+        selected_dish = gr.State("")
 
-        # Menu components
+        # Menu page
         preference_selector = gr.Radio(
             choices=["All", "Vegetarian", "Halal/Non-Veg", "Guilt-Free"],
             value="All",
@@ -70,12 +72,28 @@ def app():
         )
         menu_html = gr.HTML(value=filter_menu("All"))
 
-        # Suggestion page components
+        # Suggestion page (hidden by default)
         suggestion_page = gr.Column(visible=False)
         dish_image = gr.Image(label="Dish Image")
         dish_name = gr.Markdown()
         dish_description = gr.Markdown()
         dish_price = gr.Markdown()
+        spice_level = gr.Radio(
+            choices=["Mild", "Medium", "Spicy"],
+            label="Choose Spice Level"
+        )
+        extras = gr.CheckboxGroup(
+            choices=["Extra Raita", "Extra Salan", "Extra Fried Onion"],
+            label="Choose Extras"
+        )
+        quantity = gr.Number(value=1, label="Quantity", interactive=True)
+        special_instructions = gr.Textbox(label="Special Instructions", placeholder="Add any requests...")
+        add_to_cart_button = gr.Button("Add to Bag")
+        back_to_menu_button = gr.Button("Back to Menu")
+
+        # Cart state and display
+        cart_state = gr.State([])
+        cart_output = gr.HTML(value="Your cart is empty.")
 
         # Functions
         def update_menu(preference):
@@ -88,7 +106,7 @@ def app():
                     gr.update(visible=False),
                     gr.update(visible=True),
                     img,
-                    f"## {name}",
+                    name,
                     desc,
                     price
                 )
@@ -102,6 +120,20 @@ def app():
                     ""
                 )
 
+        def add_to_cart(dish_name, spice_level, extras, quantity, instructions, cart):
+            cart.append({
+                "name": dish_name,
+                "spice_level": spice_level,
+                "extras": extras,
+                "quantity": quantity,
+                "instructions": instructions
+            })
+            cart_html = "<br>".join(
+                [f"{item['quantity']}x {item['name']} - {item['spice_level']} (Extras: {', '.join(item['extras'])})"
+                 for item in cart]
+            )
+            return cart, cart_html
+
         # Event Handlers
         preference_selector.change(
             update_menu,
@@ -115,6 +147,17 @@ def app():
             outputs=[menu_html, suggestion_page, dish_image, dish_name, dish_description, dish_price]
         )
 
+        add_to_cart_button.click(
+            add_to_cart,
+            inputs=[dish_name, spice_level, extras, quantity, special_instructions, cart_state],
+            outputs=[cart_state, cart_output]
+        )
+
+        back_to_menu_button.click(
+            lambda: (gr.update(visible=True), gr.update(visible=False)),
+            outputs=[menu_html, suggestion_page]
+        )
+
         # Layout
         with gr.Row():
             menu_html
@@ -124,6 +167,15 @@ def app():
             dish_name
             dish_description
             dish_price
+            spice_level
+            extras
+            quantity
+            special_instructions
+            add_to_cart_button
+            back_to_menu_button
+
+        with gr.Row():
+            cart_output
 
     return demo