Update app.py

app.py

@@ -1,331 +1,102 @@
-import gradio as gr
-from langchain.prompts import ChatPromptTemplate
-from langchain_huggingface import HuggingFaceEndpoint
-from langchain.schema import HumanMessage, SystemMessage
 import os
-import time
-import logging
-import re
-
-logging.basicConfig(level=logging.INFO)
-logger = logging.getLogger(__name__)
-
-llm = HuggingFaceEndpoint(
-   repo_id="HuggingFaceH4/zephyr-7b-beta",
-   temperature=0.7,
-   top_p=0.9,
-   repetition_penalty=1.1,
-   model_kwargs={"max_length": 1024},
-   huggingfacehub_api_token=os.getenv("HUGGINGFACEHUB_API_TOKEN")
-)
-
-math_template = ChatPromptTemplate.from_messages([
-   ("system", """{system_message}
-
-You are an expert math tutor. For every math problem:
-1. Break it down into key concepts
-2. Breifly explain concepts
-3. Outline the process for solving a similar problem
-
-Be comprehensive and educational. Structure your response clearly."""),
-   ("human", "{question}")
-])
-
-research_template = ChatPromptTemplate.from_messages([
-   ("system", """{system_message}
-
-You are a research skills mentor. Help students with:
-- Determining the validity of sources
-- Evaluating source credibility and bias if a source is mentioned
-- Proper citation formats (APA, MLA, Chicago, etc.)
-- Research strategies and methodologies
-- Academic writing techniques and structure
-- Database navigation and search strategies
-
-Provide detailed, actionable advice with specific examples."""),
-   ("human", "{question}")
-])
-
-study_template = ChatPromptTemplate.from_messages([
-   ("system", """{system_message}
-
-You are a study skills coach. Help students with:
-- Effective study methods for different learning styles
-- Time management and scheduling techniques
-- Memory techniques and retention strategies
-- Test preparation and exam strategies
-- Note-taking methods and organization
-- Learning style optimization
-- Offer short quiz sessions where you pose one to two questions at a time, then provide feedback on the students answers.
-
-Provide comprehensive, personalized advice with practical examples."""),
-   ("human", "{question}")
-])
-
-general_template = ChatPromptTemplate.from_messages([
-   ("system", """{system_message}
-
-You are EduBot, a comprehensive AI learning assistant. You help students with:
-📐 Mathematics (Concise explainations rooted in understanding the concepts and process rather than answering the math problem directly)
-🔍 Research skills (source guidance, research advice, evaluation, and citation)
-📚 Study strategies (effective learning techniques and exam preparation)
-🛠️ Educational tools (guidance on learning resources and technologies)
-
-Always be encouraging, patient, thorough, and comprehensive."""),
-   ("human", "{question}")
-])
-
-def detect_subject(message):
-   message_lower = message.lower()
-   
-   math_keywords = ['math', 'solve', 'calculate', 'equation', 'formula', 'algebra', 'geometry', 'calculus', 'derivative', 'integral', 'theorem', 'proof']
-   research_keywords = ['research', 'source', 'citation', 'bibliography', 'reference', 'academic', 'paper', 'essay', 'thesis', 'database', 'journal']
-   study_keywords = ['study', 'memorize', 'exam', 'test', 'quiz', 'review', 'learn', 'remember', 'focus', 'motivation', 'notes']
-   
-   if any(keyword in message_lower for keyword in math_keywords):
-       return math_template, "🧮 Math Mode"
-   elif any(keyword in message_lower for keyword in research_keywords):
-       return research_template, "🔍 Research Mode"
-   elif any(keyword in message_lower for keyword in study_keywords):
-       return study_template, "📚 Study Mode"
-   else:
-       return general_template, "🎓 General Mode"
-
-def smart_truncate(text, max_length=3000):
-   if len(text) <= max_length:
-       return text
-   
-   sentences = re.split(r'(?<=[.!?]) +', text[:max_length])
-   if len(sentences) > 1:
-       return ' '.join(sentences[:-1]) + "... [Response truncated - ask for continuation]"
-   else:
-       words = text[:max_length].split()
-       return ' '.join(words[:-1]) + "... [Response truncated - ask for continuation]"
-
-def respond_with_enhanced_streaming(
-   message,
-   history,
-   max_tokens=600,
-   temperature=0.7,
-   top_p=0.9,
-):
-   try:
-       template, mode = detect_subject(message)
-       chain = template | llm
-       
-       yield f"*{mode}*\n\nGenerating response..."
-       
-       logger.info(f"Processing {mode} query: {message[:50]}...")
-       
-       response = chain.invoke({
-           "question": message,
-           "system_message": "You are EduBot, an expert AI learning assistant. Provide comprehensive, educational responses that help students truly understand concepts."
-       })
-       
-       response = smart_truncate(response, max_length=3000)
-       
-       words = response.split()
-       partial_response = f"*{mode}*\n\n"
-       
-       for i, word in enumerate(words):
-           partial_response += word + " "
-           
-           if i % 4 == 0:
-               yield partial_response
-               time.sleep(0.03)
-       
-       final_response = f"*{mode}*\n\n{response}"
-       logger.info(f"Response completed. Length: {len(response)} characters")
-       yield final_response
-       
-   except Exception as e:
-       logger.exception("Error in LangChain response generation")
-       yield f"Sorry, I encountered an error: {str(e)[:150]}"
-
-theme = gr.themes.Glass(
-   primary_hue="amber",
-   text_size="md",
-   radius_size="md",
-).set(
-   shadow_drop='*shadow_drop_lg',
-   shadow_drop_lg='*shadow_drop',
-   shadow_spread='*shadow_drop_lg',
-   block_info_text_weight='500',
-   button_border_width='*block_border_width'
-)
-
-with gr.Blocks(theme=theme, css="""
-   .main-container {
-       max-width: 900px;
-       margin: 0 auto;
-       padding: 1rem;
-       height: 100vh;
-       display: flex;
-       flex-direction: column;
-   }
-   .title {
-       text-align: center;
-       font-size: clamp(1.8rem, 4vw, 2.5rem);
-       font-weight: bold;
-       color: #d97706;
-       margin-bottom: 1rem;
-       flex-shrink: 0;
-   }
-   .chat-container {
-       flex: 1;
-       display: flex;
-       flex-direction: column;
-       min-height: 0;
-       margin-bottom: 1rem;
-   }
-   .gradio-chatbot {
-       flex: 1 !important;
-       height: auto !important;
-       min-height: 400px;
-       max-height: calc(100vh - 200px);
-   }
-   .chat-bot .message-wrap .avatar-container {
-       display: none !important;
-   }
-   .gradio-chatbot .message-wrap .avatar-container {
-       display: none !important;
-   }
-   .gradio-chatbot .message.bot .avatar-container,
-   .gradio-chatbot .message.user .avatar-container {
-       display: none !important;
-   }
-   .input-row {
-       flex-shrink: 0;
-       margin-top: 0.5rem;
-       display: flex;
-       justify-content: center;
-       align-items: center;
-       gap: 10px;
-       max-width: 700px;
-       margin-left: auto;
-       margin-right: auto;
-   }
-   .custom-textbox {
-       flex: 1;
-       min-width: 400px;
-   }
-   .custom-textbox > div {
-       width: 100% !important;
-   }
-   .custom-textbox textarea {
-       border-radius: 12px !important;
-       border: 1pt solid #64748b !important;
-       padding: 15px 20px !important;
-       font-size: 16px !important;
-       background: white !important;
-       outline: none !important;
-       box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
-       transition: all 0.3s ease !important;
-       min-height: 100px !important;
-       resize: vertical !important;
-       width: 100% !important;
-   }
-   .custom-textbox textarea:focus {
-       border-color: #475569 !important;
-       box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.1) !important;
-   }
-   .custom-textbox label {
-       display: none !important;
-   }
-   .send-button {
-       border-radius: 50% !important;
-       width: 50px !important;
-       height: 50px !important;
-       display: flex !important;
-       align-items: center !important;
-       justify-content: center !important;
-       flex-shrink: 0 !important;
-   }
-   @media (max-width: 768px) {
-       .main-container {
-           padding: 0.5rem;
-       }
-       .title {
-           font-size: 1.5rem;
-           margin-bottom: 0.5rem;
-       }
-       .gradio-chatbot {
-           min-height: 300px;
-           max-height: calc(100vh - 150px);
-       }
-       .input-row {
-           margin-top: 0.25rem;
-           max-width: 100%;
-           padding: 0 0.5rem;
-       }
-       .custom-textbox {
-           min-width: 250px;
-       }
-       .custom-textbox textarea {
-           min-height: 80px !important;
-           font-size: 14px !important;
-       }
-   }
-   @media (min-width: 769px) and (max-width: 1024px) {
-       .gradio-chatbot {
-           min-height: 450px;
-           max-height: calc(100vh - 180px);
-       }
-   }
-   @media (min-width: 1025px) {
-       .gradio-chatbot {
-           min-height: 500px;
-           max-height: calc(100vh - 200px);
-       }
-   }
-   @media (max-height: 500px) and (orientation: landscape) {
-       .title {
-           font-size: 1.2rem;
-           margin-bottom: 0.25rem;
-       }
-       .gradio-chatbot {
-           min-height: 200px;
-           max-height: calc(100vh - 100px);
-       }
-   }
-""") as demo:
-   with gr.Column(elem_classes=["main-container"]):
-       gr.HTML("""
-       <div class='title'>🎓 EduBot</div>
-       """)
-       with gr.Column(elem_classes=["chat-container"]):
-           chatbot = gr.Chatbot(
-               show_copy_button=True,
-               avatar_images=[None, None],
-               placeholder="Hi! I'm EduBot. What would you like to learn today? 📚",
-               container=True,
-               elem_classes=["gradio-chatbot"]
-           )
-       with gr.Row(elem_classes=["input-row"]):
-           msg = gr.Textbox(
-               placeholder="Ask me about math, research, study strategies, or any educational topic...",
-               container=False,
-               show_label=False,
-               elem_classes=["custom-textbox"],
-               lines=4,
-               max_lines=8
-           )
-           send_btn = gr.Button("📤", variant="primary", elem_classes=["send-button"])
-   def respond_and_update(message, history):
-       for response in respond_with_enhanced_streaming(message, history):
-           history.append([message, response])
-           yield history, ""
-   msg.submit(
-       respond_and_update,
-       [msg, chatbot],
-       [chatbot, msg]
-   )
-   send_btn.click(
-       respond_and_update,
-       [msg, chatbot],
-       [chatbot, msg]
-   )
+import openai
+import gradio as gr
 
-if __name__ == "__main__":
-   logger.info("Starting EduBot with custom styling...")
-   demo.launch()
+openai.api_key = os.environ.get("OPENAI_API_KEY")
+
+# Gradio + OpenAI Chatbot
+def chat_with_openai(message, history):
+    history_openai_format = [
+        {"role": "user" if h["role"] == "user" else "assistant", "content": h["content"]}
+        for h in history
+    ]
+
+    history_openai_format.append({"role": "user", "content": message})
+
+    response = openai.chat.completions.create(
+        model="gpt-4o-mini",
+        messages=history_openai_format,
+    )
+
+    return response.choices[0].message["content"]
+
+# Custom CSS
+css = """
+/* Chat container */
+#chatbot {
+    height: 600px !important;
+    overflow-y: auto !important;
+    border-radius: 16px !important;
+    border: 1pt solid #d1d5db !important;
+    padding: 15px !important;
+    background: white !important;
+    box-shadow: 0 2px 6px rgba(0,0,0,0.05) !important;
+}
+
+/* Messages */
+.message {
+    border-radius: 12px !important;
+    padding: 10px 15px !important;
+    margin: 8px 0 !important;
+}
+.message.user {
+    background: #f1f5f9 !important; /* light slate */
+    color: #0f172a !important;
+}
+.message.assistant {
+    background: #e0f2fe !important; /* light blue */
+    color: #1e3a8a !important;
+}
+
+/* Textbox (force textarea style) */
+.custom-textbox textarea {
+    border-radius: 12px !important;
+    border: 1pt solid #64748b !important;  /* slate border */
+    padding: 15px 20px !important;
+    font-size: 16px !important;
+    background: white !important;
+    outline: none !important;
+    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
+    transition: all 0.3s ease !important;
+    min-height: 100px !important;  /* rectangle instead of flat line */
+    resize: vertical !important;
+}
+.custom-textbox textarea:focus {
+    border-color: #3b82f6 !important; /* blue focus */
+    box-shadow: 0 4px 8px rgba(59,130,246,0.2) !important;
+}
+
+/* Send button */
+button {
+    border-radius: 12px !important;
+    background: #3b82f6 !important;
+    color: white !important;
+    padding: 12px 18px !important;
+    font-size: 16px !important;
+    border: none !important;
+    transition: background 0.3s ease !important;
+}
+button:hover {
+    background: #2563eb !important;
+}
+"""
+
+# Gradio UI
+with gr.Blocks(css=css) as demo:
+    chatbot = gr.Chatbot(elem_id="chatbot", bubble_full_width=False, height=600)
+
+    with gr.Row():
+        msg = gr.Textbox(
+            placeholder="Ask me about math, research, study strategies, or any educational topic...",
+            container=False,
+            show_label=False,
+            elem_classes=["custom-textbox"],
+            lines=3,
+            max_lines=6
+        )
+        submit = gr.Button("Send", scale=0)
+
+    msg.submit(chat_with_openai, [msg, chatbot], chatbot)
+    submit.click(chat_with_openai, [msg, chatbot], chatbot)
+
+demo.launch()