From 41c255abf247a4a77b0d737b38ddfca4338c60b1 Mon Sep 17 00:00:00 2001
From: Horus AI <horus@hostpioneers.com>
Date: Mon, 23 Mar 2026 18:02:39 +0100
Subject: [PATCH] feat(mission-control): new sidebar structure v3.0

- 10 categories: Command, Personal, Automation, Council, Projects, Trading, Leads, Memory, Sites, System
- Expand All / Collapse All buttons
- Open All by default: Command, Personal, Automation
- Logout button in footer
- All existing pages linked
---
 .../MissionControlDashboard.tsx               | 166 +++++++++++++++---
 1 file changed, 137 insertions(+), 29 deletions(-)

diff --git a/components/mission-control/MissionControlDashboard.tsx b/components/mission-control/MissionControlDashboard.tsx
index 9bcd962..ba3d205 100644
--- a/components/mission-control/MissionControlDashboard.tsx
+++ b/components/mission-control/MissionControlDashboard.tsx
@@ -3,19 +3,38 @@
 import { useState } from "react";
 import Link from "next/link";
 
-export default function MissionControlDashboard() {
-  const [expandedCategory, setExpandedCategory] = useState<string | null>("council");
+export default function MissionControlDashboard({ onLogout }: { onLogout?: () => void }) {
+  const [expandedCategories, setExpandedCategories] = useState<Set<string>>(new Set(["command", "personal", "automation"]));
+
+  const toggleCategory = (id: string) => {
+    setExpandedCategories((prev) => {
+      const next = new Set(prev);
+      if (next.has(id)) {
+        next.delete(id);
+      } else {
+        next.add(id);
+      }
+      return next;
+    });
+  };
+
+  const expandAll = () => {
+    setExpandedCategories(new Set(categories.map((c) => c.id)));
+  };
+
+  const collapseAll = () => {
+    setExpandedCategories(new Set());
+  };
 
   const categories = [
     {
-      id: "council",
-      name: "Council",
+      id: "command",
+      name: "Command",
       icon: "👁️",
       items: [
-        { id: "temple", name: "Temple of AI", icon: "🏛️", color: "#fbbf24", href: "/mission-control/temple" },
-        { id: "office", name: "Claw3D Office", icon: "🏢", color: "#22c55e", href: "/mission-control/office" },
-        { id: "memory", name: "Daily Memory", icon: "📝", color: "#a855f7", href: "/mission-control/memory" },
-        { id: "claude", name: "Claude Chat", icon: "💬", color: "#ff6154", href: "/mission-control/claude-chat" },
+        { id: "dashboard", name: "Dashboard", icon: "🏠", color: "#3b82f6", href: "/mission-control" },
+        { id: "horus-chat", name: "Horus Chat", icon: "💬", color: "#8b5cf6", href: "/mission-control/claude-chat" },
+        { id: "voice-chat", name: "Voice Chat", icon: "🎤", color: "#06b6d4", href: "/mission-control/voice" },
       ]
     },
     {
@@ -27,6 +46,77 @@ export default function MissionControlDashboard() {
         { id: "pdf-viewer", name: "PDF Viewer", icon: "📰", color: "#6366f1", href: "/mission-control/pdf-viewer" },
       ]
     },
+    {
+      id: "automation",
+      name: "Automation",
+      icon: "⚡",
+      items: [
+        { id: "horus-ai", name: "Horus AI", icon: "🤖", color: "#f59e0b", href: "/mission-control/horus-ai" },
+        { id: "autorun", name: "Auto-Run", icon: "🔄", color: "#22c55e", href: "/mission-control/autorun" },
+        { id: "exec-logs", name: "Execution Logs", icon: "📊", color: "#ef4444", href: "/mission-control/execution-logs" },
+        { id: "change-log", name: "Change Log", icon: "📝", color: "#a855f7", href: "/mission-control/change-log" },
+        { id: "brainown", name: "Brainown", icon: "🧠", color: "#fbbf24", href: "/mission-control/brainown" },
+      ]
+    },
+    {
+      id: "council",
+      name: "Council",
+      icon: "🏛️",
+      items: [
+        { id: "agent-roster", name: "Agent Roster", icon: "👥", color: "#8b5cf6", href: "/mission-control/agents" },
+        { id: "thoth", name: "Thoth", icon: "🦉", color: "#6366f1", href: "/mission-control/agent/thoth" },
+        { id: "ptah", name: "Ptah", icon: "🛠️", color: "#f59e0b", href: "/mission-control/agent/ptah" },
+        { id: "seshat", name: "Seshat", icon: "📜", color: "#22c55e", href: "/mission-control/agent/seshat" },
+        { id: "anubis", name: "Anubis", icon: "🐕", color: "#ef4444", href: "/mission-control/agent/anubis" },
+        { id: "thoth-trading", name: "Thoth Trading", icon: "📈", color: "#10b981", href: "/mission-control/agent/thoth-trading" },
+        { id: "sekhmet", name: "Sekhmet", icon: "🦁", color: "#fbbf24", href: "/mission-control/agent/sekhmet" },
+        { id: "sessions", name: "Sessions", icon: "💬", color: "#06b6d4", href: "/mission-control/sessions" },
+        { id: "council-chat", name: "Council Chat", icon: "🏛️", color: "#a855f7", href: "/mission-control/council" },
+      ]
+    },
+    {
+      id: "projects",
+      name: "Projects & Tasks",
+      icon: "📋",
+      items: [
+        { id: "task-board", name: "Task Board", icon: "✅", color: "#3b82f6", href: "/mission-control/tasks" },
+        { id: "task-history", name: "Task History", icon: "📜", color: "#6366f1", href: "/mission-control/task-history" },
+        { id: "monday", name: "Monday Board", icon: "📅", color: "#f59e0b", href: "/mission-control/monday" },
+      ]
+    },
+    {
+      id: "trading",
+      name: "Trading",
+      icon: "📊",
+      items: [
+        { id: "trading-panel", name: "Trading Panel", icon: "📈", color: "#10b981", href: "/mission-control/trading" },
+        { id: "trading-chart", name: "Trading Chart", icon: "📉", color: "#ef4444", href: "/mission-control/trading-chart" },
+        { id: "trading-reports", name: "Trading Reports", icon: "📔", color: "#f59e0b", href: "/mission-control/trading-reports" },
+        { id: "trading-tools", name: "Trading Tools", icon: "🛠️", color: "#8b5cf6", href: "/mission-control/trading-tools" },
+      ]
+    },
+    {
+      id: "leads",
+      name: "Leads & CRM",
+      icon: "💼",
+      items: [
+        { id: "leads", name: "Lead Manager", icon: "📋", color: "#f59e0b", href: "/mission-control/leads" },
+        { id: "hp-leads", name: "HP Leads", icon: "🚀", color: "#22c55e", href: "/mission-control/hp-leads" },
+        { id: "hp-submissions", name: "HP Submissions", icon: "📨", color: "#ef4444", href: "/mission-control/hp-submissions" },
+      ]
+    },
+    {
+      id: "memory",
+      name: "Memory & Research",
+      icon: "📝",
+      items: [
+        { id: "daily-memory", name: "Daily Memory", icon: "📅", color: "#a855f7", href: "/mission-control/memory" },
+        { id: "briefs", name: "Briefs", icon: "☀️", color: "#fbbf24", href: "/mission-control/briefs" },
+        { id: "research", name: "Deep Research", icon: "🔬", color: "#3b82f6", href: "/mission-control/research" },
+        { id: "transcripts", name: "Transcripts", icon: "📹", color: "#6366f1", href: "/mission-control/transcripts" },
+        { id: "docs", name: "Docs", icon: "📚", color: "#10b981", href: "/mission-control/docs" },
+      ]
+    },
     {
       id: "sites",
       name: "Sites",
@@ -38,22 +128,14 @@ export default function MissionControlDashboard() {
       ]
     },
     {
-      id: "tools",
-      name: "Tools",
-      icon: "🛠️",
+      id: "system",
+      name: "System",
+      icon: "⚙️",
       items: [
-        { id: "leads", name: "Lead Manager", icon: "📋", color: "#f59e0b", href: "/mission-control/leads" },
-        { id: "email", name: "Email Campaign", icon: "📧", color: "#ef4444", href: "/mission-control/email" },
-        { id: "trading", name: "Trading Panel", icon: "📈", color: "#10b981", href: "/mission-control/trading" },
-      ]
-    },
-    {
-      id: "agents",
-      name: "Agents",
-      icon: "🤖",
-      items: [
-        { id: "agents-list", name: "Agent Roster", icon: "👥", color: "#8b5cf6", href: "/mission-control/agents" },
-        { id: "sessions", name: "Sessions", icon: "💬", color: "#06b6d4", href: "/mission-control/sessions" },
+        { id: "system-status", name: "System Status", icon: "📡", color: "#10b981", href: "/mission-control/system-status" },
+        { id: "skills-panel", name: "Skills Panel", icon: "🎯", color: "#f59e0b", href: "/mission-control/skills" },
+        { id: "command-center", name: "Command Center", icon: "⌨️", color: "#ef4444", href: "/mission-control/command" },
+        { id: "projects-panel", name: "Projects Panel", icon: "📁", color: "#6366f1", href: "/mission-control/projects-panel" },
       ]
     },
   ];
@@ -68,7 +150,7 @@ export default function MissionControlDashboard() {
             <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-amber-500 to-orange-600 flex items-center justify-center text-xl">👁️</div>
             <div>
               <h1 className="font-bold text-lg">Mission Control</h1>
-              <p className="text-xs text-slate-500">Horus OS v2.0</p>
+              <p className="text-xs text-slate-500">Horus OS v3.0</p>
             </div>
           </div>
         </div>
@@ -79,18 +161,18 @@ export default function MissionControlDashboard() {
             <div key={category.id}>
               {/* Category Header */}
               <button
-                onClick={() => setExpandedCategory(expandedCategory === category.id ? null : category.id)}
+                onClick={() => toggleCategory(category.id)}
                 className="w-full flex items-center justify-between px-2 py-2 text-xs font-semibold text-slate-400 uppercase tracking-wider hover:text-white transition-colors"
               >
                 <div className="flex items-center gap-2">
                   <span>{category.icon}</span>
                   <span>{category.name}</span>
                 </div>
-                <span className={`transition-transform ${expandedCategory === category.id ? "rotate-90" : ""}`}>▶</span>
+                <span className={`transition-transform ${expandedCategories.has(category.id) ? "rotate-90" : ""}`}>▶</span>
               </button>
 
               {/* Category Items */}
-              {expandedCategory === category.id && (
+              {expandedCategories.has(category.id) && (
                 <div className="ml-2 space-y-0.5 mt-1">
                   {category.items.map((item) => (
                     item.external ? (
@@ -128,8 +210,26 @@ export default function MissionControlDashboard() {
           ))}
         </div>
 
+        {/* Expand/Collapse All Buttons */}
+        <div className="p-3 border-t border-slate-800 space-y-2">
+          <button
+            onClick={expandAll}
+            className="w-full flex items-center justify-center gap-2 px-3 py-2 rounded-lg bg-slate-800 hover:bg-slate-700 transition-colors text-sm text-slate-300"
+          >
+            <span>⬇️</span>
+            <span>Expand All</span>
+          </button>
+          <button
+            onClick={collapseAll}
+            className="w-full flex items-center justify-center gap-2 px-3 py-2 rounded-lg bg-slate-800 hover:bg-slate-700 transition-colors text-sm text-slate-300"
+          >
+            <span>⬆️</span>
+            <span>Collapse All</span>
+          </button>
+        </div>
+
         {/* Footer */}
-        <div className="p-3 border-t border-slate-800">
+        <div className="p-3 border-t border-slate-800 space-y-2">
           <div className="bg-slate-800/50 rounded-lg p-3">
             <div className="flex items-center gap-2 mb-1">
               <div className="w-2 h-2 rounded-full bg-green-500 animate-pulse" />
@@ -137,6 +237,14 @@ export default function MissionControlDashboard() {
             </div>
             <p className="text-xs text-slate-500">Horus is watching 👁️</p>
           </div>
+          {onLogout && (
+            <button
+              onClick={onLogout}
+              className="w-full py-2 rounded-lg bg-red-500/20 hover:bg-red-500/30 text-red-400 text-sm font-medium transition-colors"
+            >
+              Logout
+            </button>
+          )}
         </div>
       </div>
 
@@ -149,7 +257,7 @@ export default function MissionControlDashboard() {
           </div>
           <div className="flex items-center gap-4">
             <div className="flex items-center gap-2 text-xs text-slate-500">
-              <span>Horus v2.0</span>
+              <span>Horus v3.0</span>
             </div>
           </div>
         </div>