Update app.py

app.py

@@ -262,17 +262,11 @@ with gr.Blocks() as app:
     gr.HTML("<h1>🌟 Well-Being Companion</h1>")
     
     # Theme Dropdown
-    themes = [
-        "calm_seafoam",
-        "Ranko_test"
-    ]
-    
-    theme_dropdown = gr.Dropdown(choices=themes, label="Select Theme")
-
-    toggle_dark = gr.Button(value="Toggle Dark", scale=1)  
+    theme_dropdown = gr.Dropdown(choices=["calm_seafoam", "Ranko_test"], label="Select Theme")
+    theme_state = gr.State("calm_seafoam")  # Default Theme
 
-    def switch_theme(theme):
-        """Switch CSS theme based on dropdown selection."""
+    def update_theme(theme):
+        """Update the theme based on user selection."""
         return f"""
         () => {{
             const themeElem = document.createElement('link');
@@ -282,9 +276,15 @@ with gr.Blocks() as app:
         }}
         """
 
-    theme_dropdown.change(switch_theme, inputs=theme_dropdown, outputs=[])
+    theme_dropdown.change(update_theme, inputs=theme_dropdown, outputs=[])
+
+    toggle_dark = gr.Button(value="Toggle Dark", scale=1)  
+
+    # Moving dark mode functionality to a Python function
+    def toggle_dark_mode():
+        return "dark" if "dark" not in app.state else ""
 
-    toggle_dark.click(lambda: None, None, None)  # Just a placeholder for a dark mode operation
+    toggle_dark.click(toggle_dark_mode, None, theme_state)
 
     with gr.Tab("Well-Being Chatbot"):
         with gr.Row():