@polderlabs/bizar 7.0.2 → 7.0.4

package/bizar-dash/src/web/views/Memory.tsx

@@ -1,11 +1,12 @@
-// src/web/views/Memory.tsx — v4.7.0 dedicated Memory tab.
+// src/web/views/Memory.tsx — v7.0.4 dedicated Memory tab.
 //
-// Three-column layout: left rail (source picker), main panel (per-source UI),
-// and a top stat row + a health hero at the top of every panel for context.
-//
-// The Memory subsystem has 4 sources (LightRAG, Obsidian vault, git sync,
-// semantic search) plus a config panel and a high-level overview. Each is a
-// standalone component under views/memory/.
+// Two-column layout: source rail on the left (10 sources), main panel on
+// the right (one sub-panel at a time). v7.0.4 swaps the legacy
+// `.view view-memory memory-tab` + `.memory-tab-body` + `.memory-source-rail`
+// shell for the design-system primitives (Box / ViewHeader / Grid /
+// cx-classed nav buttons) so the Memory tab matches the rest of the
+// dashboard theme. Sub-panels keep their own shell until a follow-up
+// sprint per-component migrates them.
 
 import React, { useCallback, useState } from 'react';
 import {
@@ -21,9 +22,9 @@ import {
   Search as SearchIcon,
   Sliders,
 } from 'lucide-react';
-import { Card } from '../components/Card';
+import { Box, Grid, IconButton, Inline, Stack, ViewHeader } from '../ui';
+import { cx } from '../ui/utils/cx';
 import { useToast } from '../components/Toast';
-import { cn } from '../lib/utils';
 import { MemoryOverview } from './memory/MemoryOverview';
 import { LightragPanel } from './memory/LightragPanel';
 import { ObsidianPanel } from './memory/ObsidianPanel';
@@ -35,7 +36,17 @@ import { FromScreenshotPanel } from './memory/FromScreenshotPanel';
 import { VaultFromClipboardPanel } from './memory/VaultFromClipboardPanel';
 import { VoiceNotesPanel } from '../components/VoiceNotesPanel';
 
-type SubPanel = 'overview' | 'lightrag' | 'obsidian' | 'git' | 'semantic' | 'config' | 'graph' | 'webclip' | 'screenshot' | 'voice';
+type SubPanel =
+  | 'overview'
+  | 'lightrag'
+  | 'obsidian'
+  | 'git'
+  | 'semantic'
+  | 'config'
+  | 'graph'
+  | 'webclip'
+  | 'screenshot'
+  | 'voice';
 
 type Props = {
   snapshot: unknown;
@@ -79,7 +90,13 @@ function MemoryInner(_props: Props) {
   const renderPanel = () => {
     switch (active) {
       case 'overview':
-        return <MemoryOverview refreshKey={refreshKey} onRefresh={refresh} setActiveSubPanel={setActive} />;
+        return (
+          <MemoryOverview
+            refreshKey={refreshKey}
+            onRefresh={refresh}
+            setActiveSubPanel={(id) => setActive(id as SubPanel)}
+          />
+        );
       case 'lightrag':
         return <LightragPanel refreshKey={refreshKey} />;
       case 'obsidian':
@@ -99,63 +116,78 @@ function MemoryInner(_props: Props) {
       case 'voice':
         return <VoiceNotesPanel refreshKey={refreshKey} />;
       default:
-        return <Card>Unknown panel: {active}</Card>;
+        return null;
     }
   };
 
   return (
-    <div className="view view-memory memory-tab">
-      {/* ── Header ─────────────────────────────────────────────── */}
-      <header className="view-header">
-        <div className="view-header-text">
-          <h2 className="view-title">
-            <Brain size={18} /> Memory
-          </h2>
-          <p className="view-subtitle">
-            LightRAG, Obsidian vault, git sync, semantic search, web clips, and screenshot OCR — all in one place.
-          </p>
-        </div>
-        <div className="view-actions">
-          <button
-            type="button"
-            className="icon-btn"
-            onClick={onRefreshAll}
-            aria-label="Refresh memory"
-            title="Refresh"
-          >
-            <RefreshCw size={14} />
-          </button>
-        </div>
-      </header>
+    <Box as="div" className="view view-memory" bg="0" p={7}>
+      <Stack gap={5}>
+        <ViewHeader
+          title={
+            <Inline gap={2} align="center">
+              <Brain size={18} />
+              <span>Memory</span>
+            </Inline>
+          }
+          subtitle="LightRAG, Obsidian vault, git sync, semantic search, web clips, and screenshot OCR — all in one place."
+          actions={
+            <IconButton
+              variant="ghost"
+              size="md"
+              onClick={onRefreshAll}
+              aria-label="Refresh memory"
+              title="Refresh"
+              icon={<RefreshCw size={14} />}
+            />
+          }
+        />
 
-      <div className="memory-tab-body">
-        {/* ── Source rail ─────────────────────────────────────── */}
-        <nav className="memory-source-rail" aria-label="Memory sources">
-          {SOURCES.map((s) => {
-            const Icon = s.icon;
-            const isActive = active === s.id;
-            return (
-              <button
-                key={s.id}
-                type="button"
-                role="tab"
-                aria-selected={isActive}
-                className={cn('memory-source-button', isActive && 'memory-source-button-active')}
-                onClick={() => setActive(s.id)}
-              >
-                <Icon size={16} aria-hidden />
-                <span>{s.label}</span>
-              </button>
-            );
-          })}
-        </nav>
+        <Grid
+          cols={2}
+          gap={4}
+          style={{
+            gridTemplateColumns: '240px 1fr',
+            alignItems: 'start',
+            minHeight: 0,
+          }}
+          data-testid="memory-grid"
+        >
+          {/* Source rail — Stack doesn't accept `as="nav"`, so wrap
+             in <nav> directly and let Stack render its rows. */}
+          <nav aria-label="Memory sources" data-testid="memory-source-rail">
+            <Stack direction="column" gap={1}>
+              {SOURCES.map((s) => {
+                const Icon = s.icon;
+                const isActive = active === s.id;
+                return (
+                  <button
+                    key={s.id}
+                    type="button"
+                    role="tab"
+                    aria-selected={isActive}
+                    className={cx(
+                      'memory-source-button',
+                      isActive && 'memory-source-button-active',
+                    )}
+                    onClick={() => setActive(s.id)}
+                  >
+                    <Icon size={16} aria-hidden />
+                    <span>{s.label}</span>
+                  </button>
+                );
+              })}
+            </Stack>
+          </nav>
 
-        {/* ── Main panel ─────────────────────────────────────── */}
-        <div className="memory-main" key={active}>
-          {renderPanel()}
-        </div>
-      </div>
-    </div>
+          {/* Main panel */}
+          <Box as="div" key={active} data-testid="memory-main-panel">
+            {renderPanel()}
+          </Box>
+        </Grid>
+      </Stack>
+    </Box>
   );
 }
+
 export const Memory = React.memo(MemoryInner);

package/bizar-dash/src/web/views/Overview.tsx

@@ -52,8 +52,6 @@ import {
   EyeOff,
   Eye,
   X,
-  Sun,
-  Moon,
 } from 'lucide-react';
 
 import {
@@ -134,20 +132,8 @@ function OverviewInner({
   // hide without losing the row from the underlying store. v3.15.0.
   const [hiddenKeys, setHiddenKeys] = useState<Set<string>>(new Set());
 
-  // Theme toggle — local because ThemeProvider doesn't wrap the app at
-  // the App.tsx level yet. Toggles `data-theme` on <html>; tokens.css
-  // handles the actual colour swap.
-  const [isDark, setIsDark] = useState<boolean>(() => {
-    if (typeof document === 'undefined') return true;
-    const attr = document.documentElement.getAttribute('data-theme');
-    return attr !== 'light';
-  });
-
-  useEffect(() => {
-    if (typeof document === 'undefined') return;
-    if (isDark) document.documentElement.removeAttribute('data-theme');
-    else document.documentElement.setAttribute('data-theme', 'light');
-  }, [isDark]);
+  // v7.0.4 — theme toggle is now hoisted to Topbar (see
+  // components/Topbar.tsx); no per-view state needed here.
 
   // Load hidden set once on mount — v3.15.0.
   useEffect(() => {
@@ -536,13 +522,6 @@ function OverviewInner({
             >
               Refresh
             </UiButton>
-            <IconButton
-              variant="ghost"
-              size="md"
-              onClick={() => setIsDark((v) => !v)}
-              aria-label={isDark ? 'Switch to light theme' : 'Switch to dark theme'}
-              icon={isDark ? <Sun size={14} /> : <Moon size={14} />}
-            />
           </Inline>
         </Inline>
 

package/bizar-dash/tests/settings-layout.test.tsx

@@ -59,8 +59,8 @@ describe('Sidebar — settingsMode', () => {
     // Should show the back button
     expect(screen.getByRole('button', { name: /exit settings/i })).toBeInTheDocument();
     // Should show section groups (use selector to avoid duplicate text matches)
-    expect(screen.getByText('General', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
-    expect(screen.getByText('Core', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
+    expect(screen.getByText('General', { selector: '.sidebar-section-label' })).toBeInTheDocument();
+    expect(screen.getByText('Core', { selector: '.sidebar-section-label' })).toBeInTheDocument();
   });
 
   it('shows Back button that calls onExitSettings', async () => {

package/bizar-dash/tests/settings-nav.test.tsx

@@ -41,7 +41,7 @@ describe('SettingsNav', () => {
     expect(onExitSettings).toHaveBeenCalledTimes(1);
   });
 
-  it('renders section groups with group-label class', () => {
+  it('renders section groups with shared sidebar-section-label class', () => {
     render(
       <SettingsNav
         activeSection={null}
@@ -49,11 +49,11 @@ describe('SettingsNav', () => {
         onExitSettings={onExitSettings}
       />,
     );
-    expect(screen.getByText('General', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
-    expect(screen.getByText('Core', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
-    expect(screen.getByText('Agents', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
-    expect(screen.getByText('Experience', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
-    expect(screen.getByText('Data', { selector: '.settings-nav-group-label' })).toBeInTheDocument();
+    expect(screen.getByText('General', { selector: '.sidebar-section-label' })).toBeInTheDocument();
+    expect(screen.getByText('Core', { selector: '.sidebar-section-label' })).toBeInTheDocument();
+    expect(screen.getByText('Agents', { selector: '.sidebar-section-label' })).toBeInTheDocument();
+    expect(screen.getByText('Experience', { selector: '.sidebar-section-label' })).toBeInTheDocument();
+    expect(screen.getByText('Data', { selector: '.sidebar-section-label' })).toBeInTheDocument();
   });
 
   it('renders section items within each group', () => {

package/cli/provision-claude.mjs

@@ -167,17 +167,37 @@ export async function buildSdk({ dryRun = false } = {}) {
   // PATH — especially when invoked from a globally npm-installed package
   // whose lifecycle scripts run with a minimal env. Without the absolute
   // path, `bun run build:sdk` shells out to `tsc`, finds no shim on PATH,
-  // and fails with `tsc: command not found`. Prefer the absolute path so
-  // we don't depend on PATH inheritance.
+  // and fails with `tsc: command not found`.
+  //
+  // Bun's bin dir contains only `bun` and `bunx` — NOT `tsc`. So even
+  // when bun runs `build:sdk` (which executes the `tsc` line from
+  // package.json), the child shell still needs `tsc` on PATH. The npm
+  // global bin dir (where `npm install -g typescript` lands the shim) is
+  // the typical source — resolve it via `npm root -g`'s parent and
+  // prepend both bun's bin and the npm global bin to the child PATH.
   const bunFromHome = join(process.env.HOME || '', '.bun', 'bin', 'bun');
   let cmd, args, childEnv;
   if (existsSync(bunFromHome)) {
     cmd = bunFromHome;
     args = ['run', 'build:sdk'];
-    // Make bun's bin dir visible to the child so its tsc shim resolves.
-    const bunBin = dirname(bunFromHome);
     const pathDelim = process.platform === 'win32' ? ';' : ':';
-    childEnv = { ...process.env, PATH: `${bunBin}${pathDelim}${process.env.PATH || ''}` };
+    const bunBin = dirname(bunFromHome);
+    let npmGlobalBin = '';
+    try {
+      const npmRootG = execSync('npm root -g', { encoding: 'utf8', stdio: ['ignore', 'pipe', 'ignore'] }).trim();
+      // npm root -g returns .../lib/node_modules — parent is .../lib, and
+      // the bin dir lives at .../bin. So walk up one and over.
+      npmGlobalBin = join(dirname(npmRootG), '..', 'bin');
+    } catch {
+      // npm not on PATH — fall back to the standard location.
+      npmGlobalBin = process.platform === 'win32'
+        ? join(process.env.APPDATA || '', 'npm')
+        : join(process.env.HOME || '', '.local', 'bin');
+    }
+    const pathParts = [bunBin];
+    if (npmGlobalBin && existsSync(npmGlobalBin)) pathParts.push(npmGlobalBin);
+    pathParts.push(process.env.PATH || '');
+    childEnv = { ...process.env, PATH: pathParts.join(pathDelim) };
   } else if (haveCmd('bun')) {
     cmd = 'bun';
     args = ['run', 'build:sdk'];
@@ -203,6 +223,81 @@ export async function buildSdk({ dryRun = false } = {}) {
   }
 }
 
+/**
+ * Build the dashboard SPA (Vite production bundle) so the Node server
+ * in `bizar-dash/src/server/server.mjs` can serve the React UI from
+ * `bizar-dash/dist/index.html` + `dist/assets/*`. Without this step,
+ * npm installs that don't ship a pre-built `dist/` (the published
+ * tarball excludes it because it is `.gitignore`'d) leave the
+ * dashboard serving 404s for every asset, and the page renders blank
+ * with errors like `can't access property 'useState', et is undefined`.
+ *
+ * v7.0.3 — `install.sh` + `bizar update` previously skipped the
+ * dashboard build entirely. Symptom: a fresh `bizar install` /
+ * `bizar update` overwrote the package's pre-existing `dist/` (if
+ * any) and the dashboard's first request returned a 404 for the
+ * bundle, followed by the React error above in the browser console.
+ *
+ * Same bun / npx resolution strategy as `buildSdk()`. The vite config
+ * reads the same `tsconfig.json` for type info, but the heavy lifting
+ * is `vite build` itself which uses esbuild internally, so no tsc
+ * dependency here.
+ *
+ * Idempotent: skips when `bizar-dash/dist/index.html` already exists.
+ * Non-fatal: returns `{ ok: false, message }` rather than throwing —
+ * the rest of the provision flow should still complete.
+ */
+export async function buildDash({ dryRun = false } = {}) {
+  const dashDir = join(REPO_ROOT, 'bizar-dash');
+  const distIndex = join(dashDir, 'dist', 'index.html');
+
+  if (!existsSync(join(dashDir, 'src', 'web', 'index.html'))) {
+    return { ok: true, skipped: true, message: `Dashboard src not found at ${join(dashDir, 'src', 'web', 'index.html')} — skipping build` };
+  }
+
+  if (existsSync(distIndex)) {
+    return { ok: true, skipped: true, message: `Dashboard dist already present — skipping build (delete ${join(dashDir, 'dist')} to force)` };
+  }
+
+  if (dryRun) {
+    return { ok: true, skipped: false, message: `would build dashboard at ${dashDir}` };
+  }
+
+  const bunFromHome = join(process.env.HOME || '', '.bun', 'bin', 'bun');
+  let cmd, args, childEnv;
+  if (existsSync(bunFromHome)) {
+    cmd = bunFromHome;
+    args = ['run', 'build:dash'];
+    const pathDelim = process.platform === 'win32' ? ';' : ':';
+    const bunBin = dirname(bunFromHome);
+    const pathParts = [bunBin, process.env.PATH || ''];
+    childEnv = { ...process.env, PATH: pathParts.join(pathDelim) };
+  } else if (haveCmd('bun')) {
+    cmd = 'bun';
+    args = ['run', 'build:dash'];
+    childEnv = process.env;
+  } else {
+    cmd = 'npx';
+    args = ['--yes', 'vite', 'build'];
+    childEnv = process.env;
+  }
+
+  try {
+    logInfo(`building dashboard with \`${cmd} ${args.join(' ')}\` (REPO_ROOT=${REPO_ROOT})`);
+    // `vite build` writes to the configured outDir (../../dist from
+    // src/web/). On a non-bun shell the cwd must be REPO_ROOT because
+    // the configured `root` is relative. Bun handles this either way.
+    execFileSync(cmd, args, { cwd: REPO_ROOT, stdio: 'pipe', timeout: 240_000, env: childEnv });
+    if (existsSync(distIndex)) {
+      return { ok: true, skipped: false, message: 'Dashboard built (dist/index.html present)' };
+    }
+    return { ok: false, message: `build completed but ${distIndex} still missing — check vite.config.ts outDir` };
+  } catch (err) {
+    const stderr = err.stderr ? err.stderr.toString().split('\n').slice(0, 5).join(' | ') : '(no stderr)';
+    return { ok: false, message: `Dashboard build failed: ${stderr}` };
+  }
+}
+
 function readTextSafe(file, fallback = '') {
   try {
     if (!existsSync(file)) return fallback;
@@ -892,6 +987,14 @@ export async function runProvision(opts = {}) {
   // full story.
   await runStep('Building SDK',     () => buildSdk({ dryRun }));
 
+  // ── 4c. Build the dashboard SPA so dist/index.html exists. ───────────
+  // The Node server in `bizar-dash/src/server/server.mjs` serves the
+  // React UI from `bizar-dash/dist/`. The published npm tarball excludes
+  // `dist/` because it is `.gitignore`'d, so a fresh install must
+  // rebuild it. Skips when already present (idempotent). See
+  // `buildDash()` JSDoc for the v7.0.3 reason this step exists.
+  await runStep('Building dashboard', () => buildDash({ dryRun }));
+
   // ── 9. settings.json (MCP + hooks + permissions + env) ──────────────
   section('Writing settings.json');
   const settingsStep = writeClaudeSettings({ dryRun, force });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polderlabs/bizar",
-  "version": "7.0.2",
+  "version": "7.0.4",
   "description": "Norse-pantheon multi-agent system for Claude Code — 14 agents across 4 cost tiers with cost-aware routing, plans, and a configurable agent harness. Ships as a single npm package with the dashboard server, Claude Code MCP server, and typed SDK.",
   "type": "module",
   "bin": {

package/packages/sdk/.harness/agents.json

@@ -0,0 +1,17 @@
+{
+  "version": 1,
+  "agents": [
+    {
+      "agentId": "agent-ed692060-767f-4f8d-951f-6be038e63725",
+      "type": "coder",
+      "name": "ada",
+      "status": "terminated",
+      "taskCount": 0,
+      "createdAt": "2026-07-12T14:48:32.781Z",
+      "lastHeartbeatAt": "2026-07-12T14:48:32.781Z",
+      "terminatedAt": "2026-07-12T14:48:32.781Z",
+      "terminationReason": "smoke",
+      "gracefulTermination": true
+    }
+  ]
+}

package/packages/sdk/.harness/topology.json

@@ -0,0 +1,4 @@
+{
+  "version": 1,
+  "swarms": []
+}