Spaces:
Sleeping
Sleeping
| Perfect, Cherry! 😄 Here’s a **complete, ready-to-run Gradio AI agent** with: | |
| * ✅ `type="messages"` properly implemented (no more incompatible data errors) | |
| * ✅ Modern **dark theme** UI with rounded chat bubbles | |
| * ✅ **Sidebar** with subjects, planner, languages, settings, and About section | |
| * ✅ **Floating send button + file upload** | |
| * ✅ **Context box** showing current mode | |
| --- | |
| ```python | |
| import os | |
| import gradio as gr | |
| import requests | |
| import json | |
| # ======================= | |
| # Hugging Face Token | |
| # ======================= | |
| HF_TOKEN = os.getenv("HF_TOKEN") | |
| if not HF_TOKEN: | |
| print("Error: HF_TOKEN not set.") | |
| else: | |
| print("HF_TOKEN loaded successfully.") | |
| # ======================= | |
| # Memory | |
| # ======================= | |
| MEMORY_FILE = "memory.json" | |
| def load_memory(): | |
| if os.path.exists(MEMORY_FILE): | |
| with open(MEMORY_FILE, "r") as f: | |
| return json.load(f) | |
| return [] | |
| def save_memory(memory): | |
| with open(MEMORY_FILE, "w") as f: | |
| json.dump(memory, f) | |
| # ======================= | |
| # Web search function | |
| # ======================= | |
| def search_web(query): | |
| try: | |
| url = "https://api.duckduckgo.com/" | |
| params = {"q": query, "format": "json", "no_html": 1, "skip_disambig": 1} | |
| response = requests.get(url, params=params) | |
| data = response.json() | |
| if data.get("AbstractText"): | |
| return data["AbstractText"] | |
| elif data.get("RelatedTopics"): | |
| topics = [t.get("Text", "") for t in data.get("RelatedTopics", []) if "Text" in t] | |
| return " ".join(topics[:3]) | |
| else: | |
| return "No useful information found." | |
| except Exception as e: | |
| return f"Search error: {e}" | |
| # ======================= | |
| # Chat function | |
| # ======================= | |
| def chat_with_model(message, history, context, file_input=None): | |
| if history is None: | |
| history = [] | |
| if message.lower().startswith("search "): | |
| query = message[7:] | |
| search_result = search_web(query) | |
| history.append({"role": "user", "content": message}) | |
| history.append({"role": "assistant", "content": f"🔎 Here's what I found online:\n\n{search_result}"}) | |
| save_memory(history) | |
| return history, history | |
| if file_input: | |
| message += f"\n\n📎 (User uploaded a file named '{file_input.name}')" | |
| # Add user message | |
| history.append({"role": "user", "content": message}) | |
| # Build conversation for API | |
| conversation = [{"role": m["role"], "content": m["content"]} for m in history] | |
| try: | |
| response = requests.post( | |
| "https://router.huggingface.co/v1/chat/completions", | |
| headers={ | |
| "Authorization": f"Bearer {HF_TOKEN}", | |
| "Content-Type": "application/json" | |
| }, | |
| json={ | |
| "model": "deepseek-ai/DeepSeek-V3.2-Exp:novita", | |
| "messages": conversation | |
| } | |
| ) | |
| if response.status_code != 200: | |
| raise Exception(f"API Error: {response.status_code} - {response.text}") | |
| reply = response.json()["choices"][0]["message"]["content"] | |
| # Format math nicely | |
| reply = reply.replace("Step", "\n\n**Step").replace(":", ":**").replace("\\[", "\n\n\\[").replace("\\]", "\\]\n\n") | |
| # Add assistant reply | |
| history.append({"role": "assistant", "content": reply}) | |
| save_memory(history) | |
| return history, history | |
| except Exception as e: | |
| print("Backend Error:", e) | |
| error_msg = "😅 EduAI is having trouble connecting. Check HF_TOKEN or try again later!" | |
| history.append({"role": "assistant", "content": error_msg}) | |
| return history, history | |
| # ======================= | |
| # Sidebar context update | |
| # ======================= | |
| def update_context(choice): | |
| if choice is None: | |
| return "📘 **You are in General Mode.** Ask EduAI anything about your studies!" | |
| return f"📘 **You selected {choice} mode.** Ask anything related to this topic!" | |
| # ======================= | |
| # Clear memory | |
| # ======================= | |
| def clear_memory(): | |
| if os.path.exists(MEMORY_FILE): | |
| os.remove(MEMORY_FILE) | |
| return [], "🧹 Chat memory cleared! Start fresh." | |
| # ======================= | |
| # Custom CSS | |
| # ======================= | |
| custom_css = """ | |
| @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap'); | |
| body { font-family:'Roboto', sans-serif; background:#1e1e1e; color:#e0e0e0; min-height:100vh; } | |
| .header-title { font-size:36px; text-align:center; margin-bottom:20px; color:#007BFF; font-weight:700; text-shadow:0 0 10px rgba(0,123,255,0.5); } | |
| .sidebar { background:#2a2a2a; padding:20px; border-radius:12px; box-shadow:0 4px 12px rgba(0,0,0,0.5); border:1px solid #333; } | |
| .menu-title { font-size:20px; font-weight:500; margin-bottom:15px; color:#007BFF; } | |
| .accordion { background:#2a2a2a; border-radius:12px; padding:10px; margin-bottom:10px; box-shadow:0 3px 8px rgba(0,0,0,0.5); } | |
| .accordion-header { background:#333; color:#e0e0e0; border-radius:10px; padding:12px; font-weight:500; cursor:pointer; transition:0.3s; } | |
| .accordion-header:hover { background:#007BFF; color:#1e1e1e; } | |
| .main-chat { padding:20px; background:#1e1e1e; } | |
| .context-box { background:#2a2a2a; padding:15px; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.3); margin-bottom:15px; border:1px solid #333; color:#e0e0e0; } | |
| .chatbox .message.user { background:#007BFF; color:#fff; border-radius:20px; padding:12px 18px; margin:8px 0; } | |
| .chatbox .message.bot { background:#333; color:#e0e0e0; border-radius:20px; padding:12px 18px; margin:8px 0; } | |
| .input-row { display:flex; gap:10px; margin-top:10px; } | |
| .chat-input { flex:1; border-radius:12px; padding:12px; border:1px solid #555; background:#2a2a2a; color:#e0e0e0; } | |
| .chat-input:focus { border-color:#007BFF; outline:none; } | |
| .btn-send { background:#7c3aed; color:#fff; border-radius:12px; padding:12px 18px; border:none; cursor:pointer; transition:0.3s; } | |
| .btn-send:hover { background:#5b21b6; } | |
| .file-upload { width:50px; height:50px; border:1px solid #555; border-radius:12px; background:#2a2a2a; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:20px; color:#e0e0e0; transition:0.3s; } | |
| .file-upload:hover { background:#007BFF; color:#1e1e1e; } | |
| .btn-clear { background:#f44336; color:white; border-radius:12px; padding:10px 15px; border:none; cursor:pointer; transition:0.3s; } | |
| .btn-clear:hover { background:#d32f2f; } | |
| .about-text { font-size:14px; color:#aaa; line-height:1.5; } | |
| .radio label { color:#e0e0e0; margin:8px 0; } | |
| """ | |
| # ======================= | |
| # Gradio UI | |
| # ======================= | |
| with gr.Blocks(theme=gr.themes.Base(), css=custom_css) as iface: | |
| gr.Markdown("# 🎓 **EduAI — Professional Study Companion**", elem_classes="header-title") | |
| with gr.Row(): | |
| # Sidebar | |
| with gr.Column(scale=1, min_width=250, elem_classes="sidebar"): | |
| gr.Markdown("### 🧭 **Main Menu**", elem_classes="menu-title") | |
| with gr.Accordion("📚 Subject Tutor", open=False): | |
| subj = gr.Radio( | |
| ["Science 🧪", "ICT 💻", "English 📘", "Mathematics ➗"], | |
| label="Choose a subject", type="index" | |
| ) | |
| with gr.Accordion("🗓 Study Planner", open=False): | |
| planner = gr.Radio( | |
| ["View Plan 📅", "Add Task ✏️", "Study Tips 💡"], | |
| label="Planner Options", type="index" | |
| ) | |
| with gr.Accordion("🌐 Languages", open=False): | |
| lang = gr.Radio( | |
| ["Learn Sinhala 🇱🇰","Learn Tamil 🇮🇳","Learn English 🇬🇧","Learn Spanish 🇪🇸"], | |
| label="Language Options", type="index" | |
| ) | |
| with gr.Accordion("⚙️ Settings", open=False): | |
| clear_btn = gr.Button("🧹 Clear Memory", elem_classes="btn-clear") | |
| with gr.Accordion("👩🎓 About", open=False): | |
| gr.Markdown( | |
| "EduAI – developed by **Wafa Fazly** using a pre-trained AI model. Helps learners understand **Science, ICT, English, and more**.", | |
| elem_classes="about-text" | |
| ) | |
| # Main Chat Area | |
| with gr.Column(scale=4, elem_classes="main-chat"): | |
| context_display = gr.Markdown( | |
| "📘 **You are in General Mode.** Ask EduAI anything about your studies!", | |
| elem_classes="context-box" | |
| ) | |
| chatbot = gr.Chatbot( | |
| label="EduAI Chat", | |
| height=500, | |
| render_markdown=True, | |
| type="messages", | |
| latex_delimiters=[{"left": "$$", "right": "$$", "display": True}, | |
| {"left": "\\[", "right": "\\]", "display": True}] | |
| ) | |
| # Input row | |
| with gr.Row(elem_classes="input-row"): | |
| msg = gr.Textbox(label="Ask EduAI:", placeholder="Type your question here...", elem_classes="chat-input", show_label=False) | |
| file_input = gr.File(label="📎", file_types=[".pdf", ".docx", ".png", ".jpg"], elem_classes="file-upload", show_label=False) | |
| send_btn = gr.Button("✈️", elem_classes="btn-send") | |
| # ======================= | |
| # Event handlers | |
| # ======================= | |
| subj.change(update_context, inputs=subj, outputs=context_display) | |
| planner.change(update_context, inputs=planner, outputs=context_display) | |
| lang.change(update_context, inputs=lang, outputs=context_display) | |
| send_btn.click(chat_with_model, inputs=[msg, chatbot, context_display, file_input], outputs=[chatbot, chatbot]) | |
| msg.submit(chat_with_model, inputs=[msg, chatbot, context_display, file_input], outputs=[chatbot, chatbot]) | |
| clear_btn.click(clear_memory, outputs=[chatbot, context_display]) | |
| # Launch the app | |
| iface.launch() | |
| ``` | |