init

thirdeye/dashboard/app/intelligence/page.tsx

@@ -0,0 +1,107 @@
+"use client";
+
+import Sidebar from "../components/Sidebar";
+import TopBar from "../components/TopBar";
+import IntelligenceCards from "./IntelligenceCards";
+import KnowledgeMesh from "./KnowledgeMesh";
+import ThoughtStreams from "./ThoughtStreams";
+import IntelFooter from "./IntelFooter";
+import { useEffect, useState } from "react";
+import { fetchGroups, fetchAllSignals, fetchAllPatterns } from "../lib/api";
+
+export default function IntelligencePage() {
+  const [signalCount, setSignalCount] = useState<number | null>(null);
+  const [patternCount, setPatternCount] = useState<number | null>(null);
+
+  useEffect(() => {
+    async function load() {
+      try {
+        const [allGroups, patterns] = await Promise.all([
+          fetchAllSignals(),
+          fetchAllPatterns(),
+        ]);
+        setSignalCount(allGroups.flatMap((g) => g.signals).length);
+        setPatternCount(patterns.filter((p) => p.is_active).length);
+      } catch {
+        //
+      }
+    }
+    load();
+  }, []);
+
+  return (
+    <div
+      className="flex h-screen overflow-hidden bg-[#09090B] text-white"
+      style={{ fontFamily: "'Poppins', sans-serif" }}
+    >
+      <Sidebar />
+      <main className="flex-1 ml-[240px] flex flex-col h-screen overflow-hidden">
+        <TopBar />
+
+        {/* Scrollable content */}
+        <div className="flex-1 overflow-y-auto custom-scrollbar px-10 pb-12 pt-10">
+          {/* Page Header */}
+          <header className="mb-12">
+            <div className="flex items-end justify-between">
+              <div>
+                <h1
+                  className="text-4xl font-bold tracking-tight text-white"
+                  style={{ fontFamily: "'Poppins', sans-serif" }}
+                >
+                  Intelligence Control
+                </h1>
+                <p
+                  className="text-xs mt-2 tracking-widest uppercase font-mono-data"
+                  style={{ color: "#A78BFA" }}
+                >
+                  ACTIVE_INSIGHTS:{" "}
+                  {signalCount !== null ? signalCount.toLocaleString() : "—"} //
+                  PATTERNS_ACTIVE:{" "}
+                  {patternCount !== null ? patternCount : "—"}
+                </p>
+              </div>
+
+              {/* Status pill */}
+              <div className="flex items-center space-x-4">
+                <div
+                  className="px-4 py-2 rounded-xl flex items-center space-x-3"
+                  style={{ backgroundColor: "#131315" }}
+                >
+                  <span
+                    className="w-2 h-2 rounded-full active-pulse"
+                    style={{ backgroundColor: "#A78BFA", display: "inline-block" }}
+                  />
+                  <span
+                    className="text-[10px] font-mono-data uppercase"
+                    style={{ color: "rgba(249,245,248,0.6)" }}
+                  >
+                    Inference Engine: Optimal
+                  </span>
+                </div>
+              </div>
+            </div>
+          </header>
+
+          {/* Main card grid */}
+          <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+            {/* Top row: 3 intelligence engine cards */}
+            <div className="lg:col-span-3">
+              <IntelligenceCards />
+            </div>
+
+            {/* Bottom row: Knowledge mesh (2 cols) + Thought Streams (1 col) */}
+            <div className="lg:col-span-2">
+              <KnowledgeMesh />
+            </div>
+            <div className="lg:col-span-1">
+              <ThoughtStreams />
+            </div>
+          </div>
+
+          {/* Footer stats bar */}
+          <IntelFooter />
+        </div>
+      </main>
+    </div>
+  );
+}