@polderlabs/bizar 7.0.2 → 8.0.0

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

@@ -1,306 +0,0 @@
-// src/views/Harness.tsx — v6.0.0 Harness engineering dashboard.
-//
-// Surfaces the harness engineering audit (5 subsystems × 12+ checks)
-// directly in the dashboard so operators can see at a glance:
-//   - Audit score (e.g. 73/73 = 100%)
-//   - Critical vs Recommended breakdown
-//   - Per-subsystem status (Instructions / Tools / Environment / State / Feedback)
-//   - Last commit + branch
-//   - VCR ratio (passing / activated features)
-//   - Quick links to harness scripts (make vcr / make check-arch / make clean-check)
-//
-// All data is computed client-side from `feature_list.json` + the
-// audit script bundled with the dashboard. We also ping
-// `/api/doctor/health` to confirm the harness still passes.
-
-import React, { useEffect, useMemo, useState } from 'react';
-import {
-  Shield,
-  RefreshCw,
-  CheckCircle2,
-  XCircle,
-  BookOpen,
-  Wrench,
-  Database,
-  FileCheck2,
-  Activity,
-} from 'lucide-react';
-import { Card, CardTitle, CardMeta } from '../components/Card';
-import { useToast } from '../components/Toast';
-import { api } from '../lib/api';
-import { cn } from '../lib/utils';
-import type { Snapshot, Settings } from '../lib/types';
-
-type Props = {
-  snapshot: Snapshot;
-  settings: Settings;
-  activeTab: string;
-  setActiveTab: (id: string) => void;
-  refreshSnapshot: () => Promise<void>;
-};
-
-interface AuditCheck {
-  id: string;
-  label: string;
-  severity: 'critical' | 'recommended';
-  status: 'pass' | 'fail' | 'warn';
-}
-
-interface AuditSubsystem {
-  id: string;
-  label: string;
-  description: string;
-  icon: React.ReactNode;
-  checks: AuditCheck[];
-}
-
-function HarnessInner({ snapshot, setActiveTab, refreshSnapshot }: Props) {
-  const toast = useToast();
-  const [refreshing, setRefreshing] = useState(false);
-  const [lastAudit, setLastAudit] = useState<{ when: string; total: number; passing: number; failing: string[] } | null>(null);
-
-  // The audit checks are computed statically from the AGENTS.md /
-  // Makefile / scripts presence — no live /api call needed. The
-  // audit script itself lives in /workspace and the operator can
-  // re-run it via the buttons below.
-  const subsystems = useMemo<AuditSubsystem[]>(() => ([
-    {
-      id: 'instructions',
-      label: 'Instructions',
-      description: 'AGENTS.md entry point with hard constraints, clock-in/out routines, context anxiety warning.',
-      icon: <BookOpen size={16} />,
-      checks: [
-        { id: 'inst-file', label: 'AGENTS.md exists', severity: 'critical', status: 'pass' },
-        { id: 'inst-summary', label: 'System description in first 10 lines', severity: 'critical', status: 'pass' },
-        { id: 'inst-verify', label: 'Verification commands listed', severity: 'critical', status: 'pass' },
-        { id: 'inst-hard', label: 'Hard constraints (MUST / MUST NOT)', severity: 'recommended', status: 'pass' },
-        { id: 'inst-state', label: 'State files enumerated', severity: 'recommended', status: 'pass' },
-        { id: 'inst-clock', label: 'Clock-in / Clock-out routines', severity: 'recommended', status: 'pass' },
-      ],
-    },
-    {
-      id: 'tools',
-      label: 'Tools',
-      description: 'Scoped tool permissions, MCP integrations, integration docs.',
-      icon: <Database size={16} />,
-      checks: [
-        { id: 'tools-scope', label: 'Tool access scoped (.claude/settings.json)', severity: 'recommended', status: 'pass' },
-        { id: 'tools-mcp', label: 'MCP integrations documented', severity: 'recommended', status: 'pass' },
-      ],
-    },
-    {
-      id: 'environment',
-      label: 'Environment',
-      description: 'Dependency lockfile, runtime version pinning, Makefile targets.',
-      icon: <Activity size={16} />,
-      checks: [
-        { id: 'env-lock', label: 'Dependency lockfile', severity: 'critical', status: 'pass' },
-        { id: 'env-pin', label: 'Runtime version pinned (.nvmrc)', severity: 'recommended', status: 'pass' },
-        { id: 'env-make', label: 'Makefile present', severity: 'recommended', status: 'pass' },
-        { id: 'env-setup', label: 'make setup target', severity: 'recommended', status: 'pass' },
-        { id: 'env-dev', label: 'make dev target', severity: 'recommended', status: 'pass' },
-      ],
-    },
-    {
-      id: 'state',
-      label: 'State',
-      description: 'PROGRESS.md, DECISIONS.md, feature_list.json — cross-session state.',
-      icon: <Database size={16} />,
-      checks: [
-        { id: 'state-progress', label: 'PROGRESS.md exists', severity: 'critical', status: 'pass' },
-        { id: 'state-current', label: 'Current State block populated', severity: 'critical', status: 'pass' },
-        { id: 'state-decisions', label: 'DECISIONS.md', severity: 'recommended', status: 'pass' },
-        { id: 'state-feature', label: 'feature_list.json', severity: 'recommended', status: 'pass' },
-      ],
-    },
-    {
-      id: 'safety',
-      label: 'Safety',
-      description: 'Tool approval gates, dangerous-pattern detection, security primitives (v6.0.0).',
-      icon: <Shield size={16} />,
-      checks: [
-        { id: 'safety-patterns', label: '36+ dangerous patterns registered', severity: 'critical', status: 'pass' },
-        { id: 'safety-gate', label: 'Tool approval gate in beforeTool', severity: 'critical', status: 'pass' },
-        { id: 'safety-flush', label: 'Pre-compaction memory flush', severity: 'recommended', status: 'pass' },
-        { id: 'safety-curator', label: 'Skill curator (closed learning loop)', severity: 'recommended', status: 'pass' },
-        { id: 'safety-graph', label: 'Knowledge graph query tools', severity: 'recommended', status: 'pass' },
-      ],
-    },
-    {
-      id: 'feedback',
-      label: 'Feedback',
-      description: 'Verification pipelines, make check / test / e2e, clean-check.',
-      icon: <CheckCircle2 size={16} />,
-      checks: [
-        { id: 'fb-check', label: 'make check target', severity: 'recommended', status: 'pass' },
-        { id: 'fb-test', label: 'make test target', severity: 'recommended', status: 'pass' },
-        { id: 'fb-e2e', label: 'make e2e target', severity: 'recommended', status: 'pass' },
-        { id: 'fb-cleancheck', label: 'make clean-check (5 dimensions)', severity: 'recommended', status: 'pass' },
-        { id: 'fb-arch', label: 'make check-arch (.harness/arch-rules.json)', severity: 'recommended', status: 'pass' },
-        { id: 'fb-vcr', label: 'make vcr (VCR ratio)', severity: 'recommended', status: 'pass' },
-        { id: 'fb-trace', label: 'make session-start/end (traces)', severity: 'recommended', status: 'pass' },
-      ],
-    },
-  ]), []);
-
-  const stats = useMemo(() => {
-    const total = subsystems.flatMap((s) => s.checks).length;
-    const passing = subsystems.flatMap((s) => s.checks).filter((c) => c.status === 'pass').length;
-    const critical = subsystems.flatMap((s) => s.checks).filter((c) => c.severity === 'critical');
-    const criticalPass = critical.filter((c) => c.status === 'pass').length;
-    const recommended = subsystems.flatMap((s) => s.checks).filter((c) => c.severity === 'recommended');
-    const recommendedPass = recommended.filter((c) => c.status === 'pass').length;
-    const ratio = total === 0 ? 1.0 : passing / total;
-    return { total, passing, critical: critical.length, criticalPass, recommended: recommended.length, recommendedPass, ratio };
-  }, [subsystems]);
-
-  const onRefresh = async () => {
-    setRefreshing(true);
-    try {
-      await refreshSnapshot();
-      toast.show('Snapshot refreshed', 'success');
-    } finally {
-      setRefreshing(false);
-    }
-  };
-
-  const onRunAudit = () => {
-    toast.show('Audit script runs via `make check-arch` from a shell', 'info');
-  };
-
-  // Cline runtime status (best-effort from snapshot)
-  const clineActive = (snapshot as unknown as { cline?: { state?: string } }).cline?.state === 'active';
-
-  return (
-    <div className="harness-page">
-      <header className="harness-header">
-        <div className="harness-header-left">
-          <div className="harness-icon-wrap">
-            <Shield size={22} />
-          </div>
-          <div>
-            <h1 className="harness-title">Harness Engineering</h1>
-            <p className="harness-subtitle">
-              v6.0.0 — 5 subsystems × 12 checks. All passing.
-            </p>
-          </div>
-        </div>
-        <div className="harness-header-actions">
-          <button type="button" className="btn btn-secondary" onClick={onRunAudit}>
-            <FileCheck2 size={14} />
-            Run audit
-          </button>
-          <button type="button" className="btn btn-primary" onClick={onRefresh}>
-            <RefreshCw size={14} className={refreshing ? 'spin' : ''} />
-            Refresh
-          </button>
-        </div>
-      </header>
-
-      <section className="harness-audit">
-        <div className="harness-card">
-          <span className="harness-card-label">Audit score</span>
-          <span className={cn('harness-card-value', stats.ratio >= 0.99 ? 'pass' : stats.ratio >= 0.85 ? 'warn' : 'fail')}>
-            {stats.passing}/{stats.total}
-          </span>
-          <span className="harness-card-sub">{(stats.ratio * 100).toFixed(1)}% passing</span>
-        </div>
-        <div className="harness-card">
-          <span className="harness-card-label">Critical</span>
-          <span className={cn('harness-card-value', stats.criticalPass === stats.critical ? 'pass' : 'fail')}>
-            {stats.criticalPass}/{stats.critical}
-          </span>
-          <span className="harness-card-sub">all must-have</span>
-        </div>
-        <div className="harness-card">
-          <span className="harness-card-label">Recommended</span>
-          <span className={cn('harness-card-value', stats.recommendedPass === stats.recommended ? 'pass' : 'warn')}>
-            {stats.recommendedPass}/{stats.recommended}
-          </span>
-          <span className="harness-card-sub">best practice</span>
-        </div>
-        <div className="harness-card">
-          <span className="harness-card-label">Cline runtime</span>
-          <span className={cn('harness-card-value', clineActive ? 'pass' : 'warn')}>
-            {clineActive ? 'in-process' : 'subprocess'}
-          </span>
-          <span className="harness-card-sub">ClineCore in-process v6.0.0</span>
-        </div>
-      </section>
-
-      <section className="harness-subsystems">
-        {subsystems.map((s) => {
-          const passing = s.checks.filter((c) => c.status === 'pass').length;
-          const total = s.checks.length;
-          const all = passing === total;
-          return (
-            <Card key={s.id} className={cn('harness-subsystem-card', all ? 'harness-pass' : 'harness-warn')}>
-              <div className="harness-subsystem-head">
-                <div className="harness-subsystem-icon">{s.icon}</div>
-                <div className="harness-subsystem-title">
-                  <h3>{s.label}</h3>
-                  <span className="muted">{s.description}</span>
-                </div>
-                <div className="harness-subsystem-score">
-                  <span className={cn('harness-card-value-sm', all ? 'pass' : 'warn')}>{passing}/{total}</span>
-                </div>
-              </div>
-              <ul className="harness-checklist">
-                {s.checks.map((c) => (
-                  <li key={c.id} className={cn('harness-check', c.status)}>
-                    {c.status === 'pass' ? (
-                      <CheckCircle2 size={13} className="pass" />
-                    ) : (
-                      <XCircle size={13} className="fail" />
-                    )}
-                    <span className="harness-check-label">{c.label}</span>
-                    <span className={cn('harness-check-severity', c.severity)}>{c.severity}</span>
-                  </li>
-                ))}
-              </ul>
-            </Card>
-          );
-        })}
-      </section>
-
-      <section className="harness-quick-actions">
-        <Card>
-          <CardTitle>Harness commands</CardTitle>
-          <CardMeta>Run from a shell to verify / repair the harness.</CardMeta>
-          <div className="harness-command-grid">
-            <code>make check</code><span>Full verification pipeline (typecheck + tests)</span>
-            <code>make e2e</code><span>Real plugin load + 22 tool/hook checks</span>
-            <code>make vcr</code><span>VCR ratio (passing / activated features)</span>
-            <code>make verify-feature ID=F-001</code><span>Verify a specific feature by ID</span>
-            <code>make check-arch</code><span>Run architectural constraints</span>
-            <code>make clean-check</code><span>5-dimension clean-state check</span>
-            <code>make session-start</code><span>Record session start to .harness/traces/</span>
-            <code>make session-end</code><span>Record session end to .harness/traces/</span>
-          </div>
-        </Card>
-
-        <Card>
-          <CardTitle>Documentation</CardTitle>
-          <CardMeta>Entry point + topic docs.</CardMeta>
-          <ul className="harness-docs-list">
-            <li><button type="button" className="link" onClick={() => setActiveTab('doctor')}>Doctor</button> <span className="muted">— runtime health + service status</span></li>
-            <li><a className="link" href="/api/doctor/health" target="_blank" rel="noreferrer">/api/doctor/health</a> <span className="muted">— health endpoint</span></li>
-            <li><code>AGENTS.md</code> <span className="muted">— entry point with hard constraints</span></li>
-            <li><code>PROGRESS.md</code> <span className="muted">— current state, in progress, next steps</span></li>
-            <li><code>DECISIONS.md</code> <span className="muted">— architectural decision log (ADRs)</span></li>
-            <li><code>feature_list.json</code> <span className="muted">— machine-readable feature state</span></li>
-            <li><code>docs/architecture.md</code> <span className="muted">— layer model + module map</span></li>
-            <li><code>docs/quality-document.md</code> <span className="muted">— per-module A/B/C/D scores</span></li>
-            <li><code>.harness/arch-rules.json</code> <span className="muted">— architectural rule registry</span></li>
-          </ul>
-        </Card>
-      </section>
-    </div>
-  );
-}
-
-export function Harness(props: Props) {
-  return <HarnessInner {...props} />;
-}
-
-export default Harness;

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

@@ -1,353 +0,0 @@
-// src/views/History.tsx — v3.4.0: cross-project history view.
-// Shows per-project timelines (task events, plan events, project lifecycle)
-// aggregated from the activity log.
-
-import React, { useEffect, useState } from 'react';
-import {
-  History as HistoryIcon,
-  RefreshCw,
-  Folder,
-  CheckSquare,
-  Filter,
-  ChevronDown,
-  ChevronRight,
-  Download,
-  FileText,
-} from 'lucide-react';
-import { Card, CardTitle, CardMeta } from '../components/Card';
-import { Button } from '../components/Button';
-import { Spinner } from '../components/Spinner';
-import { VirtualList } from '../components/VirtualList';
-import { useToast } from '../components/Toast';
-import { api } from '../lib/api';
-import { cn, formatRelative } from '../lib/utils';
-import type { Settings, Snapshot } from '../lib/types';
-
-type Props = {
-  snapshot: Snapshot;
-  settings: Settings;
-  activeTab: string;
-  setActiveTab: (id: string) => void;
-  refreshSnapshot: () => Promise<void>;
-};
-
-type HistoryEvent = {
-  ts: string;
-  kind: string;
-  nodeId?: string;
-  text?: string;
-  author?: string;
-  taskId?: string;
-  [k: string]: unknown;
-};
-
-type ProjectHistory = {
-  id: string;
-  name: string;
-  path: string;
-  status: string;
-  lastAccessed?: string | null;
-  tasks: { total: number; done: number; doing: number; blocked: number; queued: number };
-  plans: number;
-};
-
-type HistoryResponse = {
-  events: HistoryEvent[];
-  projects: ProjectHistory[];
-  stats: { file: string; size: number; lines: number; lastTs: string | null; counts: Record<string, number> };
-  generatedAt: string;
-};
-
-const TIME_RANGES = [
-  { id: '1h', label: 'Last hour', ms: 60 * 60 * 1000 },
-  { id: '1d', label: 'Last day', ms: 24 * 60 * 60 * 1000 },
-  { id: '7d', label: 'Last 7 days', ms: 7 * 24 * 60 * 60 * 1000 },
-  { id: '30d', label: 'Last 30 days', ms: 30 * 24 * 60 * 60 * 1000 },
-  { id: 'all', label: 'All time', ms: 0 },
-];
-
-function renderProjectCard(
-  p: ProjectHistory,
-  events: HistoryEvent[],
-  expanded: Set<string>,
-  toggleProject: (id: string) => void,
-): React.ReactNode {
-  const isOpen = expanded.has(p.id);
-  return (
-    <Card key={p.id} className="history-project" style={{ marginBottom: 4 }}>
-      <div className="history-project-head">
-        <div style={{ display: 'flex', flexDirection: 'column', gap: 4, minWidth: 0, flex: 1 }}>
-          <div className="history-project-name">
-            <Folder size={16} /> {p.name}
-          </div>
-          <div className="history-project-meta">{p.path}</div>
-        </div>
-        <div className="history-project-stats">
-          <span className="history-project-stat">
-            <span className="history-project-stat-num">{p.tasks.done}</span>
-            <span className="muted">/ {p.tasks.total} done</span>
-          </span>
-          {p.tasks.doing > 0 && (
-            <span className="history-project-stat">
-              <span className="history-project-stat-num">{p.tasks.doing}</span>
-              <span className="muted">doing</span>
-            </span>
-          )}
-          {p.tasks.blocked > 0 && (
-            <span className="history-project-stat">
-              <span className="history-project-stat-num">{p.tasks.blocked}</span>
-              <span className="muted">blocked</span>
-            </span>
-          )}
-          <span className="history-project-stat">
-            <FileText size={11} /> <span className="history-project-stat-num">{p.plans}</span>
-            <span className="muted"> plan{p.plans === 1 ? '' : 's'}</span>
-          </span>
-          {p.lastAccessed && (
-            <span className="history-project-stat">
-              <span className="muted">last opened {formatRelative(p.lastAccessed)}</span>
-            </span>
-          )}
-        </div>
-        <button
-          type="button"
-          className="icon-btn"
-          onClick={() => toggleProject(p.id)}
-          aria-label={isOpen ? 'Collapse' : 'Expand'}
-        >
-          {isOpen ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
-        </button>
-      </div>
-
-      {isOpen && (
-        <div className="history-timeline-mini">
-          {events.length === 0 ? (
-            <div className="muted" style={{ padding: '12px 8px', fontSize: 12 }}>
-              No events in this time range.
-            </div>
-          ) : (
-            events.slice(-100).reverse().map((ev, i) => (
-              <div key={i} className="history-timeline-row">
-                <span className="history-timeline-ts">
-                  {new Date(ev.ts).toLocaleTimeString()}
-                </span>
-                <span className="history-timeline-kind">{ev.kind || 'event'}</span>
-                <span className="history-timeline-msg" title={String(ev.text || ev.title || '')}>
-                  {ev.author ? `@${ev.author} ` : ''}
-                  {String(ev.text ?? ev.title ?? ev.name ?? '')}
-                </span>
-              </div>
-            ))
-          )}
-        </div>
-      )}
-    </Card>
-  );
-}
-
-export function History({ snapshot }: Props) {
-  const toast = useToast();
-  const [data, setData] = useState<HistoryResponse | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [rangeId, setRangeId] = useState<string>('1d');
-  const [expanded, setExpanded] = useState<Set<string>>(new Set());
-  const [tick, setTick] = useState(0);
-
-  const load = async (since?: string) => {
-    try {
-      const q = since ? `?since=${encodeURIComponent(since)}&limit=1000` : '?limit=1000';
-      const r = await api.get<HistoryResponse>(`/history${q}`);
-      setData(r);
-      setExpanded(
-        new Set(
-          r.projects
-            .filter((project) => r.events.some((ev) => (ev as { projectId?: string }).projectId === project.id))
-            .map((project) => project.id),
-        ),
-      );
-    } catch (err) {
-      toast.error(`History load failed: ${(err as Error).message}`);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  useEffect(() => {
-    setLoading(true);
-    const range = TIME_RANGES.find((r) => r.id === rangeId) || TIME_RANGES[1];
-    if (range.ms > 0) {
-      const since = new Date(Date.now() - range.ms).toISOString();
-      load(since);
-    } else {
-      load();
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [rangeId]);
-
-  useEffect(() => {
-    const id = setInterval(() => setTick((t) => t + 1), 30_000);
-    return () => clearInterval(id);
-  }, []);
-
-  // Group events by project — use projectId where present, otherwise 'global'
-  const eventsByProject = new Map<string, HistoryEvent[]>();
-  for (const ev of data?.events || []) {
-    const pid = (ev as { projectId?: string }).projectId || 'global';
-    if (!eventsByProject.has(pid)) eventsByProject.set(pid, []);
-    eventsByProject.get(pid)!.push(ev);
-  }
-
-  const toggleProject = (id: string) => {
-    setExpanded((cur) => {
-      const next = new Set(cur);
-      if (next.has(id)) next.delete(id);
-      else next.add(id);
-      return next;
-    });
-  };
-
-  const onExportJson = () => {
-    if (!data) return;
-    const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = `bizar-history-${new Date().toISOString().replace(/[:.]/g, '-')}.json`;
-    a.click();
-    URL.revokeObjectURL(url);
-    toast.success('History exported.');
-  };
-
-  return (
-    <div className="view view-history" data-tick={tick}>
-      <header className="view-header">
-        <div className="view-header-text">
-          <h2 className="view-title">
-            <HistoryIcon size={18} /> History
-          </h2>
-          <p className="view-subtitle">
-            Cross-project history of events, tasks, and plans.
-            {data?.stats?.lastTs && (
-              <> · last event {formatRelative(data.stats.lastTs)}</>
-            )}
-          </p>
-        </div>
-        <div className="view-actions">
-          <div className="tasks-toolbar-group">
-            <Filter size={14} style={{ color: 'var(--text-dim)' }} aria-hidden />
-            <label htmlFor="history-range" className="sr-only">Time range</label>
-            <select
-              id="history-range"
-              className="select select-sm"
-              value={rangeId}
-              onChange={(e) => setRangeId(e.target.value)}
-              title="Time range"
-              aria-label="Time range"
-            >
-              {TIME_RANGES.map((r) => (
-                <option key={r.id} value={r.id}>{r.label}</option>
-              ))}
-            </select>
-          </div>
-          <Button
-            variant="ghost"
-            size="sm"
-            onClick={() => {
-              setLoading(true);
-              const range = TIME_RANGES.find((r) => r.id === rangeId) || TIME_RANGES[1];
-              if (range.ms > 0) {
-                load(new Date(Date.now() - range.ms).toISOString());
-              } else {
-                load();
-              }
-            }}
-          >
-            <RefreshCw size={14} /> Refresh
-          </Button>
-          <Button variant="secondary" size="sm" onClick={onExportJson}>
-            <Download size={14} /> Export
-          </Button>
-        </div>
-      </header>
-
-      {loading && (
-        <div className="view-loading">
-          <Spinner size="lg" />
-          <p>Loading history…</p>
-        </div>
-      )}
-
-      {!loading && data && (
-        <div className="history-list">
-          {data.projects.length === 0 && (
-            <Card>
-              <CardTitle><Folder size={14} /> No projects</CardTitle>
-              <CardMeta>Register a project in Overview to start tracking history.</CardMeta>
-            </Card>
-          )}
-
-          {data.projects.length > 0 && (
-            <VirtualList
-              items={data.projects}
-              itemHeight={70}
-              height={Math.min(data.projects.length * 70, 500)}
-              className="history-virtual-list"
-              renderItem={(p) => renderProjectCard(p, eventsByProject.get(p.id) || [], expanded, toggleProject)}
-            />
-          )}
-
-          {/* Global / unassigned events */}
-          {eventsByProject.has('global') && (
-            <Card className="history-project">
-              <div className="history-project-head">
-                <div style={{ display: 'flex', flexDirection: 'column', gap: 4, minWidth: 0, flex: 1 }}>
-                  <div className="history-project-name">
-                    <HistoryIcon size={16} /> Global events
-                  </div>
-                  <div className="history-project-meta">
-                    Activity not tied to a specific project
-                  </div>
-                </div>
-              </div>
-              <div className="history-timeline-mini">
-                {(eventsByProject.get('global') || []).slice(-100).reverse().map((ev, i) => (
-                  <div key={i} className="history-timeline-row">
-                    <span className="history-timeline-ts">
-                      {new Date(ev.ts).toLocaleTimeString()}
-                    </span>
-                    <span className="history-timeline-kind">{ev.kind || 'event'}</span>
-                    <span className="history-timeline-msg" title={String(ev.text || ev.title || '')}>
-                      {ev.author ? `@${ev.author} ` : ''}
-                      {String(ev.text ?? ev.title ?? ev.name ?? '')}
-                    </span>
-                  </div>
-                ))}
-              </div>
-            </Card>
-          )}
-
-          {data.stats?.counts && Object.keys(data.stats.counts).length > 0 && (
-            <Card>
-              <CardTitle>Event counts by kind</CardTitle>
-              <CardMeta>{data.stats.lines} total lines in log</CardMeta>
-              <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8, marginTop: 8 }}>
-                {Object.entries(data.stats.counts)
-                  .sort((a, b) => b[1] - a[1])
-                  .slice(0, 30)
-                  .map(([kind, count]) => (
-                    <span
-                      key={kind}
-                      className={cn('tag', 'tag-neutral')}
-                      style={{ fontFamily: 'var(--font-mono)' }}
-                    >
-                      {kind}: {count}
-                    </span>
-                  ))}
-              </div>
-            </Card>
-          )}
-        </div>
-      )}
-    </div>
-  );
-}