Spaces:
Runtime error
Runtime error
| """ | |
| Study Ocean AI Mentor — Gradio Web Interface | |
| A beautiful, student-friendly chat interface for the RAG-based | |
| doubt-solving mentor. Built with Gradio for easy deployment. | |
| """ | |
| import gradio as gr | |
| from rag_chain import get_chain, ask_question | |
| # ─── Custom CSS for Premium Look ──────────────────────────── | |
| CUSTOM_CSS = """ | |
| /* Global */ | |
| .gradio-container { | |
| max-width: 900px !important; | |
| margin: auto !important; | |
| font-family: 'Inter', 'Segoe UI', sans-serif !important; | |
| } | |
| /* Header */ | |
| .header-section { | |
| text-align: center; | |
| padding: 20px 0 10px; | |
| background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); | |
| border-radius: 16px; | |
| margin-bottom: 20px; | |
| color: white; | |
| } | |
| .header-section h1 { | |
| font-size: 2em; | |
| margin: 0; | |
| color: white !important; | |
| } | |
| .header-section p { | |
| opacity: 0.9; | |
| margin: 5px 0 0; | |
| font-size: 1.05em; | |
| color: #e8e8ff !important; | |
| } | |
| /* Chat area */ | |
| .chatbot { | |
| border-radius: 12px !important; | |
| border: 1px solid #e2e8f0 !important; | |
| min-height: 450px !important; | |
| } | |
| /* Source cards */ | |
| .source-card { | |
| background: #f8fafc; | |
| border: 1px solid #e2e8f0; | |
| border-radius: 8px; | |
| padding: 10px 14px; | |
| margin: 4px 0; | |
| font-size: 0.9em; | |
| } | |
| .source-card strong { | |
| color: #6366f1; | |
| } | |
| /* Override dark mode */ | |
| .dark .source-card { | |
| background: #1e293b; | |
| border-color: #334155; | |
| } | |
| /* Buttons */ | |
| .primary-btn { | |
| background: linear-gradient(135deg, #667eea, #764ba2) !important; | |
| border: none !important; | |
| color: white !important; | |
| border-radius: 10px !important; | |
| font-weight: 600 !important; | |
| padding: 10px 24px !important; | |
| } | |
| .primary-btn:hover { | |
| opacity: 0.9 !important; | |
| transform: translateY(-1px); | |
| box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4) !important; | |
| } | |
| """ | |
| # ─── Initialize chain on startup ──────────────────────────── | |
| print("🔄 Initializing Study Ocean AI Mentor...") | |
| chain = get_chain() | |
| print("✅ Ready to answer student doubts!\n") | |
| def format_sources(sources: list) -> str: | |
| """Format source documents into a readable string.""" | |
| if not sources: | |
| return "" | |
| lines = ["\n\n---\n📖 **Sources Referenced:**\n"] | |
| for i, src in enumerate(sources, 1): | |
| lines.append(f"**{i}.** `{src['subject']}` → _{src['file']}_") | |
| return "\n".join(lines) | |
| def respond(message: str, chat_history: list) -> tuple: | |
| """Handle a student's question and return the mentor's response.""" | |
| if not message.strip(): | |
| return "", chat_history | |
| # Get answer from RAG chain | |
| result = ask_question(chain, message) | |
| answer = result["answer"] | |
| sources = result["sources"] | |
| # Append source references to the answer | |
| answer_with_sources = answer + format_sources(sources) | |
| # Update chat history | |
| chat_history.append((message, answer_with_sources)) | |
| return "", chat_history | |
| def clear_chat(): | |
| """Clear the chat history.""" | |
| return [], "" | |
| # ─── Build Gradio Interface ───────────────────────────────── | |
| with gr.Blocks(title="Study Ocean AI Mentor") as app: | |
| # Header | |
| gr.HTML(""" | |
| <div class="header-section"> | |
| <h1>🎓 Study Ocean AI Mentor</h1> | |
| <p>Ask any doubt from your study material — I'll explain it step by step!</p> | |
| </div> | |
| """) | |
| # Chatbot | |
| chatbot = gr.Chatbot( | |
| label="💬 Chat with Your Mentor", | |
| elem_classes=["chatbot"], | |
| height=480, | |
| avatar_images=(None, "https://api.dicebear.com/7.x/bottts/svg?seed=mentor&backgroundColor=6366f1"), | |
| ) | |
| # Input area | |
| with gr.Row(): | |
| msg = gr.Textbox( | |
| placeholder="Type your doubt here... e.g., 'Explain Newton's third law with examples'", | |
| label="Your Question", | |
| scale=5, | |
| lines=1, | |
| max_lines=3, | |
| show_label=False, | |
| container=False, | |
| ) | |
| submit_btn = gr.Button("Ask 🚀", elem_classes=["primary-btn"], scale=1) | |
| # Action buttons | |
| with gr.Row(): | |
| clear_btn = gr.Button("🗑️ Clear Chat", size="sm") | |
| # Example questions | |
| gr.Examples( | |
| examples=[ | |
| "What are Newton's laws of motion? Explain with examples.", | |
| "Explain the difference between mitosis and meiosis.", | |
| "What is the Pythagorean theorem and how do I use it?", | |
| "Explain the concept of supply and demand in economics.", | |
| "What are the key features of the Indian Constitution?", | |
| "Solve: Find the derivative of f(x) = 3x² + 2x - 5", | |
| ], | |
| inputs=msg, | |
| label="💡 Try these example questions:", | |
| ) | |
| # Tips section | |
| with gr.Accordion("📌 Tips for Better Answers", open=False): | |
| gr.Markdown(""" | |
| - **Be specific**: Instead of "explain physics", ask "explain projectile motion with examples" | |
| - **Mention the topic**: "In organic chemistry, what is an SN2 reaction?" | |
| - **Ask for steps**: "Solve step by step: integrate sin(x)cos(x) dx" | |
| - **Request comparisons**: "Compare TCP and UDP protocols" | |
| - **Ask for formulas**: "List all the trigonometric identities" | |
| """) | |
| # Event handlers | |
| msg.submit(respond, [msg, chatbot], [msg, chatbot]) | |
| submit_btn.click(respond, [msg, chatbot], [msg, chatbot]) | |
| clear_btn.click(clear_chat, outputs=[chatbot, msg]) | |
| # ─── Launch ───────────────────────────────────────────────── | |
| if __name__ == "__main__": | |
| app.launch( | |
| server_name="0.0.0.0", | |
| server_port=7860, | |
| share=False, | |
| show_error=True, | |
| css=CUSTOM_CSS, | |
| theme=gr.themes.Soft(), | |
| ) | |