app.py

import gradio as gr
from components.cards import create_food_card
from components.data import FOOD_DATA

# Function to render a card based on selected item
def display_card(food_name):
    return create_food_card(food_name)

# Dropdown with food items
food_items = list(FOOD_DATA.keys())

# Gradio app interface
with gr.Blocks(css="styles.css") as app:
    gr.Markdown("# 🍽️ Indian & Chinese Food Nutritional Information")
    gr.Markdown("### Click on a food item to explore its nutritional details.")
    with gr.Row():
        food_dropdown = gr.Dropdown(label="Select a Dish", choices=food_items)
        display_area = gr.HTML()

    # Event to update the display area with card
    food_dropdown.change(display_card, inputs=food_dropdown, outputs=display_area)

# Run the app
app.launch()