@polderlabs/bizar 10.1.0 → 10.3.0

package/bizar-dash/src/web/v8/views/Headroom/HeadroomView.tsx

@@ -1,201 +0,0 @@
-import { useEffect, useState } from 'react';
-import { Network, Play, Square, Plug, Unplug, RotateCw, RefreshCw } from 'lucide-react';
-import { Stack } from '../../ui/primitives/Stack.js';
-import { Inline } from '../../ui/primitives/Inline.js';
-import { Grid } from '../../ui/primitives/Grid.js';
-import { ViewHeader } from '../../ui/data/ViewHeader.js';
-import { Card, CardBody } from '../../ui/data/Card.js';
-import { Badge } from '../../ui/data/Badge.js';
-import { Button } from '../../ui/controls/Button.js';
-import { Skeleton } from '../../ui/feedback/Skeleton.js';
-import { useFetch } from '../../data/useFetch.js';
-import { fetchJson, FetchError } from '../../data/fetcher.js';
-
-/**
- * HeadroomView — Sprint S35. Headroom proxy install + lifecycle.
- */
-
-type Status = 'installed' | 'not-installed' | 'running' | 'stopped';
-
-interface HeadroomStatus {
-  status: Status;
-  version?: string;
-  port?: number;
-  message?: string;
-}
-
-interface HeadroomStats {
-  hours?: number;
-  requests?: number;
-  tokensSaved?: number;
-  cacheHits?: number;
-  cacheMisses?: number;
-}
-
-export function HeadroomView(): JSX.Element {
-  const status = useFetch<HeadroomStatus>('/api/headroom/status');
-  const stats = useFetch<HeadroomStats>('/api/headroom/stats?hours=24');
-  const [busy, setBusy] = useState<string | null>(null);
-  const [error, setError] = useState<string | null>(null);
-
-  useEffect(() => {
-    const id = setInterval(() => { void status.refetch(); }, 15_000);
-    return () => clearInterval(id);
-  }, [status]);
-
-  const install = async (): Promise<void> => {
-    setBusy('install');
-    setError(null);
-    try {
-      await fetchJson('/api/headroom/install', { method: 'POST', body: { force: false } });
-      void status.refetch();
-    } catch (err) {
-      setError(err instanceof FetchError ? err.message : (err as Error).message);
-    } finally {
-      setBusy(null);
-    }
-  };
-
-  const wrap = async (): Promise<void> => {
-    setBusy('wrap');
-    setError(null);
-    try {
-      await fetchJson('/api/headroom/wrap', { method: 'POST', body: { port: 8787 } });
-      void status.refetch();
-    } catch (err) {
-      setError(err instanceof FetchError ? err.message : (err as Error).message);
-    } finally {
-      setBusy(null);
-    }
-  };
-
-  const unwrap = async (): Promise<void> => {
-    setBusy('unwrap');
-    setError(null);
-    try {
-      await fetchJson('/api/headroom/unwrap', { method: 'POST' });
-      void status.refetch();
-    } catch (err) {
-      setError(err instanceof FetchError ? err.message : (err as Error).message);
-    } finally {
-      setBusy(null);
-    }
-  };
-
-  const start = async (): Promise<void> => {
-    setBusy('start');
-    setError(null);
-    try {
-      await fetchJson('/api/headroom/start', { method: 'POST' });
-      void status.refetch();
-    } catch (err) {
-      setError(err instanceof FetchError ? err.message : (err as Error).message);
-    } finally {
-      setBusy(null);
-    }
-  };
-
-  const stop = async (): Promise<void> => {
-    setBusy('stop');
-    setError(null);
-    try {
-      await fetchJson('/api/headroom/stop', { method: 'POST' });
-      void status.refetch();
-    } catch (err) {
-      setError(err instanceof FetchError ? err.message : (err as Error).message);
-    } finally {
-      setBusy(null);
-    }
-  };
-
-  const s = status.data;
-  const isInstalled = s && s.status !== 'not-installed';
-  const isRunning = s?.status === 'running';
-
-  return (
-    <Stack gap={5} data-testid="headroom-view">
-      <ViewHeader
-        title="Headroom"
-        description="Local proxy that reduces token cost via caching + batching. Install, wrap Cline, start/stop."
-        actions={
-          <Inline gap={2} align="center">
-            {error !== null && <span role="alert" style={{ color: 'var(--danger)', fontSize: 'var(--fs-12)' }}>{error}</span>}
-            <Button variant="ghost" onClick={() => { void status.refetch(); }} data-testid="headroom-refresh">
-              <RefreshCw size={14} aria-hidden /> Refresh
-            </Button>
-          </Inline>
-        }
-      />
-
-      <Card variant="elevated">
-        <CardBody>
-          {status.loading && !s ? (
-            <Skeleton style={{ height: 60 }} />
-          ) : (
-            <Inline align="center" justify="between" gap={3}>
-              <Stack gap={1}>
-                <Inline align="center" gap={2}>
-                  <Network size={16} aria-hidden />
-                  <strong>{s?.status ?? 'unknown'}</strong>
-                  {s?.version && <Badge tone="neutral">v{s.version}</Badge>}
-                  {s?.port && <Badge tone="info">port {s.port}</Badge>}
-                </Inline>
-                {s?.message && <span style={{ fontSize: 'var(--fs-12)', color: 'var(--fg-muted)' }}>{s.message}</span>}
-              </Stack>
-              <Inline gap={1} wrap={true}>
-                {!isInstalled && (
-                  <Button variant="primary" onClick={() => void install()} disabled={busy === 'install'} data-testid="headroom-install">
-                    <Plug size={12} aria-hidden /> {busy === 'install' ? 'Installing…' : 'Install'}
-                  </Button>
-                )}
-                {isInstalled && (
-                  <>
-                    <Button variant={isRunning ? 'secondary' : 'primary'} onClick={() => void (isRunning ? stop() : start())} disabled={busy === 'start' || busy === 'stop'} data-testid="headroom-toggle-running">
-                      {isRunning ? <Square size={12} aria-hidden /> : <Play size={12} aria-hidden />}
-                      {isRunning ? (busy === 'stop' ? 'Stopping…' : 'Stop') : (busy === 'start' ? 'Starting…' : 'Start')}
-                    </Button>
-                    <Button variant="ghost" onClick={() => void wrap()} disabled={busy === 'wrap'} data-testid="headroom-wrap">
-                      <RotateCw size={12} aria-hidden /> {busy === 'wrap' ? 'Wrapping…' : 'Wrap Cline'}
-                    </Button>
-                    <Button variant="ghost" onClick={() => void unwrap()} disabled={busy === 'unwrap'} data-testid="headroom-unwrap">
-                      <Unplug size={12} aria-hidden /> {busy === 'unwrap' ? 'Unwrapping…' : 'Unwrap'}
-                    </Button>
-                  </>
-                )}
-              </Inline>
-            </Inline>
-          )}
-        </CardBody>
-      </Card>
-
-      <Grid cols={3}>
-        <Card variant="default">
-          <CardBody>
-            <Stack gap={1}>
-              <span style={{ fontSize: 'var(--fs-12)', color: 'var(--fg-muted)' }}>Requests (24h)</span>
-              <strong style={{ fontFamily: 'var(--font-mono)', fontSize: 'var(--fs-18)' }}>{stats.data?.requests ?? 0}</strong>
-            </Stack>
-          </CardBody>
-        </Card>
-        <Card variant="default">
-          <CardBody>
-            <Stack gap={1}>
-              <span style={{ fontSize: 'var(--fs-12)', color: 'var(--fg-muted)' }}>Tokens saved</span>
-              <strong style={{ fontFamily: 'var(--font-mono)', fontSize: 'var(--fs-18)' }}>{stats.data?.tokensSaved ?? 0}</strong>
-            </Stack>
-          </CardBody>
-        </Card>
-        <Card variant="default">
-          <CardBody>
-            <Stack gap={1}>
-              <span style={{ fontSize: 'var(--fs-12)', color: 'var(--fg-muted)' }}>Cache hits / misses</span>
-              <strong style={{ fontFamily: 'var(--font-mono)', fontSize: 'var(--fs-18)' }}>
-                {stats.data?.cacheHits ?? 0} / {stats.data?.cacheMisses ?? 0}
-              </strong>
-            </Stack>
-          </CardBody>
-        </Card>
-      </Grid>
-    </Stack>
-  );
-}

package/bizar-dash/tests/graphify-mod-spawn.node.test.mjs

@@ -1,90 +0,0 @@
-/**
- * graphify-mod-spawn.node.test.mjs — regression test for the SIGPIPE crash.
- *
- * The graphify mod's route.mjs used to spawn the `graphify` CLI with
- * `spawnSync` + `stdio: 'inherit'`. That worked in a terminal, but the
- * dashboard is a background daemon with stdin=/dev/null and
- * stdout/stderr redirected to a log file. With `stdio: 'inherit'`, the
- * child inherits those descriptors; if anything closes or rotates them
- * mid-build, the kernel delivers SIGPIPE to the dashboard — silently
- * killing it. The user reported "building the graph crashed the dash".
- *
- * This test verifies the source file no longer contains the dangerous
- * pattern. We parse the file as text (the route.mjs is loaded by the
- * dashboard's vm sandbox, not directly importable here).
- *
- * Run with: node --test tests/graphify-mod-spawn.node.test.mjs
- */
-import { describe, it } from 'node:test';
-import assert from 'node:assert/strict';
-import { readFileSync } from 'node:fs';
-import { join, resolve } from 'node:path';
-
-// Test lives at bizar-dash/tests/, source is at the repo root.
-const REPO = resolve(import.meta.dirname, '..', '..');
-const SOURCE = join(REPO, 'mods-examples/graphify/route.mjs');
-
-describe('graphify mod — SIGPIPE-safe spawn', () => {
-  it('source file exists at the expected path', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    assert.ok(text.length > 100, 'source file should be substantial');
-  });
-
-  it('does NOT import spawnSync (causes blocking + stdio inheritance)', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    assert.ok(
-      !/\bspawnSync\b/.test(text),
-      'route.mjs must not import or call spawnSync — use async spawn instead',
-    );
-  });
-
-  it('does NOT use stdio: \'inherit\' (the SIGPIPE crash vector)', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    // Strip block comments and line comments before checking — we don't
-    // want the bug description itself to trip the test.
-    const stripped = text
-      .replace(/\/\*[\s\S]*?\*\//g, '')
-      .replace(/^\s*\/\/.*$/gm, '')
-      .replace(/`stdio:\s*'inherit'`/g, '');
-    // Look for the literal string in any quoting style.
-    const patterns = [
-      /stdio:\s*['"]inherit['"]/,
-      /stdio:\s*\[\s*['"]inherit['"]/,
-    ];
-    for (const pat of patterns) {
-      assert.ok(
-        !pat.test(stripped),
-        `route.mjs must not use stdio: 'inherit' — it propagates SIGPIPE to the dashboard`,
-      );
-    }
-  });
-
-  it('isolates the spawned child stdio with [\'ignore\', \'pipe\', \'pipe\']', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    assert.ok(
-      /stdio:\s*\[\s*['"]ignore['"]\s*,\s*['"]pipe['"]\s*,\s*['"]pipe['"]\s*\]/.test(text),
-      'spawn options should set stdio to [ignore, pipe, pipe] for SIGPIPE isolation',
-    );
-  });
-
-  it('runs graphify as an async spawn (not blocking)', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    // runGraphify should be declared `async function` and return a Promise.
-    assert.ok(
-      /async\s+function\s+runGraphify\s*\(/.test(text),
-      'runGraphify should be declared async so the dashboard event loop is not blocked',
-    );
-    assert.ok(
-      /return\s+new\s+Promise\s*\(/.test(text),
-      'runGraphify should return a Promise (async spawn lifecycle)',
-    );
-  });
-
-  it('forwards child stdout/stderr to the broadcast callback (no streaming lost)', () => {
-    const text = readFileSync(SOURCE, 'utf8');
-    assert.ok(
-      /broadcast\(\s*\{\s*type:\s*['"]graphify:build:log['"]/.test(text),
-      'runGraphify should call broadcast with graphify:build:log events so the dashboard UI keeps streaming',
-    );
-  });
-});

package/bizar-dash/tests/v7-archive/mobile-overview.test.tsx

@@ -1,214 +0,0 @@
-/**
- * tests/mobile-overview.test.tsx
- *
- * v5.4 — Component tests for the mobile-optimized overview (hero + stats +
- * recent activity + quick actions).
- */
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import React from 'react';
-import { MobileOverview } from '../src/web/mobile/MobileOverview';
-import type { Snapshot } from '../src/web/lib/types';
-
-// ─── Mocks ──────────────────────────────────────────────────────────────────
-
-vi.mock('../src/web/lib/api', () => ({
-  api: {
-    post: vi.fn().mockResolvedValue({ ok: true }),
-    get: vi.fn().mockResolvedValue({}),
-  },
-}));
-
-// Stub lucide icons — keep them tiny testids so we can assert presence cheaply.
-vi.mock('lucide-react', async (importOriginal) => {
-  const actual = await importOriginal() as Record<string, unknown>;
-  const make = (name: string) => {
-    const Cmp = (props: { size?: number }) => <svg data-testid={`icon-${name}`} data-size={props.size} />;
-    Cmp.displayName = name;
-    return Cmp;
-  };
-  return {
-    ...actual,
-    CheckSquare: make('CheckSquare'),
-    Clock: make('Clock'),
-    Bot: make('Bot'),
-    Coins: make('Coins'),
-    Plus: make('Plus'),
-    MessageSquare: make('MessageSquare'),
-    Stethoscope: make('Stethoscope'),
-    Send: make('Send'),
-  };
-});
-
-// ─── Test data ──────────────────────────────────────────────────────────────
-
-const BASE_SNAPSHOT: Snapshot = {
-  overview: {
-    counts: { agents: 0, plans: 0, projects: 0, sessions: 0 },
-    recentActivity: [],
-    versions: { node: '', platform: '', projectRoot: '', bizarRoot: '' },
-    generatedAt: '',
-  },
-  agents: [],
-  artifacts: [],
-  projects: [],
-  activeProject: null,
-  config: { path: '', data: null, raw: '', exists: false },
-  settings: {
-    path: '',
-    data: {
-      theme: { mode: 'dark', accent: '#8b5cf6', success: '#3fb950', warning: '#f0883e', error: '#f85149', info: '#58a6ff', fontFamily: 'sans-serif', fontSize: 14, compactMode: false, animations: true },
-      ui: { layout: 'topnav', showHeader: true, showStatusBar: true, defaultTab: 'overview' },
-      defaultAgent: 'odin',
-      defaultModel: '',
-      notifications: { onAgentComplete: false, onPlanApproval: false },
-      dashboard: { autoLaunchWeb: false },
-      service: { enabled: false, autostart: false },
-      about: { version: '5.4.0', homepage: '', license: 'MIT' },
-      agents: { maxParallel: 6, stuckThresholdMs: 600000, autoRestart: false },
-      personalization: { displayName: '', role: '', team: '', aboutMe: '', preferences: '' },
-      workflow: { artifactsEnabled: true, agentsDecideAutonomously: false, chatAutonomous: false },
-      headroom: { enabled: false, autoInstall: true, port: 8787, host: '127.0.0.1', outputShaper: false, telemetry: false, budget: 0, backend: 'anthropic', autoStart: true, autoWrap: true, routeAllProviders: true },
-    },
-    exists: true,
-  },
-  tasks: [],
-  mods: [],
-  schedules: [],
-  providers: [],
-  mcps: [],
-};
-
-// ─── Tests ──────────────────────────────────────────────────────────────────
-
-describe('MobileOverview', () => {
-  const refreshSnapshot = vi.fn().mockResolvedValue(undefined);
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it('renders hero card with input', () => {
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByRole('heading', { name: /what do you want to do/i })).toBeInTheDocument();
-    const textarea = screen.getByPlaceholderText(/implement user authentication/i);
-    expect(textarea).toBeInTheDocument();
-    expect(textarea.tagName).toBe('TEXTAREA');
-    expect(screen.getByRole('button', { name: /submit/i })).toBeInTheDocument();
-  });
-
-  it('disables submit button when textarea is empty', () => {
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    const submit = screen.getByRole('button', { name: /submit/i });
-    expect(submit).toBeDisabled();
-  });
-
-  it('enables submit button when textarea has text', async () => {
-    const user = userEvent.setup();
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    await user.type(screen.getByPlaceholderText(/implement user authentication/i), 'fix the bug');
-    expect(screen.getByRole('button', { name: /submit/i })).not.toBeDisabled();
-  });
-
-  it('renders 4 stat cards', () => {
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByText('Tasks')).toBeInTheDocument();
-    expect(screen.getByText('Schedules')).toBeInTheDocument();
-    expect(screen.getByText('Active Agents')).toBeInTheDocument();
-    expect(screen.getByText('API Tokens')).toBeInTheDocument();
-
-    // Each stat label sits on a card with the matching modifier class.
-    expect(document.querySelectorAll('.mobile-stat-card.is-blue')).toHaveLength(1);
-    expect(document.querySelectorAll('.mobile-stat-card.is-purple')).toHaveLength(1);
-    expect(document.querySelectorAll('.mobile-stat-card.is-green')).toHaveLength(1);
-    expect(document.querySelectorAll('.mobile-stat-card.is-yellow')).toHaveLength(1);
-  });
-
-  it('reflects task count and active task subtext from snapshot', () => {
-    const snap: Snapshot = {
-      ...BASE_SNAPSHOT,
-      tasks: [
-        { ...BASE_SNAPSHOT.tasks[0], id: 't1', title: 'a', description: '', status: 'doing', tags: [], priority: 'normal', createdAt: '', updatedAt: '' },
-        { ...BASE_SNAPSHOT.tasks[0], id: 't2', title: 'b', description: '', status: 'done', tags: [], priority: 'normal', createdAt: '', updatedAt: '' },
-        { ...BASE_SNAPSHOT.tasks[0], id: 't3', title: 'c', description: '', status: 'queued', tags: [], priority: 'normal', createdAt: '', updatedAt: '' },
-      ] as Snapshot['tasks'],
-      schedules: [
-        { id: 's1', name: 'nightly', cron: '0 0 * * *', enabled: true, lastRun: null, nextRun: null, target: 'agent', agentName: 'odin', createdAt: '', updatedAt: '' },
-      ] as Snapshot['schedules'],
-    };
-
-    render(<MobileOverview snapshot={snap} refreshSnapshot={refreshSnapshot} />);
-
-    // Tasks stat — first mobile-stat-value inside the blue card.
-    const blueCard = document.querySelector('.mobile-stat-card.is-blue')!;
-    expect(blueCard.querySelector('.mobile-stat-value')?.textContent).toBe('3');
-    expect(blueCard.querySelector('.mobile-stat-subtext')?.textContent).toBe('1 active');
-
-    // Schedules stat.
-    const purpleCard = document.querySelector('.mobile-stat-card.is-purple')!;
-    expect(purpleCard.querySelector('.mobile-stat-value')?.textContent).toBe('1');
-  });
-
-  it('shows recent activity when snapshot has items', () => {
-    const snap: Snapshot = {
-      ...BASE_SNAPSHOT,
-      overview: {
-        ...BASE_SNAPSHOT.overview,
-        recentActivity: [
-          { ts: '2026-07-05T12:34:00.000Z', kind: 'task', title: 'hello' },
-          { ts: '2026-07-05T12:35:00.000Z', kind: 'agent', name: 'odin' },
-        ],
-      },
-    };
-
-    render(<MobileOverview snapshot={snap} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByRole('heading', { name: /recent activity/i })).toBeInTheDocument();
-    const items = document.querySelectorAll('.mobile-activity-item');
-    expect(items).toHaveLength(2);
-    expect(screen.queryByText(/no recent activity/i)).not.toBeInTheDocument();
-  });
-
-  it('shows empty state when there is no recent activity', () => {
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByText(/no recent activity/i)).toBeInTheDocument();
-    expect(document.querySelector('.mobile-activity-list')).toBeNull();
-  });
-
-  it('renders quick action buttons', () => {
-    render(<MobileOverview snapshot={BASE_SNAPSHOT} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByRole('button', { name: /new task/i })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: /new chat/i })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: /run doctor/i })).toBeInTheDocument();
-  });
-
-  it('clamps recent activity to 8 items', () => {
-    const many: { ts: string; kind: string; title: string }[] = [];
-    for (let i = 0; i < 12; i++) {
-      many.push({ ts: `2026-07-05T12:${String(i).padStart(2, '0')}:00.000Z`, kind: 'task', title: `t${i}` });
-    }
-    const snap: Snapshot = {
-      ...BASE_SNAPSHOT,
-      overview: { ...BASE_SNAPSHOT.overview, recentActivity: many },
-    };
-
-    render(<MobileOverview snapshot={snap} refreshSnapshot={refreshSnapshot} />);
-
-    expect(document.querySelectorAll('.mobile-activity-item')).toHaveLength(8);
-  });
-
-  it('handles null snapshot without crashing', () => {
-    render(<MobileOverview snapshot={null} refreshSnapshot={refreshSnapshot} />);
-
-    expect(screen.getByRole('heading', { name: /what do you want to do/i })).toBeInTheDocument();
-    expect(screen.getByText(/no recent activity/i)).toBeInTheDocument();
-    expect(screen.getByText('Tasks')).toBeInTheDocument();
-  });
-});