@pellux/goodvibes-tui 0.27.0 → 0.29.0

package/src/panels/hooks-panel.ts

@@ -9,28 +9,39 @@ import type { HookChain, HookDefinition } from '@pellux/goodvibes-sdk/platform/h
 import type { HookWorkbench } from '@pellux/goodvibes-sdk/platform/hooks';
 import { truncateDisplay } from '../utils/terminal-width.ts';
 import {
+  type ConfirmState,
+  handleConfirmInput,
+  renderConfirmLines,
+} from './confirm-state.ts';
+import {
+  buildKeyValueLine,
+  buildKeyboardHints,
   buildPanelLine,
   buildStatusPill,
   DEFAULT_PANEL_PALETTE,
+  resolveScrollablePanelSection,
 } from './polish.ts';
 
-const C = {
-  ...DEFAULT_PANEL_PALETTE,
-  header: '#94a3b8',
-  headerBg: '#1e293b',
-  ok: '#22c55e',
-  warn: '#eab308',
-  error: '#ef4444',
-  info: '#38bdf8',
-  selectBg: '#0f172a',
-} as const;
+// Base chrome only — title band, state colors, and text tokens all come
+// straight from DEFAULT_PANEL_PALETTE (WO-002).
+const C = DEFAULT_PANEL_PALETTE;
 
+/**
+ * WO-134: widened past read-only listing to also carry the three managed-hook
+ * mutation methods the panel drives directly (t=toggle, x=remove, s=simulate),
+ * mirroring the /hooks enable|disable|remove|simulate subcommands
+ * (hooks-runtime.ts). The raw `HookWorkbench` class instance passed at
+ * bootstrap already implements all three.
+ */
 export interface HooksPanelWorkbenchView {
   listManagedHooks(): Array<{ pattern: string; hook: HookDefinition }>;
   listManagedChains(): HookChain[];
   listRecentActions(limit?: number): HookAuthoringAction[];
   getLastSimulation(): HookSimulationResult | null;
   getHooksFilePath(): string;
+  toggleManagedHook(name: string, enabled: boolean): boolean;
+  removeManagedEntry(name: string): boolean;
+  simulate(eventPath: string, payload?: Record<string, unknown>): HookSimulationResult;
 }
 
 export interface HooksPanelDataSource {
@@ -59,6 +70,10 @@ type HookEntry = { pattern: string; hook: HookDefinition };
 
 export class HooksPanel extends ScrollableListPanel<HookEntry> {
   private readonly dataSource: HooksPanelDataSource;
+  /** Pending confirm for 'x' remove — destructive, so it goes through the project-standard confirm contract. Subject is the managed hook name. */
+  private confirmAction: ConfirmState<string> | null = null;
+  /** Toggled by 'a' — widens the Recent Activity window from a short glance to a fuller scrollable review. */
+  private _activityExpanded = false;
 
   public constructor(
     hookDispatcher: Pick<HookDispatcher, 'listHooks' | 'getChains'>,
@@ -66,11 +81,19 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
     hookActivityTracker: Pick<HookActivityTracker, 'listRecent'>,
     dataSource: HooksPanelDataSource = createDefaultDataSource(hookDispatcher, hookWorkbench, hookActivityTracker),
   ) {
-    super('hooks', 'Hooks', 'H', 'monitoring');
+    super('hooks', 'Hooks', '▨', 'automation-control');
     this.showSelectionGutter = true; // I5: non-color selection affordance
+    this.filterEnabled = true;
+    this.filterLabel = 'Filter hooks';
     this.dataSource = dataSource;
   }
 
+  protected override filterMatches(entry: HookEntry, q: string): boolean {
+    return (entry.hook.name ?? '').toLowerCase().includes(q)
+      || entry.pattern.toLowerCase().includes(q)
+      || entry.hook.type.toLowerCase().includes(q);
+  }
+
   protected override getPalette() { return C; }
   protected override getEmptyStateMessage() { return ' No hooks are currently registered.'; }
   protected override getEmptyStateActions() {
@@ -96,19 +119,113 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
   }
 
   public handleInput(key: string): boolean {
-    if (key === 'r') {
-      this.markDirty();
+    if (this.lastError !== null) this.clearError();
+
+    if (this.confirmAction) {
+      const result = handleConfirmInput(this.confirmAction, key);
+      if (result === 'confirmed') {
+        this._removeManaged(this.confirmAction.subject);
+        this.confirmAction = null;
+        this.markDirty();
+        return true;
+      }
+      if (result === 'cancelled') {
+        this.confirmAction = null;
+        this.markDirty();
+      }
       return true;
     }
+
+    if (!this.filterActive) {
+      switch (key) {
+        case 'r':
+          this.markDirty();
+          return true;
+        case 't':
+          this._toggleSelected();
+          return true;
+        case 'x':
+          this._requestRemove();
+          return true;
+        case 's':
+          this._simulateSelected();
+          return true;
+        case 'a':
+          this._activityExpanded = !this._activityExpanded;
+          this.markDirty();
+          return true;
+        default:
+          break;
+      }
+    }
+
     return super.handleInput(key);
   }
 
+  private _selectedEntry(): HookEntry | undefined {
+    return this.getSelectedItem();
+  }
+
+  /**
+   * WO-134: t=toggle — mirrors `/hooks enable|disable <name>` (hooks-runtime.ts:64-77),
+   * flipping the selected hook's managed enabled state via workbench.toggleManagedHook.
+   */
+  private _toggleSelected(): void {
+    const entry = this._selectedEntry();
+    if (!entry) return;
+    const name = entry.hook.name;
+    if (!name) {
+      this.setError('This hook has no managed name to toggle.');
+      this.markDirty();
+      return;
+    }
+    const nextEnabled = entry.hook.enabled === false;
+    const changed = this.dataSource.getWorkbench().toggleManagedHook(name, nextEnabled);
+    if (!changed) this.setError(`No managed hook named '${name}'.`);
+    this.markDirty();
+  }
+
+  private _requestRemove(): void {
+    const entry = this._selectedEntry();
+    if (!entry) return;
+    const name = entry.hook.name;
+    if (!name) {
+      this.setError('This hook has no managed name to remove.');
+      this.markDirty();
+      return;
+    }
+    this.confirmAction = { subject: name, label: name, verb: 'Remove' };
+    this.markDirty();
+  }
+
+  private _removeManaged(name: string): void {
+    const removed = this.dataSource.getWorkbench().removeManagedEntry(name);
+    if (!removed) this.setError(`No managed hook or chain named '${name}'.`);
+    this.markDirty();
+  }
+
+  /**
+   * WO-134: s=simulate — mirrors `/hooks simulate <eventPath>` (hooks-runtime.ts:78-93)
+   * using the selected hook's own pattern as the simulated event path. The
+   * result lands in workbench.getLastSimulation(), already rendered below.
+   */
+  private _simulateSelected(): void {
+    const entry = this._selectedEntry();
+    if (!entry) return;
+    this.dataSource.getWorkbench().simulate(entry.pattern);
+    this.markDirty();
+  }
+
   public render(width: number, height: number): Line[] {
     this.clampSelection();
     const hooks = this.dataSource.listHooks();
     const contracts = this.dataSource.listContracts();
     const chains = this.dataSource.listChains();
-    const recentActivity = this.dataSource.listRecentActivity(3);
+    // Fixed-window stats stay stable regardless of the 'a' expand toggle below;
+    // only the displayed activity rows grow when expanded.
+    const recentActivityForStats = this.dataSource.listRecentActivity(3);
+    const activityLimit = this._activityExpanded ? 20 : 3;
+    const recentActivity = this.dataSource.listRecentActivity(activityLimit);
     const workbench = this.dataSource.getWorkbench();
     const managedHooks = workbench.listManagedHooks();
     const managedChains = workbench.listManagedChains();
@@ -116,7 +233,7 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
     const lastSimulation = workbench.getLastSimulation();
     const intro = 'Hook contracts, active registrations, managed authoring, recent runtime activity, and simulation matches.';
 
-    const selected = hooks[this.selectedIndex];
+    const selected = this.getSelectedItem();
     const contract = selected ? contracts.find((c) => c.pattern === selected.pattern) : undefined;
 
     const detailLines: Line[] = [];
@@ -157,10 +274,10 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
       ]));
     }
 
-    const activityLines: Line[] = recentActivity.length === 0
+    const activityRows: Line[] = recentActivity.length === 0
       ? [buildPanelLine(width, [['  No hook activity recorded yet.', C.empty]])]
       : recentActivity.map((record) => {
-          const color = !record.ok ? C.error : record.decision === 'deny' ? C.warn : C.ok;
+          const color = !record.ok ? C.bad : record.decision === 'deny' ? C.warn : C.good;
           return buildPanelLine(width, [
             ['  ', C.label],
             [truncateDisplay(record.hookName, 18).padEnd(18), C.value],
@@ -171,6 +288,20 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
           ]);
         });
 
+    // WO-134: 'a' expands the activity window from a short glance (3 rows) to
+    // a fuller scrollable review (up to 20); resolveScrollablePanelSection
+    // appends a "+N more" summary row when even the expanded fetch overflows
+    // the available space, so the list never silently truncates unlabeled.
+    const activityLines: readonly Line[] = resolveScrollablePanelSection(width, height, {
+      palette: C,
+      section: {
+        scrollableLines: activityRows,
+        scrollOffset: 0,
+        minRows: this._activityExpanded ? 8 : 3,
+        appendWindowSummary: recentActivity.length > 0 ? { dimColor: C.dim } : undefined,
+      },
+    }).section.lines;
+
     const authoringLines: Line[] = recentAuthoring.length === 0
       ? [buildPanelLine(width, [['  No managed hook authoring actions recorded yet.', C.empty]])]
       : recentAuthoring.map((action) => buildPanelLine(width, [
@@ -224,15 +355,46 @@ export class HooksPanel extends ScrollableListPanel<HookEntry> {
       });
     }
 
+    // Summary header — surface registration + activity counts first so the most
+    // important "what's firing" signal is visible without scrolling to the footer.
+    const denials = recentActivityForStats.filter((r) => r.ok && r.decision === 'deny').length;
+    const errors = recentActivityForStats.filter((r) => !r.ok).length;
+    const headerLines: Line[] = [
+      buildKeyValueLine(width, [
+        { label: 'hooks', value: String(hooks.length), valueColor: C.info },
+        { label: 'chains', value: String(chains.length), valueColor: C.value },
+        { label: 'contracts', value: String(contracts.length), valueColor: C.value },
+        { label: 'recent denials', value: String(denials), valueColor: denials > 0 ? C.warn : C.dim },
+        { label: 'errors', value: String(errors), valueColor: errors > 0 ? C.bad : C.dim },
+      ], C),
+    ];
+
+    const hints = this.filterActive
+      ? [{ keys: 'type', label: 'filter' }, { keys: 'Enter', label: 'apply' }, { keys: 'Esc', label: 'clear' }]
+      : [
+          { keys: 'Up/Down', label: 'move' },
+          { keys: 't', label: 'toggle' },
+          { keys: 'x', label: 'remove' },
+          { keys: 's', label: 'simulate' },
+          { keys: 'a', label: this._activityExpanded ? 'collapse activity' : 'expand activity' },
+          { keys: 'r', label: 'refresh' },
+          { keys: '/', label: 'filter' },
+        ];
+
     return this.renderList(width, height, {
       title: 'Hooks Control Room',
+      header: headerLines,
       footer: [
         ...detailLines,
-        buildPanelLine(width, [['  Recent Activity', C.label]]),
+        buildPanelLine(width, [
+          ['  Recent Activity', C.label],
+          [this._activityExpanded ? '  (a to collapse)' : '  (a to expand)', C.dim],
+        ]),
         ...activityLines,
         buildPanelLine(width, [['  Authoring', C.label]]),
         ...authoringLines,
-        buildPanelLine(width, [['  Up/Down move  r refresh  /hooks for full contract listing', C.dim]]),
+        ...(this.confirmAction ? renderConfirmLines(width, this.confirmAction) : []),
+        buildKeyboardHints(width, hints, C),
       ],
     });
   }

package/src/panels/incident-review-panel.ts

@@ -1,5 +1,15 @@
+import { logger } from '@pellux/goodvibes-sdk/platform/utils';
 import type { Line } from '../types/grid.ts';
-import type { ForensicsRegistry } from '@/runtime/index.ts';
+import { fitDisplay, truncateDisplay } from '../utils/terminal-width.ts';
+import { formatShortDuration } from '../utils/format-duration.ts';
+import type {
+  ForensicsRegistry,
+  FailureReport,
+  ForensicsBundle,
+  CausalChainEntry,
+  PhaseTimingEntry,
+  ForensicsJumpLink,
+} from '@/runtime/index.ts';
 import { ScrollableListPanel } from './scrollable-list-panel.ts';
 import {
   buildBodyText,
@@ -12,16 +22,12 @@ import {
   DEFAULT_PANEL_PALETTE,
   type PanelPalette,
 } from './polish.ts';
-import type { FailureReport } from '@/runtime/index.ts';
+import { type ConfirmState, handleConfirmInput, renderConfirmLines } from './confirm-state.ts';
+import type { PanelIntegrationContext } from './types.ts';
 
-const C = {
-  ...DEFAULT_PANEL_PALETTE,
-  header: '#cbd5e1',
-  headerBg: '#0f172a',
-  warn: '#f59e0b',
-  bad: '#ef4444',
-  selectBg: '#111827',
-} as const;
+// Base chrome only — title band, state colors, and text tokens all come
+// straight from DEFAULT_PANEL_PALETTE (WO-002).
+const C = DEFAULT_PANEL_PALETTE;
 
 function classificationColor(value: string): string {
   switch (value) {
@@ -35,15 +41,53 @@ function classificationColor(value: string): string {
   }
 }
 
+function fmtTime(ts: number): string {
+  const d = new Date(ts);
+  const hh = String(d.getHours()).padStart(2, '0');
+  const mm = String(d.getMinutes()).padStart(2, '0');
+  const ss = String(d.getSeconds()).padStart(2, '0');
+  return `${hh}:${mm}:${ss}`;
+}
+
+/**
+ * Default workspace-relative destination for a panel-triggered `x` export.
+ * Left relative (not resolved against home/cwd here) so the `/incident
+ * export` command's own `shellPaths.resolveWorkspacePath` — the composition
+ * root's owned path resolver — decides the final absolute location.
+ */
+function buildIncidentExportPath(id: string): string {
+  return `goodvibes-exports/incident-${id}-${Date.now()}.json`;
+}
+
 export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
   private readonly registry?: ForensicsRegistry;
   private readonly unsub: (() => void) | null;
 
+  // Inline confirm for the (non-destructive but deliberate) capture action.
+  private _confirm: ConfirmState<string> | null = null;
+
+  // Pending cross-panel actions resolved via handlePanelIntegrationAction,
+  // which is the only place `executeCommand`/`panelManager` are available.
+  private _pendingExport: string | null = null;
+  private _pendingCapture: string | null = null;
+  private _pendingJump: ForensicsJumpLink | null = null;
+
+  // Cache buildBundle(id) per selected report id instead of recomputing it
+  // on every render call; invalidated whenever the registry changes.
+  private _bundleCache: { readonly id: string; readonly bundle: ForensicsBundle | undefined } | null = null;
+
   public constructor(registry?: ForensicsRegistry) {
-    super('incident', 'Incident Review', 'N', 'monitoring');
+    super('incident', 'Incident Review', '◪', 'incidents-diagnostics');
     this.showSelectionGutter = true; // I5: non-color selection affordance
+    this.filterEnabled = true;
+    this.filterLabel = 'Filter incidents';
     this.registry = registry;
-    this.unsub = registry ? registry.subscribe(() => this.markDirty()) : null;
+    this.unsub = registry
+      ? registry.subscribe(() => {
+        this._bundleCache = null;
+        this.markDirty();
+      })
+      : null;
   }
 
   public override onDestroy(): void {
@@ -58,13 +102,19 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
     return this.registry?.getAll() ?? [];
   }
 
+  protected override filterMatches(report: FailureReport, q: string): boolean {
+    return report.classification.toLowerCase().includes(q)
+      || report.id.toLowerCase().includes(q)
+      || (report.summary ?? '').toLowerCase().includes(q);
+  }
+
   protected renderItem(report: FailureReport, index: number, selected: boolean, width: number): Line {
     const bg = selected ? C.selectBg : undefined;
     return buildPanelLine(width, [
       [' ', C.label, bg],
-      [report.id.slice(0, 8).padEnd(9), C.dim, bg],
-      [report.classification.padEnd(20), classificationColor(report.classification), bg],
-      [report.summary.slice(0, Math.max(0, width - 31)), C.value, bg],
+      [fitDisplay(report.id, 9), C.dim, bg],
+      [fitDisplay(report.classification, 20), classificationColor(report.classification), bg],
+      [truncateDisplay(report.summary, Math.max(0, width - 31)), C.value, bg],
     ]);
   }
 
@@ -79,8 +129,152 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
     ];
   }
 
+  private getBundle(id: string): ForensicsBundle | undefined {
+    if (!this.registry) return undefined;
+    if (!this._bundleCache || this._bundleCache.id !== id) {
+      this._bundleCache = { id, bundle: this.registry.buildBundle(id) };
+    }
+    return this._bundleCache.bundle;
+  }
+
+  private _pushPhaseTimingLine(lines: Line[], pt: PhaseTimingEntry, width: number): void {
+    const statusChar = pt.success ? '✓' : '✕';
+    const statusColor = pt.success ? C.good : C.bad;
+    const dur = formatShortDuration(pt.durationMs);
+    const phaseLabel = fitDisplay(pt.phase, 14);
+    const errPart = pt.error ? `  ${truncateDisplay(pt.error, Math.max(0, width - 34))}` : '';
+    lines.push(buildPanelLine(width, [
+      ['    ', C.dim],
+      [`${statusChar} `, statusColor],
+      [phaseLabel, C.value],
+      [dur.padStart(8, ' '), C.label],
+      [errPart, C.bad],
+    ]));
+  }
+
+  private _pushCausalLine(lines: Line[], entry: CausalChainEntry, width: number): void {
+    const prefix = entry.isRootCause ? '    * ' : '    - ';
+    const color = entry.isRootCause ? C.bad : C.dim;
+    const timeStr = fmtTime(entry.ts);
+    const descMax = Math.max(0, width - prefix.length - 9);
+    lines.push(buildPanelLine(width, [
+      [prefix, color],
+      [`${timeStr} `, C.label],
+      [truncateDisplay(entry.description, descMax), color],
+    ]));
+  }
+
+  private _pushJumpLinkLine(lines: Line[], link: ForensicsJumpLink, width: number): void {
+    const kindTag = link.kind === 'panel' ? '[panel]' : '[cmd]  ';
+    lines.push(buildPanelLine(width, [
+      ['    ', C.dim],
+      [kindTag, C.label],
+      [` ${link.label}`, C.info],
+      [link.args ? ` (${link.args})` : '', C.dim],
+    ]));
+  }
+
+  /**
+   * Decision-making for every key: navigation is delegated to
+   * ScrollableListPanel, while `x`/`c`/`j` and any in-progress confirm are
+   * resolved here and staged as a pending action. The actual cross-panel
+   * side effect (executeCommand / panelManager.open) requires the
+   * PanelIntegrationContext, which is only available in
+   * `handlePanelIntegrationAction` — invoked immediately after this method
+   * returns `true` for the same key.
+   */
+  public override handleInput(key: string): boolean {
+    if (this.lastError !== null) this.clearError();
+
+    if (this._confirm) {
+      const outcome = handleConfirmInput(this._confirm, key);
+      if (outcome === 'confirmed') {
+        this._pendingCapture = this._confirm.subject;
+        this._confirm = null;
+        this.markDirty();
+        return true;
+      }
+      if (outcome === 'cancelled') {
+        this._confirm = null;
+        this.markDirty();
+        return true;
+      }
+      return true; // absorbed — keep the confirm dialog pending
+    }
+
+    // Actions must target the filtered view the list highlights — raw
+    // getItems() desyncs selectedIndex under an applied '/' filter.
+    const reports = this.getVisibleItems();
+    if (reports.length > 0 && (key === 'x' || key === 'c' || key === 'j')) {
+      this.clampSelection();
+      const selected = this.getSelectedItem();
+      if (selected) {
+        if (key === 'x') {
+          this._pendingExport = selected.id;
+          return true;
+        }
+        if (key === 'c') {
+          this._confirm = { subject: selected.id, label: `incident ${selected.id}`, verb: 'Capture' };
+          this.markDirty();
+          return true;
+        }
+        if (key === 'j') {
+          const link = selected.jumpLinks[0];
+          if (link) {
+            this._pendingJump = link;
+            return true;
+          }
+          return false;
+        }
+      }
+    }
+
+    return super.handleInput(key);
+  }
+
+  public handlePanelIntegrationAction(_key: string, ctx: PanelIntegrationContext): boolean {
+    if (this._pendingExport) {
+      const id = this._pendingExport;
+      this._pendingExport = null;
+      const path = buildIncidentExportPath(id);
+      void ctx.executeCommand?.('incident', ['export', id, path]).catch((err) => {
+        logger.debug('incident export dispatch failed', { err });
+      });
+      return true;
+    }
+    if (this._pendingCapture) {
+      const id = this._pendingCapture;
+      this._pendingCapture = null;
+      void ctx.executeCommand?.('incident', ['capture', id]).catch((err) => {
+        logger.debug('incident capture dispatch failed', { err });
+      });
+      return true;
+    }
+    if (this._pendingJump) {
+      const link = this._pendingJump;
+      this._pendingJump = null;
+      if (link.kind === 'panel') {
+        ctx.panelManager.open(link.target);
+      } else {
+        void ctx.executeCommand?.(link.target, link.args ? link.args.split(/\s+/).filter(Boolean) : []).catch((err) => {
+          logger.debug('jump link dispatch failed', { err });
+        });
+      }
+      return true;
+    }
+    return false;
+  }
+
   public render(width: number, height: number): Line[] {
-    const intro = 'Failure bundles, replay mismatches, permission fallout, and exportable review evidence.';
+    if (this._confirm) {
+      return buildPanelWorkspace(width, height, {
+        title: 'Incident Review Workspace',
+        sections: [{ title: 'Confirmation', lines: renderConfirmLines(width, this._confirm) }],
+        palette: C,
+      });
+    }
+
+    const intro = 'Failure bundles with causal chains, phase timings, jump links, and exportable review evidence.';
 
     if (!this.registry) {
       return buildPanelWorkspace(width, height, {
@@ -89,12 +283,9 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
         sections: [{
           lines: buildEmptyState(
             width,
-            ' Forensics registry not wired into this panel yet.',
-            'Incident review needs the live forensics registry so it can inspect failure bundles, replay mismatches, and causal evidence.',
-            [
-              { command: '/incident latest', summary: 'inspect the latest incident from the command surface' },
-              { command: '/security', summary: 'open the broader trust and incident posture control room' },
-            ],
+            ' Incident registry not configured for this session.',
+            'This runtime was not wired with a forensics registry at bootstrap, so no incident data is available.',
+            [],
             C,
           ),
         }],
@@ -108,16 +299,21 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
     }
 
     this.clampSelection();
-    const selected = reports[this.selectedIndex]!;
-    const bundle = this.registry.buildBundle(selected.id);
+    // Header/detail must describe the row the (possibly filtered) list
+    // highlights; a filter matching nothing leaves no selection at all.
+    const visible = this.getVisibleItems();
+    const selected = this.getSelectedItem();
+    if (!selected) {
+      return this.renderList(width, height, { title: 'Incident Review Workspace' });
+    }
+    const bundle = this.getBundle(selected.id);
 
     const headerLines: Line[] = [
       buildKeyValueLine(width, [
         { label: 'incidents', value: String(reports.length), valueColor: C.value },
-        { label: 'selected', value: `${this.selectedIndex + 1}/${reports.length}`, valueColor: C.info },
+        { label: 'selected', value: `${this.selectedIndex + 1}/${visible.length}`, valueColor: C.info },
         { label: 'classification', value: selected.classification, valueColor: classificationColor(selected.classification) },
       ], C),
-      buildPanelLine(width, [['  Up/Down move  Home/End jump  selected incident drives the action rail below', C.dim]]),
     ];
 
     const footerLines: Line[] = [];
@@ -134,26 +330,21 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
       ], C));
       footerLines.push(buildPanelLine(width, [
         ['  Related IDs: ', C.label],
-        [`turn=${bundle.evidence.relatedIds.turnId ?? 'n/a'} task=${bundle.evidence.relatedIds.taskId ?? 'n/a'} agent=${bundle.evidence.relatedIds.agentId ?? 'n/a'}`.slice(0, Math.max(0, width - 14)), C.info],
+        [truncateDisplay(`turn=${bundle.evidence.relatedIds.turnId ?? 'n/a'} task=${bundle.evidence.relatedIds.taskId ?? 'n/a'} agent=${bundle.evidence.relatedIds.agentId ?? 'n/a'}`, Math.max(0, width - 14)), C.info],
       ]));
-      if (bundle.evidence.slowPhases.length > 0) {
-        footerLines.push(buildPanelLine(width, [
-          ['  Slow phases: ', C.label],
-          ...buildStatusPill('warn', bundle.evidence.slowPhases.join(', ').slice(0, Math.max(0, width - 15))),
-        ]));
+      if (selected.phaseTimings.length > 0) {
+        footerLines.push(buildPanelLine(width, [['  Phase Timings:', C.label]]));
+        for (const pt of selected.phaseTimings) this._pushPhaseTimingLine(footerLines, pt, width);
       }
-      const rootCause = selected.causalChain.find((entry) => entry.isRootCause);
-      if (rootCause) {
-        footerLines.push(buildPanelLine(width, [
-          ['  Root event: ', C.label],
-          [`${rootCause.sourceEventType} - ${rootCause.description}`.slice(0, Math.max(0, width - 14)), C.dim],
-        ]));
+      if (selected.causalChain.length > 0) {
+        footerLines.push(buildPanelLine(width, [['  Causal Chain:', C.label]]));
+        for (const entry of selected.causalChain) this._pushCausalLine(footerLines, entry, width);
       }
       const denied = selected.permissionEvidence.find((entry) => entry.approved === false);
       if (denied) {
         footerLines.push(buildPanelLine(width, [
           ['  Permission: ', C.label],
-          [`${denied.tool} denied${denied.riskLevel ? ` (${denied.riskLevel})` : ''}${denied.summary ? ` - ${denied.summary}` : ''}`.slice(0, Math.max(0, width - 14)), C.warn],
+          [truncateDisplay(`${denied.tool} denied${denied.riskLevel ? ` (${denied.riskLevel})` : ''}${denied.summary ? ` - ${denied.summary}` : ''}`, Math.max(0, width - 14)), C.warn],
         ]));
       }
       if (bundle.replay.relatedMismatches.length > 0) {
@@ -168,7 +359,7 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
           : `Replay link: ${mismatch.kind}${mismatch.ownerDomain ? `/${mismatch.ownerDomain}` : ''} - ${mismatch.description}`;
         footerLines.push(buildPanelLine(width, [
           ['  ', C.label],
-          ...buildStatusPill('bad', replayDetail.slice(0, Math.max(0, width - 2))),
+          ...buildStatusPill('bad', truncateDisplay(replayDetail, Math.max(0, width - 2))),
         ]));
       } else {
         const ownerBreakdown = Object.entries(bundle.replay.mismatchBreakdown.byOwnerDomain)
@@ -179,19 +370,37 @@ export class IncidentReviewPanel extends ScrollableListPanel<FailureReport> {
         if (ownerBreakdown.length > 0) {
           footerLines.push(buildPanelLine(width, [
             ['  Replay owners: ', C.label],
-            [ownerBreakdown.slice(0, Math.max(0, width - 17)), C.info],
+            [truncateDisplay(ownerBreakdown, Math.max(0, width - 17)), C.info],
           ]));
         }
       }
+      if (selected.jumpLinks.length > 0) {
+        footerLines.push(buildPanelLine(width, [['  Jump Links:', C.label]]));
+        for (const link of selected.jumpLinks) this._pushJumpLinkLine(footerLines, link, width);
+      }
     }
-    footerLines.push(buildPanelLine(width, [['  Action Rail', C.label]]));
-    footerLines.push(buildPanelLine(width, [[`  /incident latest   /incident export ${selected.id}   /recall capture incident ${selected.id}`, C.info]]));
     footerLines.push(buildGuidanceLine(width, '/security', 'open the broader trust and incident posture control room', C));
 
+    const hints = this.filterActive
+      ? [
+          { keys: 'type', label: 'filter incidents' },
+          { keys: 'Enter', label: 'apply' },
+          { keys: 'Esc', label: 'clear' },
+        ]
+      : [
+          { keys: '↑/↓', label: 'select incident' },
+          { keys: 'Home/End', label: 'jump' },
+          { keys: '/', label: 'filter' },
+          { keys: 'x', label: 'export' },
+          { keys: 'c', label: 'capture' },
+          ...(selected.jumpLinks.length > 0 ? [{ keys: 'j', label: 'follow link' }] : []),
+        ];
+
     return this.renderList(width, height, {
       title: 'Incident Review Workspace',
       header: headerLines,
       footer: footerLines,
+      hints,
     });
   }
 }