@pellux/goodvibes-tui 2.0.20 → 2.1.0

package/src/views/notifications-feed.ts

@@ -0,0 +1,314 @@
+/**
+ * NotificationFeed, the read-model behind the `panel_only` notification
+ * target.
+ *
+ * The SDK's NotificationRouter (`@/runtime/index.ts` -> platform runtime `ui`
+ * barrel) can route a notification's `RoutingDecision.target` to
+ * `'panel_only'`, meaning: don't surface this in the conversation or the
+ * status bar, but it must still reach a real, visible place. Before this
+ * file, nothing in this repo consumed that target outside of tests, a
+ * view-routed notification (including every burst- or batch-collapsed one)
+ * had nowhere to go. This feed is that place: a caller holding a routed
+ * `Notification` + `RoutingDecision` pair calls `record()`, and the
+ * Notifications modal (input/notifications-modal.ts) shows whatever has
+ * accumulated; warning and critical entries also toast.
+ *
+ * Collapsed groups (reasonCode `burst_collapsed` / `batch_window_collapsed`)
+ * are tracked by their `batchKey` and accumulate an honest running count
+ * instead of rendering one row per suppressed duplicate.
+ *
+ * Production wiring, something in the running app actually calling
+ * `record()` with live notifications, rides the SDK round that turns on
+ * adaptive notification suppression by default; this feed and its modal are
+ * the render target that work lands on, built ahead of it so the target is
+ * never missing when that switch flips.
+ */
+import type { Notification, RoutingDecision } from '@/runtime/index.ts';
+
+export interface NotificationFeedEntry {
+  readonly key: string;
+  readonly domain: string;
+  readonly level: Notification['level'];
+  readonly title: string;
+  readonly body: string | undefined;
+  /** Unix ms of the most recent notification folded into this entry. */
+  readonly timestamp: number;
+  /** The router's reason, or 'system_notice' for a conversation system notice (recordNotice). */
+  readonly reasonCode: RoutingDecision['reasonCode'] | 'system_notice';
+  /** How many notifications this entry represents. 1 for a standalone item; >1 for a collapsed group. Always the true count, never estimated. */
+  readonly collapsedCount: number;
+  /**
+   * The view this notification is about (the notification's own panelId or
+   * jump action, else one derived from its domain), resolved to a modal by
+   * input/views.ts. Undefined when it is not about anything that can be opened.
+   */
+  readonly subject?: string;
+  /**
+   * Whether this entry toasts: 'always' for a system notice (every one shows
+   * as a toast), 'never' for one restored from a saved session (it already
+   * happened), absent for a routed notification (warning and critical toast).
+   */
+  readonly toast?: 'always' | 'never';
+}
+
+/** Severity order, for folding two arrivals of one event (the higher level wins). */
+const LEVEL_RANK: Readonly<Record<Notification['level'], number>> = { debug: -1, info: 0, warning: 1, critical: 2 };
+
+/** A conversation system notice to keep in the history (see recordNotice). */
+export interface NoticeInput {
+  readonly domain: string;
+  readonly level: Notification['level'];
+  readonly title: string;
+  readonly body?: string | undefined;
+  readonly timestamp: number;
+  /** A notice restored from a saved session: kept in history, never toasted, already seen. */
+  readonly restored?: boolean;
+  /** The runtime event this notice restates (the SDK's runtimeEventOfNotice key), if any. */
+  readonly eventKey?: string | undefined;
+}
+
+/** Domains whose notifications are about something the Agents modal shows. */
+const AGENT_DOMAINS: ReadonlySet<string> = new Set(['agents', 'tasks', 'workflows', 'automation', 'wrfc', 'orchestration', 'plan']);
+
+/** The view a notification is about, or undefined. */
+function subjectOf(notification: Notification): string | undefined {
+  if (notification.panelId) return notification.panelId;
+  if (notification.action?.type === 'jump_to_panel' && notification.action.panelId) return notification.action.panelId;
+  if (AGENT_DOMAINS.has(notification.domain)) return 'agents';
+  if (notification.domain === 'security') return 'security';
+  if (notification.domain === 'git') return 'changes';
+  return undefined;
+}
+
+/** Plain names for a collapsed group of mixed notifications, by domain. */
+const GROUP_TITLES: Readonly<Record<string, string>> = {
+  agents: 'Agent updates',
+  tasks: 'Task updates',
+  workflows: 'Review chain updates',
+  automation: 'Scheduled job updates',
+  deliveries: 'Message delivery updates',
+  security: 'Security updates',
+  ops: 'System updates',
+};
+
+/** The title a collapsed group of mixed notifications shows: a plain name, never a raw domain id. */
+export function groupTitle(domain: string): string {
+  const known = GROUP_TITLES[domain];
+  if (known) return known;
+  const words = domain.replace(/[_-]+/g, ' ').trim();
+  return words ? `${words[0]!.toUpperCase()}${words.slice(1)} updates` : 'Updates';
+}
+
+/**
+ * Entries kept before the oldest leave. System notices share this bound, so a
+ * long session's full notice history stays reachable in the modal.
+ */
+const MAX_ENTRIES = 2000;
+
+/** Reason codes whose notifications fold into one running-count entry per batch key, rather than one entry per occurrence. */
+const COLLAPSING_REASON_CODES: ReadonlySet<RoutingDecision['reasonCode']> = new Set([
+  'burst_collapsed',
+  'batch_window_collapsed',
+]);
+
+export class NotificationFeed {
+  private readonly entries = new Map<string, NotificationFeedEntry>();
+  /** Insertion order of `entries` keys (oldest first), for bounded eviction. */
+  private order: string[] = [];
+  private readonly listeners = new Set<() => void>();
+  /** Unix ms of the newest entry the user has seen in the Notifications modal. */
+  private seenThrough = 0;
+  private nextNoticeId = 1;
+  /** Per collapsed group: how many of each notification title it folded. */
+  private readonly groupTitles = new Map<string, Map<string, number>>();
+  /**
+   * One entry per runtime event: the entry each event key was recorded in. An
+   * agent or chain event reaches the feed twice, from the runtime-bus bridge
+   * (record) and as the conversation line restating it (recordNotice); the
+   * second arrival folds into the first entry instead of adding another.
+   */
+  private readonly eventEntries = new Map<string, string>();
+
+  /**
+   * Record a routed notification. Only notifications actually targeted at
+   * `panel_only` are kept, a caller passing anything else is a mistake (the
+   * router sent it elsewhere), so it's dropped rather than shown in the
+   * wrong place.
+   */
+  record(notification: Notification, decision: RoutingDecision, eventKey?: string): void {
+    if (decision.target !== 'panel_only') return;
+    if (eventKey && this.foldEvent(eventKey, { level: notification.level, body: notification.body, fromNotice: false, restored: false })) return;
+
+    const collapsing = COLLAPSING_REASON_CODES.has(decision.reasonCode) && Boolean(decision.batchKey);
+    const key = collapsing ? `group:${decision.batchKey}` : `single:${notification.id}`;
+    const previousCount = collapsing ? (this.entries.get(key)?.collapsedCount ?? 0) : 0;
+
+    // A collapsed group folds every notification of one domain and level, of
+    // any kind. Its title names the group, never just its latest member, and
+    // the body counts each kind, so the number shown is what it says it is.
+    let title = notification.title;
+    let body = notification.body;
+    if (collapsing) {
+      const counts = this.groupTitles.get(key) ?? new Map<string, number>();
+      counts.set(notification.title, (counts.get(notification.title) ?? 0) + 1);
+      this.groupTitles.set(key, counts);
+      if (counts.size > 1) {
+        title = groupTitle(notification.domain);
+        body = [...counts].sort((a, b) => b[1] - a[1]).map(([t, n]) => `${t} \u00d7${n}`).join(', ');
+      }
+    }
+    const entry: NotificationFeedEntry = {
+      key,
+      domain: notification.domain,
+      level: notification.level,
+      title,
+      body,
+      timestamp: notification.timestamp,
+      reasonCode: decision.reasonCode,
+      collapsedCount: previousCount + 1,
+      subject: subjectOf(notification),
+    };
+
+    this.store(key, entry);
+    if (eventKey) this.eventEntries.set(eventKey, key);
+  }
+
+  /**
+   * Record a conversation system notice ([WRFC] …, [Agents] …, a compaction
+   * receipt): its full text, one entry per notice. It toasts unless it was
+   * restored from a saved session, which also counts as already seen.
+   */
+  recordNotice(input: NoticeInput): NotificationFeedEntry {
+    if (input.eventKey) {
+      const folded = this.foldEvent(input.eventKey, { level: input.level, body: input.body, fromNotice: true, restored: input.restored === true });
+      if (folded) return folded;
+    }
+    const key = `notice:${this.nextNoticeId++}`;
+    const entry: NotificationFeedEntry = {
+      key,
+      domain: input.domain,
+      level: input.level,
+      title: input.title,
+      body: input.body,
+      timestamp: input.timestamp,
+      reasonCode: 'system_notice',
+      collapsedCount: 1,
+      subject: AGENT_DOMAINS.has(input.domain) ? 'agents' : undefined,
+      toast: input.restored ? 'never' : 'always',
+    };
+    if (input.restored) this.seenThrough = Math.max(this.seenThrough, input.timestamp);
+    this.store(key, entry);
+    if (input.eventKey) this.eventEntries.set(input.eventKey, key);
+    return entry;
+  }
+
+  /**
+   * The second arrival of one runtime event: fold it into the entry the first
+   * made, keeping that entry's plain title and place. The conversation line's
+   * detail is the fuller one, so it becomes the body; the higher level wins;
+   * a live notice makes the entry toast (once, see the toast bridge). A
+   * collapsed group that already counted the event is left as it is. Returns
+   * the entry, or undefined when the event has no entry yet.
+   */
+  private foldEvent(
+    eventKey: string,
+    arrival: { readonly level: Notification['level']; readonly body: string | undefined; readonly fromNotice: boolean; readonly restored: boolean },
+  ): NotificationFeedEntry | undefined {
+    const key = this.eventEntries.get(eventKey);
+    const existing = key === undefined ? undefined : this.entries.get(key);
+    if (!key || !existing) return undefined;
+    if (existing.collapsedCount > 1) return existing;
+    const merged: NotificationFeedEntry = {
+      ...existing,
+      level: LEVEL_RANK[arrival.level] > LEVEL_RANK[existing.level] ? arrival.level : existing.level,
+      body: arrival.fromNotice ? (arrival.body ?? existing.body) : (existing.body ?? arrival.body),
+      ...(arrival.fromNotice && !arrival.restored ? { toast: 'always' as const } : {}),
+    };
+    this.store(key, merged);
+    return merged;
+  }
+
+  private store(key: string, entry: NotificationFeedEntry): void {
+    if (!this.entries.has(key)) {
+      this.order.push(key);
+      if (this.order.length > MAX_ENTRIES) {
+        const evicted = this.order.shift();
+        if (evicted !== undefined) { this.entries.delete(evicted); this.groupTitles.delete(evicted); this.forgetEvents(evicted); }
+      }
+    }
+    this.entries.set(key, entry);
+    this.emitChange();
+  }
+
+  /** Every entry, most recently updated first. */
+  list(): readonly NotificationFeedEntry[] {
+    const items: NotificationFeedEntry[] = [];
+    for (const key of this.order) {
+      const entry = this.entries.get(key);
+      if (entry) items.push(entry);
+    }
+    return items.reverse();
+  }
+
+  clear(): void {
+    this.entries.clear();
+    this.groupTitles.clear();
+    this.eventEntries.clear();
+    this.order = [];
+    this.emitChange();
+  }
+
+  /** Remove one entry (a collapsed group goes as a whole). Returns whether it existed. */
+  dismiss(key: string): boolean {
+    if (!this.entries.delete(key)) return false;
+    this.groupTitles.delete(key);
+    this.forgetEvents(key);
+    this.order = this.order.filter((k) => k !== key);
+    this.emitChange();
+    return true;
+  }
+
+  private forgetEvents(entryKey: string): void {
+    for (const [eventKey, owner] of this.eventEntries) if (owner === entryKey) this.eventEntries.delete(eventKey);
+  }
+
+  /** Entries updated since the user last looked. */
+  unreadCount(): number {
+    let n = 0;
+    for (const entry of this.entries.values()) if (entry.timestamp > this.seenThrough) n++;
+    return n;
+  }
+
+  /** Whether an entry was updated since the user last looked. */
+  isUnread(entry: NotificationFeedEntry): boolean {
+    return entry.timestamp > this.seenThrough;
+  }
+
+  /** Everything recorded so far counts as seen. */
+  markAllSeen(): void {
+    for (const entry of this.entries.values()) this.seenThrough = Math.max(this.seenThrough, entry.timestamp);
+  }
+
+  /** Subscribe to feed changes (e.g. to repaint an open modal). Returns an unsubscribe function. */
+  subscribe(listener: () => void): () => void {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+
+  private emitChange(): void {
+    for (const listener of this.listeners) listener();
+  }
+}
+
+let sharedFeed: NotificationFeed | null = null;
+
+/**
+ * The process-wide `panel_only` feed. Lazily created so the running app has
+ * exactly one feed that every caller and the Notifications modal agree
+ * on, while tests construct their own isolated `NotificationFeed`
+ * instance instead of reaching for this one.
+ */
+export function getSharedNotificationFeed(): NotificationFeed {
+  if (!sharedFeed) sharedFeed = new NotificationFeed();
+  return sharedFeed;
+}

package/src/{panels → views}/polish-core.ts

@@ -4,15 +4,15 @@ import { getDisplayWidth } from '../utils/terminal-width.ts';
 import { activeUiTones, registerThemeRefresh } from '../renderer/theme.ts';
 
 // ---------------------------------------------------------------------------
-// Panel palette + core line primitives.
+// View palette + core line primitives.
 //
-// The leaf foundation of the panel formatting toolkit: both `polish.ts` and
+// The leaf foundation of the view formatting toolkit: both `polish.ts` and
 // `polish-tables.ts` build on these. Kept dependency-free (only grid /
 // terminal-width / ui-primitives) so it never participates in an import cycle.
-// All symbols are re-exported from `polish.ts`, panels import from there.
+// All symbols are re-exported from `polish.ts`, views import from there.
 // ---------------------------------------------------------------------------
 
-export interface PanelPalette {
+export interface ViewPalette {
   readonly label: string;
   readonly value: string;
   readonly dim: string;
@@ -34,10 +34,10 @@ export interface PanelPalette {
 // Built from the mode-resolved chrome tones (activeUiTones). Because 100+ call
 // sites read this object by reference, mode changes rebuild it IN PLACE via the
 // registered refresher below rather than re-resolving per call, see theme.ts's
-// active-mode runtime note. This refresher is registered before any panel's
-// extendPalette() runs (panels import polish → polish-core first), so on a mode
+// active-mode runtime note. This refresher is registered before any view's
+// extendPalette() runs (views import polish → polish-core first), so on a mode
 // flip the base is rebuilt before the extended palettes re-merge from it.
-function buildPanelPalette(): Required<PanelPalette> {
+function buildViewPalette(): Required<ViewPalette> {
   const t = activeUiTones();
   return {
     header: t.fg.primary,
@@ -59,41 +59,43 @@ function buildPanelPalette(): Required<PanelPalette> {
   };
 }
 
-export const DEFAULT_PANEL_PALETTE: Readonly<Required<PanelPalette>> = buildPanelPalette();
-registerThemeRefresh(() => Object.assign(DEFAULT_PANEL_PALETTE as Required<PanelPalette>, buildPanelPalette()));
+export const DEFAULT_VIEW_PALETTE: Readonly<Required<ViewPalette>> = buildViewPalette();
+registerThemeRefresh(() => Object.assign(DEFAULT_VIEW_PALETTE as Required<ViewPalette>, buildViewPalette()));
 
 /**
- * Extend the base panel palette with domain-specific colors.
+ * Extend the base view palette with domain-specific colors.
  *
- * Convention: raw hex colors may only live inside a palette constant declared
- * at the top of a panel file, not inline in render calls.
+ * `extras` is a builder that reads theme tokens (activeTokens() /
+ * activeUiTones()); it runs now and again on every theme or mode change, so
+ * the domain colors follow the active theme. Raw hex literals do not belong
+ * in extras: map each domain color onto a theme token.
  *
  * @example
  * ```ts
- * const C = extendPalette(DEFAULT_PANEL_PALETTE, {
- *   decision: '#38bdf8',
- *   incident: '#ef4444',
+ * const C = extendPalette(DEFAULT_VIEW_PALETTE, () => {
+ *   const p = activeTokens();
+ *   return { decision: p.info, incident: p.error };
  * });
  * ```
  */
 export function extendPalette<T extends Record<string, string>>(
-  base: typeof DEFAULT_PANEL_PALETTE,
-  extras: T,
-): typeof DEFAULT_PANEL_PALETTE & T {
-  const merged = { ...base, ...extras } as typeof DEFAULT_PANEL_PALETTE & T;
-  // Self-register an in-place rebuild so every extendPalette-derived panel
-  // palette (cost/token/git/skills/diff/wrfc) tracks the active mode with zero
-  // per-panel churn. Runs AFTER the base refresher (registered at module eval,
-  // before any panel calls this), so `base` already carries the new-mode values.
-  registerThemeRefresh(() => Object.assign(merged as Record<string, string>, base, extras));
+  base: typeof DEFAULT_VIEW_PALETTE,
+  extras: () => T,
+): typeof DEFAULT_VIEW_PALETTE & T {
+  const merged = { ...base, ...extras() } as typeof DEFAULT_VIEW_PALETTE & T;
+  // Self-register an in-place rebuild so every extendPalette-derived view
+  // palette tracks the active theme with zero per-view churn. Runs AFTER the
+  // base refresher (registered at module eval, before any view calls this),
+  // so `base` already carries the new values when the extras are rebuilt.
+  registerThemeRefresh(() => Object.assign(merged as Record<string, string>, base, extras()));
   return merged;
 }
 
-export function buildPanelLine(
+export function buildViewLine(
   width: number,
-  segments: Array<StyledPanelSegment | [string, string, string?]>,
+  segments: Array<StyledViewSegment | [string, string, string?]>,
 ): Line {
-  return buildStyledPanelLine(
+  return buildStyledViewLine(
     width,
     segments.map((seg) =>
       Array.isArray(seg) ? { text: seg[0], fg: seg[1], bg: seg[2] } : seg,
@@ -101,7 +103,7 @@ export function buildPanelLine(
   );
 }
 
-export interface StyledPanelSegment {
+export interface StyledViewSegment {
   readonly text: string;
   readonly fg: string;
   readonly bg?: string;
@@ -109,13 +111,13 @@ export interface StyledPanelSegment {
   readonly dim?: boolean;
 }
 
-export function buildSelectablePanelLine(
+export function buildSelectableViewLine(
   width: number,
-  segments: ReadonlyArray<StyledPanelSegment>,
+  segments: ReadonlyArray<StyledViewSegment>,
   options: { selected?: boolean; selectedBg?: string; fillFg?: string; fillBg?: string; leadingMarker?: string } = {},
 ): Line {
   const selected = options.selected ?? false;
-  const selectedBg = selected ? (options.selectedBg ?? DEFAULT_PANEL_PALETTE.selectBg) : '';
+  const selectedBg = selected ? (options.selectedBg ?? DEFAULT_VIEW_PALETTE.selectBg) : '';
   const fillBg = selectedBg || options.fillBg || '';
   const fillFg = options.fillFg ?? '';
   const cells = createEmptyLine(width);
@@ -130,8 +132,8 @@ export function buildSelectablePanelLine(
     for (const ch of options.leadingMarker) {
       const charWidth = getDisplayWidth(ch);
       if (charWidth <= 0 || col + charWidth > width) break;
-      cells[col] = createStyledCell(ch, { fg: DEFAULT_PANEL_PALETTE.info, bg: selectedBg, bold: true });
-      if (charWidth > 1 && col + 1 < width) cells[col + 1] = createStyledCell(' ', { fg: DEFAULT_PANEL_PALETTE.info, bg: selectedBg, bold: true });
+      cells[col] = createStyledCell(ch, { fg: DEFAULT_VIEW_PALETTE.info, bg: selectedBg, bold: true });
+      if (charWidth > 1 && col + 1 < width) cells[col + 1] = createStyledCell(' ', { fg: DEFAULT_VIEW_PALETTE.info, bg: selectedBg, bold: true });
       col += charWidth;
     }
   }
@@ -166,10 +168,10 @@ export function buildSelectablePanelLine(
   return cells;
 }
 
-export function buildStyledPanelLine(
+export function buildStyledViewLine(
   width: number,
-  segments: ReadonlyArray<StyledPanelSegment>,
+  segments: ReadonlyArray<StyledViewSegment>,
   options: { fillBg?: string; fillFg?: string } = {},
 ): Line {
-  return buildSelectablePanelLine(width, segments, options);
+  return buildSelectableViewLine(width, segments, options);
 }

package/src/{panels → views}/polish-tables.ts

@@ -1,17 +1,18 @@
 import type { Line } from '@pellux/goodvibes-sdk/platform/types';
 import { getDisplayWidth, truncateDisplay } from '../utils/terminal-width.ts';
-import { GLYPHS, UI_TONES } from '../renderer/ui-primitives.ts';
+import { GLYPHS } from '../renderer/ui-primitives.ts';
+import { activeUiTones, registerThemeRefresh } from '../renderer/theme.ts';
 // Build on the leaf primitives in ./polish-core.ts (palette + base line
 // builders). polish-core has no back-edge to this file, so there is no cycle.
-import { buildSelectablePanelLine, DEFAULT_PANEL_PALETTE } from './polish-core.ts';
-import type { PanelPalette, StyledPanelSegment } from './polish-core.ts';
+import { buildSelectableViewLine, DEFAULT_VIEW_PALETTE } from './polish-core.ts';
+import type { ViewPalette, StyledViewSegment } from './polish-core.ts';
 
 // ---------------------------------------------------------------------------
-// Shared formatting primitives (the toolkit panels standardize on).
+// Shared formatting primitives (the toolkit views standardize on).
 //
 // All are display-width aware (via getDisplayWidth / truncateDisplay) so they
 // stay aligned across emoji, CJK, and other wide characters, never hand-roll
-// .slice()/.padEnd() truncation or alignment in panels.
+// .slice()/.padEnd() truncation or alignment in views.
 // ---------------------------------------------------------------------------
 
 export type ColumnAlign = 'left' | 'right' | 'center';
@@ -64,7 +65,7 @@ export function buildAlignedRow(
   } = {},
 ): Line {
   const gap = options.gap ?? 1;
-  const segments: StyledPanelSegment[] = [];
+  const segments: StyledViewSegment[] = [];
   const count = Math.min(cells.length, columns.length);
   for (let i = 0; i < count; i++) {
     const col = columns[i]!;
@@ -78,7 +79,7 @@ export function buildAlignedRow(
       dim: cell.dim,
     });
   }
-  return buildSelectablePanelLine(width, segments, {
+  return buildSelectableViewLine(width, segments, {
     selected: options.selected,
     selectedBg: options.selectedBg,
     fillBg: options.fillBg,
@@ -101,27 +102,35 @@ interface BadgeSpec {
   readonly label: string;
 }
 
-const STATUS_BADGES: Record<StatusBadgeKind, BadgeSpec> = {
-  pending:   { glyph: GLYPHS.status.pending, fg: DEFAULT_PANEL_PALETTE.info, label: 'Pending' },
-  running:   { glyph: GLYPHS.status.active,  fg: UI_TONES.state.active,      label: 'Running' },
-  completed: { glyph: GLYPHS.status.success, fg: DEFAULT_PANEL_PALETTE.good, label: 'Completed' },
-  failed:    { glyph: GLYPHS.status.failure, fg: DEFAULT_PANEL_PALETTE.bad,  label: 'Failed' },
-  cancelled: { glyph: GLYPHS.status.skipped, fg: DEFAULT_PANEL_PALETTE.dim,  label: 'Cancelled' },
-  blocked:   { glyph: GLYPHS.status.blocked, fg: UI_TONES.state.blocked,     label: 'Blocked' },
-  review:    { glyph: GLYPHS.status.review,  fg: DEFAULT_PANEL_PALETTE.info, label: 'Review' },
-};
+function buildStatusBadges(): Record<StatusBadgeKind, BadgeSpec> {
+  const tones = activeUiTones();
+  return {
+    pending:   { glyph: GLYPHS.status.pending, fg: DEFAULT_VIEW_PALETTE.info, label: 'Pending' },
+    running:   { glyph: GLYPHS.status.active,  fg: tones.state.active,         label: 'Running' },
+    completed: { glyph: GLYPHS.status.success, fg: DEFAULT_VIEW_PALETTE.good, label: 'Completed' },
+    failed:    { glyph: GLYPHS.status.failure, fg: DEFAULT_VIEW_PALETTE.bad,  label: 'Failed' },
+    cancelled: { glyph: GLYPHS.status.skipped, fg: DEFAULT_VIEW_PALETTE.dim,  label: 'Cancelled' },
+    blocked:   { glyph: GLYPHS.status.blocked, fg: tones.state.blocked,        label: 'Blocked' },
+    review:    { glyph: GLYPHS.status.review,  fg: DEFAULT_VIEW_PALETTE.info, label: 'Review' },
+  };
+}
+
+// Rebuilt in place on every theme change (registered after the base palette's
+// own refresher, so DEFAULT_VIEW_PALETTE already carries the new values).
+const STATUS_BADGES: Record<StatusBadgeKind, BadgeSpec> = buildStatusBadges();
+registerThemeRefresh(() => Object.assign(STATUS_BADGES, buildStatusBadges()));
 
 /**
  * Canonical status badge (glyph + label) with a consistent color per lifecycle
- * state. Returns StyledPanelSegment[], spread into a buildPanelLine call:
- *   buildPanelLine(width, [['  ', C.label], ...buildStatusBadge('running')])
- * Supersedes ad-hoc per-panel status→color maps.
+ * state. Returns StyledViewSegment[], spread into a buildViewLine call:
+ *   buildViewLine(width, [['  ', C.label], ...buildStatusBadge('running')])
+ * Supersedes ad-hoc per-view status→color maps.
  */
 export function buildStatusBadge(
   kind: StatusBadgeKind,
   label?: string,
   opts?: { glyph?: string; bg?: string; count?: number },
-): StyledPanelSegment[] {
+): StyledViewSegment[] {
   const spec = STATUS_BADGES[kind];
   const glyph = opts?.glyph ?? spec.glyph;
   const text = label ?? spec.label;
@@ -143,12 +152,12 @@ export interface TreeItemSpec {
 /**
  * Build a hierarchical tree row: indentation + expand/collapse glyph + optional
  * icon + label, with right-aligned metadata. Replaces hand-rolled indentation
- * in file-explorer / symbol-outline / orchestration panels.
+ * in file-explorer / symbol-outline / orchestration views.
  */
 export function buildTreeRow(
   width: number,
   item: TreeItemSpec,
-  palette: PanelPalette,
+  palette: ViewPalette,
   options: { selected?: boolean; selectedBg?: string; indentWidth?: number } = {},
 ): Line {
   const indent = ' '.repeat(Math.max(0, item.depth) * (options.indentWidth ?? 2));
@@ -168,7 +177,7 @@ export function buildTreeRow(
   const label = truncateDisplay(item.label, labelBudget);
   const usedW = prefixW + getDisplayWidth(label);
 
-  const segments: StyledPanelSegment[] = [
+  const segments: StyledViewSegment[] = [
     { text: prefix, fg: palette.dim },
     { text: label, fg: item.labelColor ?? palette.value },
   ];
@@ -180,7 +189,7 @@ export function buildTreeRow(
       segments.push({ text: m.text, fg: m.fg });
     });
   }
-  return buildSelectablePanelLine(width, segments, {
+  return buildSelectableViewLine(width, segments, {
     selected: options.selected,
     selectedBg: options.selectedBg ?? palette.selectBg,
   });
@@ -222,13 +231,13 @@ function resolveColumnWidths(width: number, columns: ReadonlyArray<TableColumn>,
 
 /**
  * Build a table: a header row plus aligned data rows. Replaces ad-hoc
- * row/column offset math in history/ledger/roster panels.
+ * row/column offset math in history/ledger/roster views.
  */
 export function buildTable(
   width: number,
   columns: ReadonlyArray<TableColumn>,
   rows: ReadonlyArray<TableRow>,
-  palette: PanelPalette,
+  palette: ViewPalette,
   options: { gap?: number; selectedBg?: string } = {},
 ): Line[] {
   const gap = options.gap ?? 1;