app.py

import streamlit as st
from transformers import pipeline
from PIL import Image
from huggingface_hub import InferenceClient
import os
from gradio_client import Client

# Set page configuration
st.set_page_config(
    page_title="DelishAI - Your Culinary Assistant",
    page_icon="🍽️",
    layout="centered",
    initial_sidebar_state="expanded",
)

# Initialize mode in session state
if 'mode' not in st.session_state:
    st.session_state['mode'] = 'Light Mode'

# Light/Dark mode toggle
mode = st.sidebar.selectbox('Select Mode', options=['Light Mode', 'Dark Mode'],
                            index=0 if st.session_state['mode'] == 'Light Mode' else 1)

st.session_state['mode'] = mode

# Custom CSS to improve styling and responsiveness
def local_css(mode='Light Mode'):
    if mode == 'Light Mode':
        css_string = '''
        <style>
        /* Light mode CSS */
        body {
            background-color: #f0f2f6;
            color: #000000;
        }
        /* Title styling */
        .title h1 {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            text-align: center;
            color: #000000;
            font-size: 3rem;
            margin-bottom: 20px;
        }
        /* Image styling */
        img {
            border-radius: 15px;
            margin-bottom: 20px;
            max-width: 100%;
        }
        /* Sidebar styling */
        [data-testid="stSidebar"] {
            background-color: #ffffff;
            color: #000000;
        }
        /* File uploader styling */
        .stFileUploader {
            border: 2px dashed #000000;
            border-radius: 10px;
            padding: 20px;
            text-align: center;
            color: #000000;
            background-color: #ffffff;
            font-weight: bold;
        }
        .stFileUploader:hover {
            background-color: #e0e0e0;
        }
        /* Button styling */
        button {
            background-color: #000000 !important;
            color: #ffffff !important;
            border: none !important;
            padding: 0.7rem 1.5rem !important;
            border-radius: 5px !important;
            font-size: 1.1rem !important;
            font-weight: bold !important;
            margin-top: 10px !important;
        }
        button:hover {
            background-color: #333333 !important;
            color: #ffffff !important;
        }
        /* Headers styling */
        h2, h3 {
            color: #000000;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }
        /* Text styling */
        p {
            font-size: 1.1rem;
            color: #000000;
        }
        /* Hide footer */
        footer {
            visibility: hidden;
        }
        /* Responsive Design */
        @media only screen and (max-width: 600px) {
            [data-testid="stSidebar"] {
                display: none;
            }
            .block-container {
                padding-left: 1rem;
                padding-right: 1rem;
            }
            .title h1 {
                font-size: 2rem;
            }
            button {
                width: 100% !important;
            }
        }
        /* Sample images grid */
        .sample-images {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 10px;
        }
        .sample-images img {
            width: 150px;
            height: 150px;
            object-fit: cover;
            border-radius: 10px;
            cursor: pointer;
            border: 2px solid transparent;
        }
        .sample-images img:hover {
            border: 2px solid #000000;
        }
        </style>
        '''
    else:
        css_string = '''
        <style>
        /* Dark mode CSS */
        body {
            background-color: #1e1e1e;
            color: #ffffff;
        }
        /* Title styling */
        .title h1 {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            text-align: center;
            color: #ffffff;
            font-size: 3rem;
            margin-bottom: 20px;
        }
        /* Image styling */
        img {
            border-radius: 15px;
            margin-bottom: 20px;
            max-width: 100%;
        }
        /* Sidebar styling */
        [data-testid="stSidebar"] {
            background-color: #333333;
            color: #ffffff;
        }
        /* File uploader styling */
        .stFileUploader {
            border: 2px dashed #ffffff;
            border-radius: 10px;
            padding: 20px;
            text-align: center;
            color: #ffffff;
            background-color: #1e1e1e;
            font-weight: bold;
        }
        .stFileUploader:hover {
            background-color: #333333;
        }
        /* Button styling */
        button {
            background-color: #ffffff !important;
            color: #000000 !important;
            border: none !important;
            padding: 0.7rem 1.5rem !important;
            border-radius: 5px !important;
            font-size: 1.1rem !important;
            font-weight: bold !important;
            margin-top: 10px !important;
        }
        button:hover {
            background-color: #e0e0e0 !important;
            color: #000000 !important;
        }
        /* Headers styling */
        h2, h3 {
            color: #ffffff;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }
        /* Text styling */
        p {
            font-size: 1.1rem;
            color: #ffffff;
        }
        /* Hide footer */
        footer {
            visibility: hidden;
        }
        /* Responsive Design */
        @media only screen and (max-width: 600px) {
            [data-testid="stSidebar"] {
                display: none;
            }
            .block-container {
                padding-left: 1rem;
                padding-right: 1rem;
            }
            .title h1 {
                font-size: 2rem;
            }
            button {
                width: 100% !important;
            }
        }
        /* Sample images grid */
        .sample-images {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 10px;
        }
        .sample-images img {
            width: 150px;
            height: 150px;
            object-fit: cover;
            border-radius: 10px;
            cursor: pointer;
            border: 2px solid transparent;
        }
        .sample-images img:hover {
            border: 2px solid #ffffff;
        }
        </style>
        '''
    st.markdown(css_string, unsafe_allow_html=True)

# Apply the custom CSS based on the selected mode
local_css(st.session_state['mode'])

# Load the image classification pipeline
@st.cache_resource
def load_image_classification_pipeline():
    """
    Load the image classification pipeline using a pretrained model.
    """
    return pipeline("image-classification", model="Shresthadev403/food-image-classification")

pipe_classification = load_image_classification_pipeline()

# Function to generate ingredients using Hugging Face Inference Client
def get_ingredients_qwen(food_name):
    """
    Generate a list of ingredients for the given food item using Qwen NLP model.
    Returns a clean, comma-separated list of ingredients.
    """
    API_KEY = st.secrets["HF_API_KEY"]
    client = InferenceClient(api_key=API_KEY)
    messages = [
        {
            "role": "user",
            "content": f"List only the main ingredients for {food_name}. "
                       f"Respond in a concise, comma-separated list without any extra text or explanations."
        }
    ]
    try:
        completion = client.chat_completions.create(
            model="Qwen/Qwen2.5-Coder-32B-Instruct",
            messages=messages,
            max_tokens=50
        )
        generated_text = completion.choices[0].message["content"].strip()
        return generated_text
    except Exception as e:
        return f"Error generating ingredients: {e}"

# Main content
st.markdown('<div class="title"><h1>DelishAI - Your Culinary Assistant</h1></div>', unsafe_allow_html=True)

# Add banner image
st.image("IR_IMAGE.png", use_container_width=True)

# Sidebar for model information (hidden on small screens)
with st.sidebar:
    st.title("Model Information")
    st.write("**Image Classification Model**")
    st.write("Shresthadev403/food-image-classification")
    st.write("**LLM for Ingredients**")
    st.write("Qwen/Qwen2.5-Coder-32B-Instruct")
    st.markdown("---")
    st.markdown("<p style='text-align: center;'>Developed by Muhammad Hassan Butt.</p>", unsafe_allow_html=True)

# Sample images
st.subheader("Or try one of these sample images:")
sample_images = {
    "Burger": "sample_images/burger.jpg",
    "Pizza": "sample_images/pizza.jpg",
    "Sushi": "sample_images/sushi.jpg",
    "Salad": "sample_images/salad.jpg"
}

cols = st.columns(len(sample_images))
selected_sample = None
for idx, (name, file_path) in enumerate(sample_images.items()):
    with cols[idx]:
        if st.button(f"{name}", key=name):
            selected_sample = file_path

# File uploader
st.subheader("Upload a food image:")
uploaded_file = st.file_uploader("", type=["jpg", "png", "jpeg"])

if selected_sample:
    # Sample image selected
    image = Image.open(selected_sample)
    st.image(image, caption="Selected Sample Image", use_container_width=True)
    classify = st.button("Classify", key="classify_sample")
elif uploaded_file is not None:
    # User uploaded image
    image = Image.open(uploaded_file)
    st.image(image, caption="Uploaded Image", use_container_width=True)
    classify = st.button("Classify", key="classify_upload")
else:
    st.info("Please select or upload an image to get started.")
    classify = False

if classify:
    with st.spinner("Classifying..."):
        # Make predictions
        predictions = pipe_classification(image)

        # Display only the top prediction
        top_food = predictions[0]['label']
        st.header(f"🍽️ Food: {top_food}")

        # Generate and display ingredients for the top prediction
        st.subheader("📝 Ingredients")
        try:
            ingredients = get_ingredients_qwen(top_food)
            st.write(ingredients)
        except Exception as e:
            st.error(f"Error generating ingredients: {e}")

        st.subheader("💡 Healthier Alternatives")
        try:
            client_gradio = Client("https://8a56cb969da1f9d721.gradio.live/")
            result = client_gradio.predict(
                query=f"What's a healthy {top_food} recipe, and why is it healthy?",
                api_name="/get_response"
            )
            st.write(result)
        except Exception as e:
            st.error(f"Unable to contact RAG: {e}")