@polderlabs/bizar 10.4.2 → 10.4.4

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

@@ -13,6 +13,8 @@ import { Stack } from '../../ui/primitives/Stack.js';
 import { StatTile, StatGrid } from '../../ui/data/StatTile.js';
 import { Card, CardBody, CardHeader } from '../../ui/data/Card.js';
 import { Badge } from '../../ui/data/Badge.js';
+import { Banner } from '../../ui/feedback/Banner.js';
+import { Button } from '../../ui/controls/Button.js';
 import { ActivityFeed, type ActivityItem } from '../../ui/activity/ActivityFeed.js';
 import { ViewHeader } from '../../ui/data/ViewHeader.js';
 import { Sparkline } from '../../ui/data/Sparkline.js';
@@ -103,6 +105,19 @@ export function OverviewView(): JSX.Element {
 
   return (
     <Stack gap={5} data-testid="overview-view">
+      {snapshot.error && (
+        <Banner
+          tone="warning"
+          data-testid="overview-error-banner"
+          action={
+            <Button variant="ghost" size="sm" onClick={() => void snapshot.refetch()}>
+              Retry
+            </Button>
+          }
+        >
+          Snapshot unavailable: {snapshot.error.message || String(snapshot.error)}
+        </Banner>
+      )}
       <ViewHeader
         title="Overview"
         description="What's moving in the harness right now."
@@ -119,24 +134,28 @@ export function OverviewView(): JSX.Element {
           value={String((tasks.queued || 0) + (tasks.active || 0))}
           trend={(tasks.active || 0) > (tasks.queued || 0) ? 'up' : 'flat'}
           delta={`${tasks.done || 0} done · ${tasks.blocked || 0} blocked`}
+          loading={snapshot.loading}
         />
         <StatTile
           label="Goals at risk"
           value={`${goals.atRisk || 0} / ${goals.total || 0}`}
           trend={(goals.atRisk || 0) > 0 ? 'down' : 'flat'}
           delta={`${goals.done || 0} done`}
+          loading={snapshot.loading}
         />
         <StatTile
           label="Agents running"
           value={`${agents.running || 0} / ${agents.total || 0}`}
           trend={(agents.running || 0) > 0 ? 'up' : 'flat'}
           delta={`${agents.idle || 0} idle · ${agents.error || 0} error`}
+          loading={snapshot.loading}
         />
         <StatTile
           label="Tokens (24h)"
           value={tokens.last24h ? `${(tokens.last24h / 1_000_000).toFixed(1)}M` : '—'}
           trend={tokens.trend || 'flat'}
           delta="last 24h"
+          loading={snapshot.loading}
           sparkline={
             tokenSeries.length >= 2 ? (
               <span data-testid="overview-tokens-sparkline">

package/bizar-dash/src/web/v8/views/Projects/ProjectsView.tsx

@@ -35,6 +35,14 @@ interface ProjectsPayload {
   projects: Project[];
 }
 
+/** Returns true for internal harness/CI test project IDs. */
+function isTestProject(p: Project): boolean {
+  return (
+    /^(bizar-(e2e|real-env|admin)|bh-(cold-boot|walk-proj))/.test(p.id) ||
+    (p.name != null && p.name === p.id)
+  );
+}
+
 export function ProjectsView(): JSX.Element {
   const payload = useFetch<ProjectsPayload>('/api/projects');
   const [adding, setAdding] = useState<boolean>(false);
@@ -43,8 +51,10 @@ export function ProjectsView(): JSX.Element {
   const [busy, setBusy] = useState<boolean>(false);
   const [error, setError] = useState<string | null>(null);
   const [confirmDeleteId, setConfirmDeleteId] = useState<string | null>(null);
+  const [showTestProjects, setShowTestProjects] = useState<boolean>(false);
 
-  const projects = payload.data?.projects ?? [];
+  const allProjects = payload.data?.projects ?? [];
+  const projects = showTestProjects ? allProjects : allProjects.filter((p) => !isTestProject(p));
   const activeId = projects.find((p) => p.active)?.id ?? null;
 
   const refresh = useCallback(() => { void payload.refetch(); }, [payload]);
@@ -124,6 +134,16 @@ export function ProjectsView(): JSX.Element {
                 {error}
               </span>
             )}
+            {allProjects.some((p) => isTestProject(p)) && (
+              <Button
+                variant={showTestProjects ? 'primary' : 'ghost'}
+                size="sm"
+                onClick={() => setShowTestProjects((v) => !v)}
+                data-testid="projects-toggle-test"
+              >
+                {showTestProjects ? 'Hide test projects' : 'Show test projects'}
+              </Button>
+            )}
             <Button variant="ghost" onClick={() => void scan()} data-testid="projects-scan">
               <ScanSearch size={14} aria-hidden /> Scan configured dir
             </Button>

package/bizar-dash/src/web/v8/views/Voice/VoiceView.tsx

@@ -79,7 +79,7 @@ export function VoiceView(): JSX.Element {
               <Skeleton style={{ height: 48 }} />
             </Stack>
           ) : memos.length === 0 ? (
-            <EmptyState icon={<Mic size={28} aria-hidden />} title="No voice memos" description="Upload a recording to get started." />
+            <EmptyState icon={<Mic size={28} aria-hidden />} title="No voice memos" description="Voice memos are audio recordings captured during sessions — useful for verbal scratch notes and hands-free capture. Upload a .wav, .mp3, or .m4a file to get started." />
           ) : (
             <Stack gap={1}>
               {memos.map((m) => {

package/bizar-dash/tests/admin-labels.test.mjs

@@ -0,0 +1,42 @@
+/**
+ * tests/admin-labels.test.mjs
+ * Tests H1: Admin Run buttons have accessible labels.
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+
+const ACTIONS = [
+  { id: 'gc', title: 'Garbage collect' },
+  { id: 'cache-clear', title: 'Clear cache' },
+  { id: 'memory-reindex', title: 'Reindex memory' },
+  { id: 'logs-purge', title: 'Purge old logs' },
+  { id: 'restart', title: 'Restart dashboard' },
+  { id: 'rebuild', title: 'Rebuild' },
+  { id: 'export-activity', title: 'Export activity' },
+];
+
+/**
+ * Simulates the AdminTile button rendering:
+ * aria-label={action.title} children={action.title}
+ */
+function renderButton(action) {
+  return {
+    ariaLabel: action.title,
+    text: action.title,
+  };
+}
+
+describe('Admin Run buttons', () => {
+  ACTIONS.forEach((action) => {
+    it(`${action.id} button has aria-label matching action title`, () => {
+      const btn = renderButton(action);
+      assert.strictEqual(btn.ariaLabel, action.title, `aria-label should be "${action.title}"`);
+    });
+
+    it(`${action.id} button text matches action title`, () => {
+      const btn = renderButton(action);
+      assert.strictEqual(btn.text, action.title, `button text should be "${action.title}"`);
+    });
+  });
+});

package/bizar-dash/tests/admin-run-grouping.test.mjs

@@ -0,0 +1,42 @@
+// Tests L6 — admin Run actions are grouped into 2-3 semantic sections.
+
+import test from 'node:test';
+import assert from 'node:assert/strict';
+
+// Mirror the groupings from AdminView.tsx
+const ACTIONS = [
+  { id: 'gc', group: 'data' },
+  { id: 'cache-clear', group: 'data' },
+  { id: 'memory-reindex', group: 'data' },
+  { id: 'logs-purge', group: 'logs' },
+  { id: 'restart', group: 'service' },
+  { id: 'rebuild', group: 'service' },
+  { id: 'export-activity', group: 'logs' },
+];
+
+const GROUPS = ['data', 'service', 'logs'];
+
+test('three grouping buckets', () => {
+  assert.equal(GROUPS.length, 3);
+});
+
+test('data group contains 3 actions', () => {
+  const c = ACTIONS.filter((a) => a.group === 'data');
+  assert.equal(c.length, 3);
+});
+
+test('service group contains restart + rebuild', () => {
+  const c = ACTIONS.filter((a) => a.group === 'service');
+  assert.equal(c.length, 2);
+  assert.ok(c.every((a) => ['restart', 'rebuild'].includes(a.id)));
+});
+
+test('logs group contains logs-purge + export-activity', () => {
+  const c = ACTIONS.filter((a) => a.group === 'logs');
+  assert.equal(c.length, 2);
+});
+
+test('every action belongs to exactly one group', () => {
+  const total = GROUPS.reduce((acc, g) => acc + ACTIONS.filter((a) => a.group === g).length, 0);
+  assert.equal(total, ACTIONS.length);
+});

package/bizar-dash/tests/agents-preview-truncate.test.mjs

@@ -0,0 +1,35 @@
+// Tests M1 — agent card preview truncation + kind chip.
+
+import test from 'node:test';
+import assert from 'node:assert/strict';
+
+// Lightweight copy of the truncation helper from AgentsView.tsx to avoid
+// pulling in the React component (which would require jsdom). The real
+// version is exported from AgentsView.tsx as `truncatePreview`.
+function truncatePreview(s, max = 80) {
+  if (!s) return '';
+  return s.length <= max ? s : s.slice(0, max - 1) + '…';
+}
+
+test('truncatePreview passes short strings through unchanged', () => {
+  assert.equal(truncatePreview('hello world'), 'hello world');
+});
+
+test('truncatePreview caps long strings at max-1 + ellipsis', () => {
+  const long = 'a'.repeat(120);
+  const out = truncatePreview(long);
+  assert.equal(out.length, 80);
+  assert.match(out, /…$/);
+});
+
+test('truncatePreview returns empty for empty/missing input', () => {
+  assert.equal(truncatePreview(''), '');
+  assert.equal(truncatePreview(undefined), '');
+  assert.equal(truncatePreview(null), '');
+});
+
+test('truncatePreview boundary at exactly max', () => {
+  const exact = 'b'.repeat(80);
+  assert.equal(truncatePreview(exact), exact);
+  assert.equal(truncatePreview(exact + 'x'), 'b'.repeat(79) + '…');
+});

package/bizar-dash/tests/agents-summary-sanitize.test.ts

@@ -0,0 +1,51 @@
+/**
+ * tests/agents-summary-sanitize.test.ts
+ *
+ * Bug C1 — Sanitize leaked LLM reasoning monologue from agent card labels.
+ * Verifies sanitizeSummary():
+ *   1. Clips at first sentence, strips worktree:[Premise, code blocks
+ *   2. Short normal summary passes through unchanged
+ *   3. 200-char summary gets capped at 140 + ellipsis
+ */
+import { describe, it, expect } from 'vitest';
+import { sanitizeSummary } from '../src/web/v8/views/Agents/AgentsView.js';
+
+describe('sanitizeSummary', () => {
+  it('clips leaked monologue and strips CC-reasoning artifacts', () => {
+    const leaked = '[Premise — User likely wanted a quick answer. Already shown above. worktree: /home/drb0rk/projects/BizarHarness (the project dir). Reason: the user asked.';
+    const result = sanitizeSummary(leaked);
+    expect(result).not.toContain('worktree:');
+    expect(result).not.toContain('[Premise');
+    expect(result).toBe('User likely wanted a quick answer.');
+  });
+
+  it('strips fenced code blocks', () => {
+    const input = 'Here is the plan:\n```\ncd /tmp\nrm -rf /\n```\nFinal decision.';
+    const result = sanitizeSummary(input);
+    expect(result).not.toContain('```');
+    expect(result).toContain('Final decision.');
+  });
+
+  it('strips <thinking> blocks', () => {
+    const input = 'Answer here.<thinking>Let me reconsider this...</thinking>More text.';
+    const result = sanitizeSummary(input);
+    expect(result).not.toContain('<thinking>');
+    expect(result).toContain('Answer here.');
+  });
+
+  it('passes short normal summary unchanged', () => {
+    const input = 'Fixed the auth middleware token check.';
+    expect(sanitizeSummary(input)).toBe(input);
+  });
+
+  it('caps 200-char summary at 140 + ellipsis', () => {
+    const long = 'A'.repeat(200);
+    const result = sanitizeSummary(long);
+    expect(result.length).toBeLessThanOrEqual(140);
+    expect(result.endsWith('…')).toBe(true);
+  });
+
+  it('returns empty string for undefined input', () => {
+    expect(sanitizeSummary(undefined as unknown as string)).toBe('');
+  });
+});

package/bizar-dash/tests/chat-new-session.test.mjs

@@ -0,0 +1,63 @@
+/**
+ * tests/chat-new-session.test.mjs
+ * Tests H5: Chat "New session" opens a modal instead of silently doing nothing.
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+
+/**
+ * Simulates the ChatView new-session modal state machine.
+ * createSession() was replaced with setNewSessionOpen(true).
+ * NewSessionModal renders when newSessionOpen === true.
+ */
+class ChatViewSim {
+  constructor() {
+    this.newSessionOpen = false;
+  }
+
+  openNewSession() {
+    this.newSessionOpen = true;
+  }
+
+  closeModal() {
+    this.newSessionOpen = false;
+  }
+
+  get modalVisible() {
+    return this.newSessionOpen === true;
+  }
+}
+
+describe('ChatView new session modal', () => {
+  it('clicking "New session" sets newSessionOpen to true', () => {
+    const chat = new ChatViewSim();
+    assert.strictEqual(chat.modalVisible, false);
+    chat.openNewSession();
+    assert.strictEqual(chat.modalVisible, true);
+  });
+
+  it('NewSessionModal renders when open=true', () => {
+    const modal = { open: true, title: 'New Claude session' };
+    assert.strictEqual(modal.open, true);
+  });
+
+  it('closing the modal sets newSessionOpen to false', () => {
+    const chat = new ChatViewSim();
+    chat.openNewSession();
+    assert.strictEqual(chat.modalVisible, true);
+    chat.closeModal();
+    assert.strictEqual(chat.modalVisible, false);
+  });
+
+  it('modal is used (not a no-op createSession)', () => {
+    // H5 fix: the old createSession() called POST /api/chat/sessions
+    // and did nothing visible. The fix wires it to NewSessionModal.
+    const chat = new ChatViewSim();
+    // old path: silently called API — modal was never set
+    // new path: sets newSessionOpen
+    assert.strictEqual(chat.modalVisible, false);
+    chat.openNewSession();
+    assert.strictEqual(chat.modalVisible, true);
+  });
+});

package/bizar-dash/tests/empty-state-docs.test.mjs

@@ -0,0 +1,55 @@
+// bizar-dash/tests/empty-state-docs.test.mjs
+// M7: Empty-state cards in Artifacts/Dialogs/Voice/Clipboard/Misc explain the surface.
+// Run with: node --test bizar-dash/tests/empty-state-docs.test.mjs
+
+import { readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import { describe, it } from 'node:test';
+
+const ROOT    = import.meta.dirname;
+const PROJECT = resolve(ROOT, '..', '..');
+const DASH    = resolve(ROOT, '..');
+
+function dash(file) {
+  return readFileSync(resolve(DASH, file), 'utf-8');
+}
+
+describe('M7: Empty-state descriptions explain each surface', () => {
+  it('ArtifactsView: description explains generated code artifacts', () => {
+    const c = dash('src/web/v8/views/Artifacts/ArtifactsView.tsx');
+    if (!c.includes('generated code')) {
+      throw new Error('ArtifactsView empty state should explain artifacts are generated code');
+    }
+  });
+
+  it('DialogsView: description explains agent prompts/confirmations', () => {
+    const c = dash('src/web/v8/views/Dialogs/DialogsView.tsx');
+    if (!c.includes('agent raises') && !c.includes('user input')) {
+      throw new Error('DialogsView empty state should explain agent prompts/confirmations');
+    }
+  });
+
+  it('VoiceView: description explains audio capture purpose', () => {
+    const c = dash('src/web/v8/views/Voice/VoiceView.tsx');
+    if (!c.includes('audio recording') && !c.includes('hands-free')) {
+      throw new Error('VoiceView empty state should explain audio capture purpose');
+    }
+  });
+
+  it('ClipboardView: description explains saved clips become markdown notes', () => {
+    const c = dash('src/web/v8/views/Clipboard/ClipboardView.tsx');
+    if (!c.includes('markdown note') && !c.includes('clips/')) {
+      throw new Error('ClipboardView empty state should explain clips become markdown notes');
+    }
+  });
+
+  it('MiscView: description explains global search + Tailscale', () => {
+    const c = dash('src/web/v8/views/Misc/MiscView.tsx');
+    if (!c.includes('Global fuzzy search')) {
+      throw new Error('MiscView description should mention global search');
+    }
+    if (!c.includes('Tailscale')) {
+      throw new Error('MiscView description should mention Tailscale');
+    }
+  });
+});

package/bizar-dash/tests/focus-visible.test.mjs

@@ -0,0 +1,30 @@
+// Tests L4 — focus-visible CSS rule exists for custom buttons + sidebar items.
+
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+
+const cssPath = resolve(import.meta.dirname, '../src/web/v8/ui/styles/globals.css');
+const css = readFileSync(cssPath, 'utf8');
+
+test('globals.css defines a focus-visible ring for .v8-btn', () => {
+  assert.match(css, /\.v8-btn:focus-visible/);
+});
+
+test('globals.css defines a focus-visible ring for .v8-button', () => {
+  assert.match(css, /\.v8-button:focus-visible/);
+});
+
+test('globals.css defines a focus-visible ring for sidebar section toggle', () => {
+  assert.match(css, /button\[data-section-toggle\]:focus-visible/);
+});
+
+test('globals.css defines a focus-visible ring for sidebar nav item', () => {
+  assert.match(css, /button\[data-nav-item\]:focus-visible/);
+});
+
+test('focus rule uses outline + outline-offset (visible keyboard affordance)', () => {
+  assert.match(css, /outline:\s*2px solid var\(--accent\)/);
+  assert.match(css, /outline-offset:\s*2px/);
+});

package/bizar-dash/tests/kanban-empty-column.test.mjs

@@ -0,0 +1,56 @@
+/**
+ * tests/kanban-empty-column.test.mjs
+ * Tests H7: Kanban columns with 0 tasks show "No tasks in <column>" empty state.
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+
+const COLUMNS = [
+  { id: 'backlog', title: 'Backlog' },
+  { id: 'queued', title: 'Queued' },
+  { id: 'doing', title: 'In progress' },
+  { id: 'blocked', title: 'In review' },
+  { id: 'done', title: 'Done' },
+  { id: 'archived', title: 'Archived' },
+];
+
+/**
+ * Simulates the TasksView column rendering with empty state.
+ * {inColumn.length === 0 && (
+ *   <div style={{ padding: 'var(--space-2)', color: 'var(--fg-muted)', fontSize: 'var(--fs-12)', textAlign: 'center' }}>
+ *     No tasks in {col.title}
+ *   </div>
+ * )}
+ */
+function renderColumn(col, inColumn = []) {
+  if (inColumn.length === 0) {
+    return { empty: true, emptyText: 'No tasks' };
+  }
+  return { empty: false, cards: inColumn };
+}
+
+describe('Kanban empty column rendering', () => {
+  COLUMNS.forEach((col) => {
+    it(`column "${col.title}" renders empty-state copy when count is 0`, () => {
+      const result = renderColumn(col, []);
+      assert.strictEqual(result.empty, true, `${col.title} should show empty state`);
+      assert.strictEqual(result.emptyText, 'No tasks', 'empty text should be "No tasks"');
+    });
+  });
+
+  it('column does NOT render empty state when it has cards', () => {
+    const col = COLUMNS[0];
+    const cards = [{ id: 'task-1', title: 'Test task' }];
+    const result = renderColumn(col, cards);
+    assert.strictEqual(result.empty, false);
+    assert.deepStrictEqual(result.cards, cards);
+  });
+
+  it('all columns have unique ids and titles', () => {
+    const ids = COLUMNS.map((c) => c.id);
+    const titles = COLUMNS.map((c) => c.title);
+    assert.strictEqual(new Set(ids).size, ids.length, 'column ids must be unique');
+    assert.strictEqual(new Set(titles).size, titles.length, 'column titles must be unique');
+  });
+});

package/bizar-dash/tests/library-dedupe.test.mjs

@@ -0,0 +1,62 @@
+/**
+ * tests/library-dedupe.test.mjs
+ * Tests H4: LibraryGrid deduplicates entries by name (keeps first occurrence).
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+
+/**
+ * Simulates the LibrariesView dedup logic.
+ * .reduce<LibraryItemProps[]>((acc, item) => {
+ *   if (!acc.some((existing) => existing.name === item.name)) acc.push(item);
+ *   return acc;
+ * }, []);
+ */
+function dedupe(items) {
+  return items.reduce((acc, item) => {
+    if (!acc.some((existing) => existing.name === item.name)) acc.push(item);
+    return acc;
+  }, []);
+}
+
+describe('Libraries dedup by name', () => {
+  it('dedupes 6 entries with 3 distinct names down to 3', () => {
+    const input = [
+      { name: 'skill-a', slug: 'skill-a', status: 'enabled' },
+      { name: 'skill-b', slug: 'skill-b', status: 'enabled' },
+      { name: 'skill-a', slug: 'skill-a-copy', status: 'disabled' }, // dup — should be dropped
+      { name: 'skill-c', slug: 'skill-c', status: 'enabled' },
+      { name: 'skill-b', slug: 'skill-b-copy', status: 'error' }, // dup — should be dropped
+      { name: 'skill-c', slug: 'skill-c-copy', status: 'disabled' }, // dup — should be dropped
+    ];
+    const result = dedupe(input);
+    assert.strictEqual(result.length, 3, 'should return 3 unique items');
+    assert.strictEqual(result[0].name, 'skill-a');
+    assert.strictEqual(result[1].name, 'skill-b');
+    assert.strictEqual(result[2].name, 'skill-c');
+  });
+
+  it('keeps first occurrence when duplicates exist', () => {
+    const input = [
+      { name: 'dup', slug: 'first', status: 'enabled' },
+      { name: 'dup', slug: 'second', status: 'disabled' },
+    ];
+    const result = dedupe(input);
+    assert.strictEqual(result.length, 1);
+    assert.strictEqual(result[0].slug, 'first');
+  });
+
+  it('returns empty array for empty input', () => {
+    assert.strictEqual(dedupe([]).length, 0);
+  });
+
+  it('returns all items when no duplicates', () => {
+    const input = [
+      { name: 'alpha', slug: 'alpha', status: 'enabled' },
+      { name: 'beta', slug: 'beta', status: 'enabled' },
+    ];
+    const result = dedupe(input);
+    assert.strictEqual(result.length, 2);
+  });
+});

package/bizar-dash/tests/notifications-dismiss-restore.test.mjs

@@ -0,0 +1,85 @@
+// bizar-dash/tests/notifications-dismiss-restore.test.mjs
+// M8: Notifications has show-dismissed toggle, restore button, and undo toast.
+// Run with: node --test bizar-dash/tests/notifications-dismiss-restore.test.mjs
+
+import { readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import { describe, it } from 'node:test';
+
+const ROOT    = import.meta.dirname;
+const PROJECT = resolve(ROOT, '..', '..');
+const DASH    = resolve(ROOT, '..');
+
+function dash(file) {
+  return readFileSync(resolve(DASH, file), 'utf-8');
+}
+
+describe('M8: Notifications dismiss/restore/undo', () => {
+  it('has showDismissed state', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('showDismissed')) {
+      throw new Error('NotificationsView missing showDismissed state');
+    }
+  });
+
+  it('has "Show dismissed" / "Hide dismissed" toggle button', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('Show dismissed') && !c.includes('Hide dismissed')) {
+      throw new Error('NotificationsView missing Show/Hide dismissed toggle');
+    }
+    if (!c.includes('data-testid="notifications-toggle-dismissed"')) {
+      throw new Error('toggle dismissed button missing data-testid');
+    }
+  });
+
+  it('has restore() function', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('const restore')) {
+      throw new Error('NotificationsView missing restore function');
+    }
+  });
+
+  it('has Restore button with data-testid', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('data-testid={`notification-restore-')) {
+      throw new Error('Restore button missing data-testid pattern');
+    }
+    if (!c.includes('Restore')) {
+      throw new Error('Restore button should have "Restore" label');
+    }
+  });
+
+  it('has dismissed state tracking', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('setDismissed')) {
+      throw new Error('NotificationsView missing setDismissed state setter');
+    }
+  });
+
+  it('has undo toast with 5-second timer', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('UndoToast')) {
+      throw new Error('NotificationsView missing UndoToast interface');
+    }
+    if (!c.includes('5_000') && !c.includes('5000')) {
+      throw new Error('dismiss should set 5-second undo timer');
+    }
+  });
+
+  it('undo toast has data-testid and Undo button', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('data-testid="notifications-undo-toast"')) {
+      throw new Error('undo toast missing data-testid="notifications-undo-toast"');
+    }
+    if (!c.includes('data-testid="notifications-undo-btn"')) {
+      throw new Error('undo button missing data-testid="notifications-undo-btn"');
+    }
+  });
+
+  it('visibleItems shows all items when showDismissed is true', () => {
+    const c = dash('src/web/v8/views/Notifications/NotificationsView.tsx');
+    if (!c.includes('visibleItems')) {
+      throw new Error('NotificationsView missing visibleItems derived state');
+    }
+  });
+});