Spaces:
Sleeping
Sleeping
import gradio as gr | |
from core import submit_query, clear_history | |
# Define Gradio interface | |
with gr.Blocks(theme=gr.themes.Soft(), css=".full-height { height: 100%; display: flex; align-items: stretch; min-height: 40px; } .full-height button { height: 100%; padding: 8px 16px; } .providers-row { height: 100%; display: flex; align-items: stretch; min-height: 40px; } .providers-row .checkbox-group { height: 100%; display: flex; flex-direction: row; align-items: center; gap: 10px; }") as demo: | |
gr.Markdown("# Multi-Model Chat") | |
gr.Markdown("Chat with OpenAI, Anthropic, or Gemini. Select providers and compare responses side by side!") | |
with gr.Row(elem_classes="providers-row"): | |
providers = gr.CheckboxGroup(choices=["OpenAI", "Anthropic", "Gemini"], label="Select Providers", value=["OpenAI"], elem_classes="checkbox-group") | |
with gr.Row(elem_classes="full-height"): | |
query = gr.Textbox( | |
label="Enter your query", | |
placeholder="e.g., What is the capital of the United States?", | |
scale=4, | |
autofocus=True # This will focus the textbox on load | |
) | |
submit_button = gr.Button("Submit", scale=1) | |
with gr.Row(): | |
clear_button = gr.Button("Clear History") | |
with gr.Row(): | |
openai_chatbot = gr.Chatbot(label="OpenAI", type="messages", scale=1) | |
anthropic_chatbot = gr.Chatbot(label="Anthropic", type="messages", scale=1) | |
gemini_chatbot = gr.Chatbot(label="Gemini", type="messages", scale=1) | |
chat_history = gr.State([]) | |
# Handle both button click and Enter key | |
query.submit( | |
fn=submit_query, | |
inputs=[query, providers, chat_history], | |
outputs=[query, openai_chatbot, anthropic_chatbot, gemini_chatbot, chat_history] | |
) | |
submit_button.click( | |
fn=submit_query, | |
inputs=[query, providers, chat_history], | |
outputs=[query, openai_chatbot, anthropic_chatbot, gemini_chatbot, chat_history] | |
) | |
clear_button.click( | |
fn=clear_history, | |
inputs=[], | |
outputs=[openai_chatbot, anthropic_chatbot, gemini_chatbot, chat_history] | |
) | |
demo.launch() | |