Update app.py

app.py

@@ -157,7 +157,7 @@ def get_health_professionals_and_map(location, query):
     except Exception as e:
         return [f"An error occurred: {e}"], ""
 
-# Main Application Functionality
+# Main Application Logic
 def app_function(user_input, location, query, history):
     chatbot_history, _ = generate_chatbot_response(user_input, history)
     sentiment_result = analyze_sentiment(user_input)
@@ -173,84 +173,61 @@ body {
     background: linear-gradient(135deg, #0d0d0d, #ff5722);
     color: white;
 }
-
 h1 {
-    background: #ffffff;
-    color: #000000;
-    border-radius: 8px;
-    padding: 10px;
-    font-weight: bold;
     text-align: center;
-    font-size: 2.5rem;
-}
-
-textarea, input {
-    background: transparent;
-    color: black;
-    border: 2px solid orange;
-    padding: 8px;
-    font-size: 1rem;
-    caret-color: black;
-    outline: none;
-    border-radius: 8px;
-}
-
-textarea:focus, input:focus {
-    background: transparent;
-    color: black;
-    border: 2px solid orange;
-    outline: none;
-}
-
-textarea:hover, input:hover {
-    background: transparent;
-    color: black;
-    border: 2px solid orange;
+    color: white;
+    font-size: 36px;
+    font-weight: bold;
 }
-
-.df-container {
-    background: white;
-    color: black;
-    border: 2px solid orange;
-    border-radius: 10px;
+textarea {
+    width: 100%;
+    height: 150px;
+    background-color: #333333;
+    color: white;
+    border: 1px solid #ff5722;
+    border-radius: 5px;
+    font-size: 16px;
     padding: 10px;
-    font-size: 14px;
-    max-height: 400px;
-    overflow-y: auto;
 }
-
-#suggestions-title {
-    text-align: center;
-    font-weight: bold;
-    color: white; /* Text in white */
-    font-size: 3rem; /* Bigger size for suggestions */
-    margin-bottom: 20px;
+button {
+    background-color: #ff5722;
+    color: white;
+    font-size: 16px;
+    padding: 10px 20px;
+    border-radius: 5px;
+    border: none;
+    cursor: pointer;
+}
+button:hover {
+    background-color: #e64a19;
 }
 """
 
-# Gradio App
+# Gradio Interface Setup
 with gr.Blocks(css=custom_css) as app:
-    gr.HTML("<h1>🌟 Well-Being Companion</h1>")
+    gr.Markdown("# 🌟 Mental Health Chatbot App")
     with gr.Row():
-        user_input = gr.Textbox(label="Your Message")
-        location = gr.Textbox(label="Your Location")
-        query = gr.Textbox(label="Search Query")
-    chatbot = gr.Chatbot(label="Chat History")
-    sentiment = gr.Textbox(label="Detected Sentiment")
-    emotion = gr.Textbox(label="Detected Emotion")
+        chatbot_output = gr.Chatbot(label="Chat History", elem_id="chatbox")
+        user_input = gr.Textbox(label="Your Message", placeholder="Type something...", interactive=True)
     
-    # Suggestions Title
-    gr.Markdown("Suggestions", elem_id="suggestions-title")
+    gr.Markdown("### Sentiment, Emotion, and Suggestions")
+    sentiment_output = gr.Textbox(label="Sentiment Analysis")
+    emotion_output = gr.Textbox(label="Emotion Detected")
+    suggestions_output = gr.DataFrame(headers=["Title", "Link"], label="Suggestions")
     
-    suggestions = gr.DataFrame(headers=["Title", "Link"])  # Table for suggestions
-    professionals = gr.Textbox(label="Nearby Professionals", lines=6)
-    map_html = gr.HTML(label="Interactive Map")
-    submit = gr.Button(value="Submit", variant="primary")
-
-    submit.click(
+    gr.Markdown("### Locate Health Professionals (Optional)")
+    location_input = gr.Textbox(label="Your Location")
+    query_input = gr.Textbox(label="Query (e.g., therapist, clinic)", placeholder="Type something...", interactive=True)
+    
+    professionals_output = gr.DataFrame(headers=["Professional", "Address"], label="Nearby Professionals")
+    map_output = gr.HTML(label="Map of Professionals")
+    
+    submit_button = gr.Button(value="Submit", elem_id="submit-btn")
+    submit_button.click(
         app_function,
-        inputs=[user_input, location, query, chatbot],
-        outputs=[chatbot, sentiment, emotion, suggestions, professionals, map_html],
+        inputs=[user_input, location_input, query_input, chatbot_output],
+        outputs=[chatbot_output, sentiment_output, emotion_output, suggestions_output, professionals_output, map_output]
     )
 
-app.launch()
+# Run the App
+app.launch(share=True)