Update app.py

app.py

@@ -1130,66 +1130,42 @@ def add_agentic_ai_info():
 
 def create_chatbot():
     """Create the Gradio interface for the chatbot"""
+    # Generate a random session ID for the user
     session_id = str(uuid.uuid4())
-
+    
+    # Define theme colors and styling
     primary_color = "#4a6fa5"
     secondary_color = "#6c757d"
     success_color = "#28a745"
     light_color = "#f8f9fa"
     dark_color = "#343a40"
-
+    
     custom_css = f"""
         :root {{
             --primary-color: {primary_color};
             --secondary-color: {secondary_color};
             --success-color: {success_color};
-            --light-bg: {light_color};
-            --dark-bg: {dark_color};
-            --text-light: #212529;
-            --text-dark: #f1f1f1;
-        }}
-
-        .gradio-container {{
-            background-color: var(--light-bg);
-            color: var(--text-light);
-            font-family: 'Inter', 'Segoe UI', sans-serif;
-        }}
-
-        .gr-markdown-output, .gr-textbox textarea {{
-            color: var(--text-light);
-            background-color: white;
+            --light-color: {light_color};
+            --dark-color: {dark_color};
         }}
-
-        @media (prefers-color-scheme: dark) {{
-            .gradio-container {{
-                background-color: var(--dark-bg);
-                color: var(--text-dark);
-            }}
-            .gr-markdown-output, .gr-textbox textarea {{
-                color: var(--text-dark);
-                background-color: #1e1e1e;
-            }}
-            .card {{
-                background-color: #2c2c2c;
-            }}
+        .gradio-container {{ 
+            background-color: var(--light-color); 
+            font-family: 'Inter', 'Segoe UI', sans-serif; 
         }}
-
-        #title {{
-            font-size: 32px;
-            font-weight: bold;
-            text-align: center;
-            padding-top: 20px;
+        #title {{ 
+            font-size: 32px; 
+            font-wedef create_chatbot()ight: bold; 
+            text-align: center; 
+            padding-top: 20px; 
             color: var(--primary-color);
             margin-bottom: 0;
         }}
-
-        #subtitle {{
-            font-size: 18px;
-            text-align: center;
-            margin-bottom: 20px;
-            color: var(--secondary-color);
+        #subtitle {{ 
+            font-size: 18px; 
+            text-align: center; 
+            margin-bottom: 20px; 
+            color: var(--secondary-color); 
         }}
-
         .card {{
             background-color: white;
             padding: 20px;
@@ -1197,23 +1173,18 @@ def create_chatbot():
             box-shadow: 0 4px 10px rgba(0,0,0,0.08);
             margin-bottom: 20px;
         }}
-
         .tabs {{
             margin-top: 20px;
         }}
-
-        .gr-button-primary {{
-            background-color: var(--primary-color) !important;
+        .gr-button-primary {{ 
+            background-color: var(--primary-color) !important; 
         }}
-
-        .gr-button-secondary {{
-            background-color: var(--secondary-color) !important;
+        .gr-button-secondary {{ 
+            background-color: var(--secondary-color) !important; 
         }}
-
-        .gr-button-success {{
-            background-color: var(--success-color) !important;
+        .gr-button-success {{ 
+            background-color: var(--success-color) !important; 
         }}
-
         .footer {{
             text-align: center;
             margin-top: 30px;
@@ -1221,18 +1192,15 @@ def create_chatbot():
             font-size: 14px;
             color: var(--secondary-color);
         }}
-
         .progress-module {{
             padding: 10px;
             margin: 5px 0;
             border-radius: 5px;
             background-color: #e9ecef;
         }}
-
         .progress-module.completed {{
             background-color: #d4edda;
         }}
-
         .info-box {{
             background-color: #e7f5fe;
             border-left: 4px solid var(--primary-color);
@@ -1241,38 +1209,44 @@ def create_chatbot():
             border-radius: 4px;
         }}
     """
-
+    
     with gr.Blocks(css=custom_css, theme=gr.themes.Soft(primary_hue="blue")) as demo:
         gr.HTML("<div id='title'>🎓 AI Teaching Assistant</div>")
         gr.HTML("<div id='subtitle'>Your personalized learning companion for Python, Data Science & AI</div>")
-
-        with gr.Tabs(elem_classes=["tabs"]):
+        
+        # Tabs for different sections
+        with gr.Tabs(elem_classes=["tabs"]) as tabs:
+            # Profile Tab
             with gr.Tab("Profile & Goals"):
                 with gr.Column(elem_classes=["card"]):
                     gr.HTML("<h3>Complete Your Learning Profile</h3>")
-
+                    
                     with gr.Row():
                         with gr.Column(scale=1):
-                            age_input = gr.Textbox(label="Age", placeholder="e.g. 20", lines=1)
+                            age_input = gr.Textbox(
+                                label="Age", 
+                                placeholder="e.g. 20",
+                                lines=1
+                            )
                         with gr.Column(scale=2):
                             knowledge_level_input = gr.Dropdown(
                                 choices=["Beginner", "Intermediate", "Advanced", "Expert"],
                                 label="Knowledge Level",
                                 value="Beginner"
                             )
-
+                    
                     goals_input = gr.Textbox(
-                        label="Learning Goals",
-                        placeholder="e.g. I want to become a data scientist...",
+                        label="Learning Goals", 
+                        placeholder="e.g. I want to become a data scientist and work with machine learning models",
                         lines=2
                     )
-
+                    
                     interests_input = gr.Textbox(
-                        label="Specific Interests",
-                        placeholder="e.g. Python, data visualization...",
+                        label="Specific Interests", 
+                        placeholder="e.g. Python, data visualization, neural networks",
                         lines=2
                     )
-
+                    
                     with gr.Row():
                         with gr.Column(scale=1):
                             study_time_input = gr.Dropdown(
@@ -1282,17 +1256,15 @@ def create_chatbot():
                             )
                         with gr.Column(scale=2):
                             learning_style_input = gr.Dropdown(
-                                choices=[
-                                    "Visual", "Reading/Writing", "Hands-on Projects",
-                                    "Video Tutorials", "Interactive Exercises", "Combination"
-                                ],
+                                choices=["Visual", "Reading/Writing", "Hands-on Projects", "Video Tutorials", "Interactive Exercises", "Combination"],
                                 label="Preferred Learning Style",
                                 value="Combination"
                             )
-
+                    
                     profile_submit_btn = gr.Button("Save Profile & Generate Recommendations", variant="primary")
                     profile_output = gr.Markdown(label="Personalized Recommendations")
-
+            
+            # Chat Tab
             with gr.Tab("Learning Assistant"):
                 with gr.Row():
                     with gr.Column(elem_classes=["card"]):
@@ -1301,74 +1273,110 @@ def create_chatbot():
                             placeholder="Ask anything about Python, Data Science, AI...",
                             lines=3
                         )
+                        
                         with gr.Row():
                             chat_submit_btn = gr.Button("Send Message", variant="primary")
                             chat_clear_btn = gr.Button("Clear Chat", variant="secondary")
+                        
                         chat_output = gr.Markdown(label="Assistant Response")
-
+            
+            # Resources Tab
             with gr.Tab("Resources & Recommendations"):
                 with gr.Column(elem_classes=["card"]):
                     gr.HTML("<h3>Your Learning Resources</h3>")
                     refresh_recommendations_btn = gr.Button("Refresh Recommendations", variant="primary")
                     recommendations_output = gr.Markdown(label="Personalized Recommendations")
-
+            
+            # Practice Tab
             with gr.Tab("Practice & Assessment"):
                 with gr.Column(elem_classes=["card"]):
                     gr.HTML("<h3>Generate a Quiz</h3>")
+                    
                     with gr.Row():
-                        quiz_topic_input = gr.Textbox(label="Quiz Topic", placeholder="e.g. Python Lists")
+                        quiz_topic_input = gr.Textbox(
+                            label="Quiz Topic", 
+                            placeholder="e.g. Python Lists",
+                            lines=1
+                        )
                         quiz_difficulty_input = gr.Dropdown(
                             choices=["Beginner", "Intermediate", "Advanced"],
                             label="Difficulty Level",
                             value="Beginner"
                         )
+                    
                     generate_quiz_btn = gr.Button("Generate Quiz", variant="primary")
                     quiz_output = gr.Markdown(label="Quiz")
-
+            
+            # Study Plan Tab
             with gr.Tab("Study Plan"):
                 with gr.Column(elem_classes=["card"]):
                     gr.HTML("<h3>Generate a Personalized Study Plan</h3>")
+                    
                     with gr.Row():
-                        plan_topic_input = gr.Textbox(label="Study Topic", placeholder="e.g. Data Science")
+                        plan_topic_input = gr.Textbox(
+                            label="Study Topic", 
+                            placeholder="e.g. Data Science",
+                            lines=1
+                        )
                         plan_time_input = gr.Dropdown(
                             choices=["1-3", "4-6", "7-10", "10+"],
                             label="Hours Available Weekly",
                             value="4-6"
                         )
+                    
                     generate_plan_btn = gr.Button("Generate Study Plan", variant="primary")
                     plan_output = gr.Markdown(label="Personalized Study Plan")
-
-        gr.HTML("""<div class="footer">AI Teaching Assistant | Version 2.0 | © 2025 | Powered by Groq AI</div>""")
-
+        
+        gr.HTML("""<div class="footer">
+            AI Teaching Assistant | Version 2.0 | © 2025 | Powered by Groq AI
+        </div>""")
+        
         # Event handlers
-        profile_submit_btn.click(user_onboarding, 
-                                 inputs=[
-                                     gr.State(session_id), age_input, goals_input, 
-                                     knowledge_level_input, interests_input,
-                                     study_time_input, learning_style_input
-                                 ], 
-                                 outputs=profile_output)
-
-        chat_submit_btn.click(chatbot_interface,
-                              inputs=[gr.State(session_id), chat_input],
-                              outputs=chat_output)
-
-        chat_clear_btn.click(lambda: "", inputs=[], outputs=[chat_output, chat_input])
-
-        refresh_recommendations_btn.click(generate_recommendations,
-                                          inputs=[gr.State(session_id)],
-                                          outputs=recommendations_output)
-
-        generate_quiz_btn.click(handle_quiz_request,
-                                inputs=[gr.State(session_id), quiz_topic_input, quiz_difficulty_input],
-                                outputs=quiz_output)
-
-        generate_plan_btn.click(handle_study_plan_request,
-                                inputs=[gr.State(session_id), plan_topic_input, plan_time_input],
-                                outputs=plan_output)
-
+        profile_submit_btn.click(
+            user_onboarding,
+            inputs=[
+                gr.State(session_id), 
+                age_input, 
+                goals_input, 
+                knowledge_level_input,
+                interests_input,
+                study_time_input,
+                learning_style_input
+            ],
+            outputs=profile_output
+        )
+        
+        chat_submit_btn.click(
+            chatbot_interface,
+            inputs=[gr.State(session_id), chat_input],
+            outputs=chat_output
+        )
+        
+        chat_clear_btn.click(
+            lambda: "",
+            inputs=[],
+            outputs=[chat_output, chat_input]
+        )
+        
+        refresh_recommendations_btn.click(
+            generate_recommendations,
+            inputs=[gr.State(session_id)],
+            outputs=recommendations_output
+        )
+        
+        generate_quiz_btn.click(
+            handle_quiz_request,
+            inputs=[gr.State(session_id), quiz_topic_input, quiz_difficulty_input],
+            outputs=quiz_output
+        )
+        
+        generate_plan_btn.click(
+            handle_study_plan_request,
+            inputs=[gr.State(session_id), plan_topic_input, plan_time_input],
+            outputs=plan_output
+        )
+    
     return demo
-
 if __name__ == "__main__":
     app = create_chatbot()
-    app.launch()
+    app.launch()