Add LICENSE, README, and Docs tab to Mission Control

2026-02-22 07:33:18 +00:00
parent 3e7b457d5f
commit 0817444dc5
68 changed files with 6677 additions and 1673 deletions
@@ -4,6 +4,10 @@ import { useState, useEffect } from "react";
 import { useMissionControl } from "@/lib/mission-control/store";
 import { TaskStatus } from "@/lib/mission-control/types";
 import VoiceChat from "./VoiceChat";
+import MondayBoard from "./MondayBoard";
+import { TaskCardsPanel } from "./TaskCardsPanel";
+import { TaskHistoryPanel } from "./TaskHistoryPanel";
+import { TradingPanel } from "./TradingPanel";
 import AIManagement from "@/components/ai-management/AIManagement";
 import Council from "@/components/council/Council";

@@ -23,13 +27,27 @@ interface SidebarCategory {
 }

 const sidebarCategories: SidebarCategory[] = [
+  { id: "leads", name: "Leads", icon: "📈", items: [
+    { id: "leads-crm", name: "CRM", icon: "📊", category: "leads" },
+    { id: "dashboard", name: "Client Dashboard", icon: "🏢", category: "dashboard" },
+  ]},
  { id: "projects", name: "Projects", icon: "🎯", items: [
+    { id: "monday", name: "Monday Board", icon: "📊", category: "monday" },
    { id: "sitemente", name: "SiteMente", icon: "🌐", color: "#ff7bc0", category: "projects" },
    { id: "demos", name: "Demo Pages", icon: "🎨", category: "demos" },
    { id: "holacompi", name: "HolaCompi", icon: "🤝", color: "#6366f1", category: "projects" },
+    { id: "arabredox", name: "Arabredox", icon: "💚", color: "#22c55e", category: "projects" },
+    { id: "infrastructure", name: "Infra", icon: "⚙️", color: "#10b981", category: "projects" },
+  ]},
+  { id: "trading", name: "Trading", icon: "📈", items: [
+    { id: "trading-research", name: "Deep Research", icon: "🔬", category: "trading" },
+    { id: "trading-strategies", name: "Strategies", icon: "🎯", category: "trading" },
+    { id: "trading-execution", name: "Execution", icon: "⚡", category: "trading" },
+    { id: "trading-journal", name: "Journal", icon: "📔", category: "trading" },
  ]},
  { id: "tasks", name: "Tasks", icon: "✓", items: [
-    { id: "all", name: "All Tasks", icon: "📋", category: "tasks" },
+    { id: "task-cards", name: "Task Cards", icon: "☑️", category: "task-cards" },
+    { id: "task-history", name: "History", icon: "📜", category: "task-history" },
  ]},
  { id: "chat", name: "Chat", icon: "💬", items: [
    { id: "voice", name: "Voice Chat", icon: "🎤", category: "chat" },
@@ -44,6 +62,9 @@ const sidebarCategories: SidebarCategory[] = [
  { id: "memory", name: "Memory", icon: "🧠", items: [
    { id: "logs", name: "Session Logs", icon: "📝", category: "memory" },
  ]},
+  { id: "docs", name: "Docs", icon: "📚", items: [
+    { id: "docs-index", name: "Documentation", icon: "📚", category: "docs" },
+  ]},
 ];

 const statusConfig: Record<TaskStatus, { label: string; color: string }> = {
@@ -54,8 +75,13 @@ const statusConfig: Record<TaskStatus, { label: string; color: string }> = {
  paused: { label: "Paused", color: "text-gray-400" },
 };

-export default function MissionControlDashboard() {
+interface MissionControlDashboardProps {
+  onLogout?: () => void;
+}
+
+export default function MissionControlDashboard({ onLogout }: MissionControlDashboardProps) {
  const { tasks, toggleTask, updateTaskStatus, addTask, getProjectProgress, getTasksByProject } = useMissionControl();
+  const [mounted, setMounted] = useState(false);
  const [selectedItem, setSelectedItem] = useState<string>("sitemente");
  const [filter, setFilter] = useState<TaskStatus | "all">("all");
  const [expandedCategories, setExpandedCategories] = useState<string[]>(["projects"]);
@@ -64,6 +90,10 @@ export default function MissionControlDashboard() {
  const [newTaskTitle, setNewTaskTitle] = useState("");
  const [newTaskProject, setNewTaskProject] = useState("sitemente");

+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
  useEffect(() => {
    const handleKeyDown = (e: KeyboardEvent) => {
      if (e.key === "/" && !e.ctrlKey && !e.metaKey) {
@@ -115,8 +145,36 @@ export default function MissionControlDashboard() {
    setNewTaskTitle("");
  };

+  if (!mounted) {
+    return (
+      <div className="min-h-screen bg-[#1a1625] text-white flex items-center justify-center">
+        <div className="text-white/60">Loading...</div>
+      </div>
+    );
+  }
+
+  // Golden Wisdom Banner
+  const goldenNotes = (
+    <div className="fixed bottom-4 right-4 z-50 max-w-sm">
+      <div className="bg-gradient-to-br from-[#1a1625] to-[#2d1f3d] border border-amber-500/30 rounded-xl p-4 shadow-2xl shadow-amber-500/10">
+        <div className="flex items-center gap-2 mb-2">
+          <span className="text-amber-400">🔥</span>
+          <h3 className="font-bold text-amber-400 text-sm">GOLDEN NOTES</h3>
+        </div>
+        <ul className="text-xs text-white/80 space-y-1">
+          <li>• Fun first. Learning second. Outcome last.</li>
+          <li>• Signal intent early — don't wait too long</li>
+          <li>• Warmth + tension = desire, not friendzone</li>
+          <li>• Lead more — calm + leading = attractive</li>
+          <li>• Feel more, optimize less</li>
+        </ul>
+      </div>
+    </div>
+  )
+
  return (
    <div className="min-h-screen bg-[#1a1625] text-white flex">
+      {goldenNotes}
      <aside className="w-64 border-r border-white/10 bg-[#1a1625] p-4">
        <div className="flex items-center gap-3 mb-6 pb-4 border-b border-white/10">
          <div className="w-10 h-10 rounded-xl bg-brand-pink flex items-center justify-center text-xl">👁️</div>
@@ -145,6 +203,9 @@ export default function MissionControlDashboard() {
          <p className="text-xs text-white/40 uppercase mb-2 px-3">Quick</p>
          <a href="/" className="flex items-center gap-2 px-3 py-2 rounded-lg text-sm text-white/60 hover:bg-white/5 hover:text-white transition">🏠 SiteMente Site</a>
          <button onClick={collapseAll} className="w-full flex items-center gap-2 px-3 py-2 rounded-lg text-sm text-white/60 hover:bg-white/5 hover:text-white transition">⊖ Collapse All</button>
+          {onLogout && (
+            <button onClick={onLogout} className="w-full flex items-center gap-2 px-3 py-2 rounded-lg text-sm text-red-400 hover:bg-red-500/10 transition">🚪 Logout</button>
+          )}
        </div>
      </aside>

@@ -169,10 +230,14 @@ export default function MissionControlDashboard() {

        {currentItem?.category === "chat" && <div className="rounded-xl border border-white/10 bg-white/5 p-6"><VoiceChat /></div>}
        
+        {currentItem?.category === "monday" && <div className="h-full"><MondayBoard /></div>}
+        
        {currentItem?.category === "council" && currentItem?.id === "teams" && <div className="rounded-xl border border-white/10 bg-white/5 p-6"><Council /></div>}
        
        {currentItem?.category === "council-settings" && <div className="rounded-xl border border-white/10 bg-white/5 p-6"><AIManagement /></div>}
        
+        {currentItem?.category === "trading" && <TradingPanel />}
+        
        {currentItem?.category === "calendar" && (
          <div className="space-y-4">
            <div className="rounded-xl border border-white/10 bg-white/5 p-6">
@@ -191,6 +256,37 @@ export default function MissionControlDashboard() {
            <div className="space-y-2 text-sm text-white/70"><p>Memory is stored in:</p><ul className="text-white/50 space-y-1"><li>• localStorage (browser)</li><li>• GitHub repo (daily commits)</li><li>• MEMORY.md (curated)</li></ul></div>
          </div>
        )}
+
+        {currentItem?.category === "docs" && (
+          <div className="rounded-xl border border-white/10 bg-white/5 p-6">
+            <h3 className="text-lg font-semibold mb-4">📚 Documentation</h3>
+            <p className="text-white/60 mb-4">Long-term docs and guides</p>
+            <div className="space-y-3">
+              <a href="/mission-control/docs" target="_blank" className="flex items-center gap-3 p-3 rounded-lg bg-white/5 hover:bg-white/10 transition">
+                <span className="text-2xl">📖</span>
+                <div><p className="font-medium">Docs Index</p><p className="text-xs text-white/50">All documentation</p></div>
+              </a>
+              <a href="https://github.com/HaithamEKhalifa/SiteMente" target="_blank" className="flex items-center gap-3 p-3 rounded-lg bg-white/5 hover:bg-white/10 transition">
+                <span className="text-2xl">🐙</span>
+                <div><p className="font-medium">GitHub Repo</p><p className="text-xs text-white/50">Source code & issues</p></div>
+              </a>
+              <a href="https://sitemente.com" target="_blank" className="flex items-center gap-3 p-3 rounded-lg bg-white/5 hover:bg-white/10 transition">
+                <span className="text-2xl">🌐</span>
+                <div><p className="font-medium">Live Site</p><p className="text-xs text-white/50">sitemente.com</p></div>
+              </a>
+            </div>
+          </div>
+        )}
+        
+        {/* Task Cards View */}
+        {currentItem?.category === "task-cards" && (
+          <TaskCardsPanel tasks={tasks} toggleTask={toggleTask} />
+        )}
+
+        {/* Task History View */}
+        {currentItem?.category === "task-history" && (
+          <TaskHistoryPanel />
+        )}
        {currentItem?.category === "demos" && (
          <div className="rounded-xl border border-white/10 bg-white/5 p-6">
            <div className="text-center py-8">
@@ -208,6 +304,32 @@ export default function MissionControlDashboard() {
          </div>
        )}

+        {currentItem?.category === "leads" && (
+          <div className="rounded-xl border border-white/10 bg-white/5 p-6">
+            <div className="text-center py-8">
+              <div className="text-5xl mb-4">📈</div>
+              <h3 className="text-xl font-bold mb-2">Leads CRM</h3>
+              <p className="text-white/60 mb-6">Track and manage your leads</p>
+              <div className="flex flex-wrap justify-center gap-3">
+                <a href="/leads" target="_blank" className="px-4 py-2 bg-brand-pink rounded-lg text-sm font-medium hover:bg-[#ff7bc0] transition">📈 Open Leads CRM</a>
+              </div>
+            </div>
+          </div>
+        )}
+
+        {currentItem?.category === "dashboard" && (
+          <div className="rounded-xl border border-white/10 bg-white/5 p-6">
+            <div className="text-center py-8">
+              <div className="text-5xl mb-4">🏢</div>
+              <h3 className="text-xl font-bold mb-2">Client Dashboard</h3>
+              <p className="text-white/60 mb-6">Where your clients see bookings & leads</p>
+              <div className="flex flex-wrap justify-center gap-3">
+                <a href="/dashboard" target="_blank" className="px-4 py-2 bg-brand-pink rounded-lg text-sm font-medium hover:bg-[#ff7bc0] transition">🏢 Open Dashboard Demo</a>
+              </div>
+            </div>
+          </div>
+        )}
+

        {currentItem?.category === "projects" && (
          <>
@@ -237,6 +359,7 @@ export default function MissionControlDashboard() {
                  <select value={newTaskProject} onChange={(e) => setNewTaskProject(e.target.value)} className="bg-white/10 border border-white/20 rounded-lg px-3 py-1.5 text-sm">
                    <option value="sitemente">SiteMente</option>
                    <option value="holacompi">HolaCompi</option>
+                    <option value="arabredox">Arabredox</option>
                    <option value="infrastructure">Infrastructure</option>
                  </select>
                  <button onClick={handleAddTask} className="px-4 py-1.5 bg-brand-pink rounded-lg text-sm font-medium">Add Task</button>