dashboard: expand to 5 peer tiers — add Research + Loops with placeholder canvases

Fifth commit of the Research + Loops arc. Lights up the tier rail (both the chip column and the top-bar crumbs) with two new peer surfaces: [VIZ] [RESEARCH] [LOOPS] [AGENT] [INFRA] The stubs (ResearchList / ResearchCanvas / LoopsList / LoopsCanvas) are self-contained placeholder components — each renders a header with a "0 topics" / "0 loops" chip and a "coming soon" body plus a canvas hero with the tier motif. Real functionality (topic cards, wizard, canvas timelines, publish gate UI) arrives in the next two commits, and slots in by replacing the stub files without touching Dashboard.tsx again. Dashboard.tsx changes: - `Tier` type widened to include `"research" | "loops"`. - railIcon record grew two SVG entries — book+lens for Research, orbit arrows for Loops. Matches the placeholder canvas hero. - TIER_TABS reordered as Viz → Research → Loops → Agent → Infra to match the mental grouping (conceptual work first, machinery second). - Top-bar crumbs mirror the rail order. - New isResearch / isLoops selectors used everywhere the existing tiers were tested; the Agents-header conditional now also skips for the new tiers so ResearchList and LoopsList can supply their own headers. - Sidebar swap short-circuits to ResearchList / LoopsList; canvas swap short-circuits to ResearchCanvas / LoopsCanvas.
2026-07-06 06:47:37 -07:00
parent 973eeb272e
commit 2ff00934b2
5 changed files with 333 additions and 6 deletions
@@ -0,0 +1,90 @@
+"use client";
+
+// Canvas for the Research tier — stub. The real canvas (selected topic's
+// agents grid, run timeline, publish gate) arrives with the wizard commit.
+
+const mono =
+  "ui-monospace, SFMono-Regular, SF Mono, Menlo, Monaco, Consolas, monospace";
+
+export function ResearchCanvas() {
+  return (
+    <div
+      style={{
+        position: "absolute",
+        inset: 0,
+        background:
+          "radial-gradient(120% 90% at 55% 38%, #0e0e13 0%, #08080a 70%)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: 48,
+      }}
+    >
+      <div
+        style={{
+          maxWidth: 460,
+          textAlign: "center",
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          gap: 20,
+        }}
+      >
+        {/* Book + magnifying-lens: the research motif from the rail */}
+        <svg width="48" height="48" viewBox="0 0 24 24" aria-hidden>
+          <rect
+            x="4"
+            y="3.5"
+            width="12"
+            height="14"
+            rx="1.5"
+            stroke="#5a5a62"
+            strokeWidth="1.4"
+            fill="none"
+          />
+          <path
+            d="M4 15.5 H16"
+            stroke="#5a5a62"
+            strokeWidth="1.4"
+            fill="none"
+          />
+          <circle
+            cx="17.5"
+            cy="17.5"
+            r="3.2"
+            stroke="#ff6f61"
+            strokeWidth="1.6"
+            fill="none"
+          />
+          <path
+            d="M19.9 19.9 L22 22"
+            stroke="#ff6f61"
+            strokeWidth="1.6"
+            strokeLinecap="round"
+          />
+        </svg>
+        <div
+          style={{
+            fontSize: 22,
+            fontWeight: 700,
+            color: "#f3f3f5",
+            letterSpacing: "-.01em",
+          }}
+        >
+          Research
+        </div>
+        <div
+          style={{
+            fontFamily: mono,
+            fontSize: 12,
+            color: "#8a8a92",
+            lineHeight: 1.6,
+          }}
+        >
+          Pick a topic on the left to see the agents assembling around it, the
+          run timeline, and the publish gate. Full canvas ships next commit.
+        </div>
+      </div>
+    </div>
+  );
+}