Spaces:
Sleeping
Sleeping
| # ── Imports & API setup ───────────────────────────────────────────────────────── | |
| import os, requests, gradio as gr | |
| groq_api_key = os.getenv("GROQ_API_KEY") | |
| url, headers = ( | |
| "https://api.groq.com/openai/v1/chat/completions", | |
| {"Authorization": f"Bearer {groq_api_key}"} | |
| ) | |
| # ── Original core function (unchanged) ────────────────────────────────────────── | |
| def chat_with_groq(user_input): # ← still the same | |
| body = { | |
| "model": "llama-3.1-8b-instant", | |
| "messages": [{"role": "user", "content": user_input}] | |
| } | |
| r = requests.post(url, headers=headers, json=body) | |
| return (r.json()['choices'][0]['message']['content'] | |
| if r.status_code == 200 else f"Error: {r.json()}") | |
| # ── UI helpers ───────────────────────────────────────────────────────────────── | |
| CSS = """ | |
| #header-row {align-items:center; gap:0.75rem;} | |
| #logo {max-width:60px; border-radius:8px;} | |
| #title {font-size:2rem; font-weight:600; margin:0;} | |
| #left-col {width:64%;} | |
| #right-col {width:35%; padding-left:1rem; border:1px solid #e5e5e5; | |
| border-radius:8px; padding:1rem;} | |
| """ | |
| LOGO_URL = ( | |
| "https://raw.githubusercontent.com/Decoding-Data-Science/" | |
| "airesidency/main/dds_logo.jpg" | |
| ) | |
| LLM_QUESTIONS = [ | |
| "What is Retrieval-Augmented Generation (RAG)?", | |
| "Explain Chain-of-Thought prompting in simple terms.", | |
| "How do I fine-tune an LLM on my own data?", | |
| "What are the security risks of LLM applications?", | |
| "Compare zero-shot vs few-shot prompting.", | |
| "What is the role of vector databases with LLMs?" | |
| ] | |
| # ── Build the Gradio app ─────────────────────────────────────────────────────── | |
| with gr.Blocks(css=CSS, title="DDS Chat with Groq AI") as demo: | |
| # Header row: logo + title | |
| with gr.Row(elem_id="header-row"): | |
| gr.Image(value=LOGO_URL, elem_id="logo", show_label=False, | |
| show_download_button=False) | |
| gr.Markdown("<div id='title'>DDS Chat with Groq AI (Llama 3.1-8B)</div>") | |
| gr.Markdown("Ask anything—or pick a quick question on the right.") | |
| with gr.Row(): | |
| # ── Left column: chat interface ─────────────────────────────────────── | |
| with gr.Column(elem_id="left-col"): | |
| chatbot = gr.Chatbot(height=450, label="Conversation") | |
| user_box = gr.Textbox(placeholder="Type your question…", | |
| show_label=False, lines=2) | |
| send_btn = gr.Button("Send", variant="primary") | |
| state = gr.State([]) | |
| # ── Right column: quick-question panel ─────────────────────────────── | |
| with gr.Column(elem_id="right-col"): | |
| gr.Markdown("**LLM Quick Questions**") | |
| question_dd = gr.Dropdown(choices=LLM_QUESTIONS, | |
| label="Select a question", | |
| interactive=True) | |
| gr.Markdown( | |
| "Pick a topic and it will populate the input box. " | |
| "Feel free to edit before sending." | |
| ) | |
| # ── Logic glue ─────────────────────────────────────────────────────────── | |
| def respond(user_msg, history): | |
| reply = chat_with_groq(user_msg) | |
| history = history + [(user_msg, reply)] | |
| return history, history | |
| send_btn.click( | |
| fn=respond, | |
| inputs=[user_box, state], | |
| outputs=[chatbot, state], | |
| queue=False | |
| ).then( | |
| lambda: "", None, user_box, queue=False # clear textbox | |
| ) | |
| question_dd.change( | |
| lambda q: gr.update(value=q), | |
| inputs=question_dd, | |
| outputs=user_box, | |
| queue=False | |
| ) | |
| demo.launch() | |