Update app.py

app.py

@@ -1,10 +1,6 @@
 """
 LifeAdmin AI - Main Gradio Application
 Hackathon Project: Track 2 - MCP in Action
-Hugging Face MCP Birthday Hackathon
-
-An autonomous life management agent with real MCP tool servers,
-RAG-enabled document search, and voice control.
 """
 
 import gradio as gr
@@ -26,19 +22,21 @@ Path("data/uploads").mkdir(parents=True, exist_ok=True)
 Path("data/outputs").mkdir(parents=True, exist_ok=True)
 Path("data/chroma_db").mkdir(parents=True, exist_ok=True)
 
-# Initialize agent
 print("🤖 Initializing LifeAdmin AI Agent...")
 agent = LifeAdminAgent()
 print("✓ Agent initialized successfully!")
 
-# Custom CSS for beautiful UI
+# -------------------------------------------
+#   CUSTOM CSS  (Gradio 6: must be injected)
+# -------------------------------------------
 custom_css = """
+<style>
+
 /* Main container styling */
 .gradio-container {
     font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
     max-width: 1400px !important;
 }
-
 /* Header styling */
 .header-container {
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
@@ -48,301 +46,120 @@ custom_css = """
     margin-bottom: 2rem;
     box-shadow: 0 10px 30px rgba(102, 126, 234, 0.3);
 }
-
 .header-container h1 {
     margin: 0;
     font-size: 2.5rem;
     font-weight: 700;
-    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
 }
 
-.header-container p {
-    margin: 0.5rem 0 0 0;
-    opacity: 0.95;
-}
-
-/* Tool card styling */
+/* Tool card */
 .tool-card {
     border: 2px solid #e2e8f0;
     border-radius: 0.75rem;
     padding: 1.25rem;
-    transition: all 0.3s ease;
     background: white;
     margin: 0.5rem 0;
+    transition: all .3s;
 }
-
 .tool-card:hover {
     border-color: #667eea;
     box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
     transform: translateY(-2px);
 }
 
-/* Thought bubble styling */
-.thought-bubble {
-    background: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
-    border-left: 4px solid #667eea;
-    padding: 1rem;
-    margin: 0.75rem 0;
-    border-radius: 0.5rem;
-    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
-}
-
-/* Success banner */
-.success-banner {
-    background: linear-gradient(135deg, #c6f6d5 0%, #9ae6b4 100%);
-    color: #22543d;
-    padding: 1rem;
-    border-radius: 0.5rem;
-    border-left: 4px solid #38a169;
-    font-weight: 500;
-}
-
-/* Error banner */
-.error-banner {
-    background: linear-gradient(135deg, #fed7d7 0%, #fc8181 100%);
-    color: #742a2a;
-    padding: 1rem;
-    border-radius: 0.5rem;
-    border-left: 4px solid #e53e3e;
-    font-weight: 500;
-}
-
-/* Button styling */
 .primary-button {
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
-    border: none !important;
     color: white !important;
-    font-weight: 600 !important;
-    padding: 0.75rem 1.5rem !important;
-    border-radius: 0.5rem !important;
-    transition: all 0.3s ease !important;
 }
 
-.primary-button:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4) !important;
-}
-
-/* Tab styling */
-.tab-nav button {
-    font-weight: 500 !important;
-    padding: 0.75rem 1.5rem !important;
-}
-
-.tab-nav button.selected {
-    border-bottom: 3px solid #667eea !important;
-    color: #667eea !important;
-}
-
-/* File upload area */
-.upload-area {
-    border: 2px dashed #cbd5e0;
-    border-radius: 0.75rem;
-    padding: 2rem;
-    text-align: center;
-    transition: all 0.3s ease;
-}
-
-.upload-area:hover {
-    border-color: #667eea;
-    background: #f7fafc;
-}
-
-/* Status indicator */
-.status-indicator {
-    display: inline-block;
-    width: 10px;
-    height: 10px;
-    border-radius: 50%;
-    margin-right: 0.5rem;
-    animation: pulse 2s infinite;
-}
-
-@keyframes pulse {
-    0%, 100% { opacity: 1; }
-    50% { opacity: 0.5; }
-}
-
-.status-active {
-    background: #48bb78;
-}
-
-.status-processing {
-    background: #ed8936;
-}
-
-.status-error {
-    background: #f56565;
-}
-
-/* Footer styling */
 .footer {
     text-align: center;
     margin-top: 3rem;
     padding: 1.5rem;
-    border-top: 1px solid #e2e8f0;
     color: #718096;
 }
 
-/* Responsive adjustments */
-@media (max-width: 768px) {
-    .header-container h1 {
-        font-size: 1.75rem;
-    }
-    
-    .gradio-container {
-        padding: 1rem;
-    }
-}
-
-/* Custom scrollbar */
-::-webkit-scrollbar {
-    width: 8px;
-}
-
-::-webkit-scrollbar-track {
-    background: #f1f1f1;
-}
-
-::-webkit-scrollbar-thumb {
-    background: #667eea;
-    border-radius: 4px;
-}
-
-::-webkit-scrollbar-thumb:hover {
-    background: #764ba2;
-}
+</style>
 """
 
+# ---------------------------------------------------------
+# Create Gradio App (REMOVED: theme= , css= UNUSABLE NOW)
+# ---------------------------------------------------------
 def create_app():
-    """Create and configure the Gradio application"""
-
     app = gr.Blocks(
-        css=custom_css,
         title="LifeAdmin AI - Your Autonomous Life Management Agent",
         analytics_enabled=False
     )
 
-    # Apply theme AFTER creation
-    app.theme = gr.themes.Soft(
-        primary_hue="purple",
-        secondary_hue="blue",
-        neutral_hue="slate",
-        font=[gr.themes.GoogleFont("Inter"), "system-ui", "sans-serif"],
-    )
-
     with app:
+        # Inject CSS into the top of the app
+        gr.HTML(custom_css)
 
-        # Header
+        # --- HEADER ---
         with gr.Row():
             gr.HTML("""
                 <div class="header-container">
                     <h1>🤖 LifeAdmin AI</h1>
-                    <p style="font-size: 1.3rem; margin-top: 0.5rem;">
-                        Your Autonomous Life Management Agent
-                    </p>
-                    <p style="font-size: 0.95rem; margin-top: 0.75rem; opacity: 0.9;">
-                        Powered by 7 Real MCP Tool Servers • Built for Hugging Face Hackathon
-                    </p>
-                    <div style="margin-top: 1rem; display: flex; gap: 1.5rem; font-size: 0.9rem;">
-                        <div style="display: flex; align-items: center; gap: 0.5rem;">
-                            <span>⚡</span>
-                            <span>Autonomous Execution</span>
-                        </div>
-                        <div style="display: flex; align-items: center; gap: 0.5rem;">
-                            <span>🎤</span>
-                            <span>Voice Control</span>
-                        </div>
-                        <div style="display: flex; align-items: center; gap: 0.5rem;">
-                            <span>🔍</span>
-                            <span>RAG-Powered Search</span>
-                        </div>
-                        <div style="display: flex; align-items: center; gap: 0.5rem;">
-                            <span>💾</span>
-                            <span>Memory System</span>
-                        </div>
-                    </div>
+                    <p>Your Autonomous Life Management Agent</p>
                 </div>
             """)
 
-        with gr.Tabs() as tabs:
+        # --- MAIN TABS ---
+        with gr.Tabs():
 
-            with gr.Tab("📊 Manual Dashboard", id="manual"):
-                gr.Markdown("""
-                ### 🎯 Manual Mode
-                Upload files and use individual tools with full control.
-                """)
+            # Manual Dashboard
+            with gr.Tab("📊 Manual Dashboard"):
+                gr.Markdown("### 🎯 Manual Mode – Full Control Over Tools")
                 create_manual_dashboard(agent)
 
-            with gr.Tab("🎤 Voice Agent", id="voice"):
-                gr.Markdown("""
-                ### 🤖 Voice Agent Mode
-                Speak commands. Agent auto-plans and executes tasks.
-                """)
+            # Voice Agent
+            with gr.Tab("🎤 Voice Agent"):
+                gr.Markdown("### 🤖 Voice Agent – Speak Commands, Agent Executes")
                 create_voice_agent_ui(agent)
 
-            with gr.Tab("ℹ️ About", id="about"):
-                gr.Markdown("### About LifeAdmin AI ...")
-                # (your about text remains unchanged)
+            # About
+            with gr.Tab("ℹ️ About"):
+                gr.Markdown("### About LifeAdmin AI\nComplete documentation here...")
 
+        # Footer
         gr.HTML("""
-            <div class="footer">
-                <p style="font-size: 1.1rem; font-weight: 600; margin-bottom: 0.5rem;">
-                    🏆 Hugging Face MCP Birthday Hackathon Submission
-                </p>
-                <p style="margin-bottom: 0.25rem;">
-                    Track 2: MCP in Action | Built with Gradio 6 & Real MCP Tool Servers
-                </p>
-            </div>
+        <div class="footer">
+            <p>🏆 Hugging Face MCP Birthday Hackathon Submission</p>
+            <p>Track 2: MCP in Action | Built with Gradio 6</p>
+        </div>
         """)
 
     return app
 
 
+# ---------------------------------------------------------
+# MAIN ENTRY POINT
+# ---------------------------------------------------------
 if __name__ == "__main__":
     print("=" * 60)
     print("🚀 Starting LifeAdmin AI")
     print("=" * 60)
-    
-    # Setup LLM fallback chain
-    print("\n⚙️  Setting up LLM providers...")
+
+    print("\n⚙️ Setting up LLM providers...")
     try:
         setup_llm_fallback()
-        print("✓ LLM providers configured successfully!")
+        print("✓ LLM providers configured!")
     except Exception as e:
-        print(f"⚠️  Warning: {e}")
-        print("   Please set at least one API key (GROQ_API_KEY, OPENAI_API_KEY, etc.)")
-    
-    # Check for voice mode requirements
-    print("\n🎤 Checking voice mode requirements...")
-    if os.getenv('ELEVENLABS_API_KEY'):
-        print("✓ ElevenLabs API key found (TTS enabled)")
-    else:
-        print("⚠️  ElevenLabs API key not found (voice output disabled)")
-    
-    if os.getenv('GROQ_API_KEY'):
-        print("✓ Groq API key found (STT enabled)")
-    else:
-        print("⚠️  Groq API key not found (voice input disabled)")
-    
-    # Create and launch app
+        print(f"⚠️ Warning: {e}")
+
+    print("\n🎤 Checking voice requirements...")
+    print("✓ ElevenLabs API found" if os.getenv("ELEVENLABS_API_KEY") else "⚠️ Missing ElevenLabs API")
+    print("✓ Groq API found" if os.getenv("GROQ_API_KEY") else "⚠️ Missing Groq API")
+
     print("\n🎨 Creating Gradio interface...")
     app = create_app()
-    
+
     print("\n✅ LifeAdmin AI is ready!")
-    print("=" * 60)
-    print("\n📱 Access the app at: http://localhost:7860")
-    print("\n💡 Tips:")
-    print("   - Use Manual Mode for precise control")
-    print("   - Use Voice Mode for autonomous execution")
-    print("   - Upload files to enable document-based commands")
-    print("\n" + "=" * 60 + "\n")
-    
-    # Launch the application
+    print("📱 Open: http://localhost:7860")
+
     app.launch(
         server_name="0.0.0.0",
         server_port=int(os.getenv("GRADIO_SERVER_PORT", 7860)),
-        share=False,
         show_error=True,
         show_api=False
-    )
+    )