app.py

import gradio as gr
from huggingface_hub import InferenceClient

client = InferenceClient("meta-llama/Llama-3.2-3B-Instruct")

def respond(
    model_name,
    message,
    history: list[tuple[str, str]],
    system_message,
):
    messages = [{"role": "system", "content": system_message}]

    for val in history:
        if val[0]:
            messages.append({"role": "user", "content": val[0]})
        if val[1]:
            messages.append({"role": "assistant", "content": val[1]})

    messages.append({"role": "user", "content": message})

    response = ""

    if model_name == "Llama":
        for message in client.chat_completion(
            messages,
            max_tokens=512,
            stream=True,
            temperature=0.7,
            top_p=0.95,
        ):
            token = message.choices[0].delta.content
            response += token
    elif model_name == "Chatgpt":
        response = "ChatGPT functionality is not yet implemented."
    elif model_name == "Claude":
        response = "Claude functionality is not yet implemented."
    else:
        response = "Model not recognized."

    return response


# CSS for styling the interface
css = """
body {
    background-color: #06688E; /* Dark background */
    color: white; /* Text color for better visibility */
}
.gr-button {
    background-color: #42B3CE !important; /* White button color */
    color: black !important; /* Black text for contrast */
    border: none !important;
    padding: 8px 16px !important;
    border-radius: 5px !important;
}
.gr-button:hover {
    background-color: #e0e0e0 !important; /* Slightly lighter button on hover */
}
"""

# Define the button click handler to hide the dropdown
def on_button_click(model_name, message, history, system_message, dropdown_state):
    # Close the dropdown by setting the state to False
    return respond(model_name, message, history, system_message), gr.update(visible=False)

# Define the Gradio interface with buttons and model selection
demo = gr.Interface(
    fn=on_button_click,
    inputs=[
        gr.Textbox(value="Hello!", label="User Message"),
        gr.Textbox(value="You are a virtual health assistant. Your primary goal is to assist with health-related queries.", label="System Message", visible=False),
        gr.Button("Chatgpt"),
        gr.Button("Llama"),
        gr.Button("Claude"),
        gr.State(value=False),  # Add state to track visibility of the dropdown
    ],
    outputs=[
        "text",  # For the model's response
        gr.State(value=False),  # This should be the state output, which tracks visibility
    ],
    css=css,  # Pass the custom CSS here
)

if __name__ == "__main__":
    demo.launch(share=True)