@pellux/goodvibes-tui 0.21.0 → 0.22.0

package/src/input/settings-modal-reset.ts

@@ -0,0 +1,154 @@
+/**
+ * settings-modal-reset — pure reset helpers for SettingsModal.
+ *
+ * These functions encapsulate the three reset operations:
+ *   - resetSelected: reset the currently selected setting to its schema default
+ *   - initiateResetCategory: arm the category-reset confirmation gate
+ *   - initiateResetAll: arm the reset-all confirmation gate
+ *   - handleResetConfirmKey: route a keypress through the active gate
+ *
+ * Each function takes its dependencies as explicit arguments rather than
+ * accessing class-level state. resetCategoryConfirm and resetAllConfirm
+ * remain public class fields on SettingsModal — the renderer reads them
+ * directly to decide the footer state.
+ */
+
+import type { ConfigKey } from '@pellux/goodvibes-sdk/platform/config';
+import { logger, summarizeError } from '@pellux/goodvibes-sdk/platform/utils';
+import { buildGoodVibesSecretKey, isSecretConfigKey } from '../config/secret-config.ts';
+import type { SettingEntry, SettingsCategory } from './settings-modal-types.ts';
+import type { SettingsSecretsManager } from './settings-modal-secrets.ts';
+
+// ---------------------------------------------------------------------------
+// resetSelected
+// ---------------------------------------------------------------------------
+
+export function resetSelected({
+  editingMode,
+  hasConfigManager,
+  selected,
+  secretsManager,
+  setValue,
+}: {
+  editingMode: boolean;
+  hasConfigManager: boolean;
+  selected: SettingEntry | null;
+  secretsManager: SettingsSecretsManager | null;
+  setValue: (key: ConfigKey, value: unknown) => void;
+}): { key: ConfigKey; value: unknown } | null {
+  if (editingMode || !hasConfigManager) return null;
+  if (!selected) return null;
+  const key = selected.setting.key as ConfigKey;
+  setValue(key, selected.setting.default);
+  if (isSecretConfigKey(key) && secretsManager) {
+    void secretsManager.delete(buildGoodVibesSecretKey(key), { scope: 'user' }).catch((error) => {
+      logger.error('SettingsModal: failed to clear secret while resetting setting', { key, error: summarizeError(error) });
+    });
+  }
+  return { key, value: selected.setting.default };
+}
+
+// ---------------------------------------------------------------------------
+// initiateResetCategory
+// ---------------------------------------------------------------------------
+
+export function initiateResetCategory({
+  hasConfigManager,
+  currentCategory,
+  setResetCategoryConfirm,
+  setResetAllConfirm,
+}: {
+  hasConfigManager: boolean;
+  currentCategory: string;
+  setResetCategoryConfirm: (value: { readonly subject: string } | null) => void;
+  setResetAllConfirm: (value: { readonly subject: 'all' } | null) => void;
+}): void {
+  if (!hasConfigManager) return;
+  setResetCategoryConfirm({ subject: currentCategory });
+  setResetAllConfirm(null);
+}
+
+// ---------------------------------------------------------------------------
+// initiateResetAll
+// ---------------------------------------------------------------------------
+
+export function initiateResetAll({
+  hasConfigManager,
+  setResetCategoryConfirm,
+  setResetAllConfirm,
+}: {
+  hasConfigManager: boolean;
+  setResetCategoryConfirm: (value: { readonly subject: string } | null) => void;
+  setResetAllConfirm: (value: { readonly subject: 'all' } | null) => void;
+}): void {
+  if (!hasConfigManager) return;
+  setResetAllConfirm({ subject: 'all' });
+  setResetCategoryConfirm(null);
+}
+
+// ---------------------------------------------------------------------------
+// handleResetConfirmKey
+// ---------------------------------------------------------------------------
+
+export type ResetConfirmKeyResult =
+  | { result: 'confirmed'; entries: ReadonlyArray<{ key: string; value: unknown }> }
+  | 'cancelled'
+  | 'absorbed'
+  | 'inactive';
+
+export function handleResetConfirmKey({
+  key,
+  resetCategoryConfirm,
+  resetAllConfirm,
+  hasConfigManager,
+  currentItems,
+  groups,
+  setValue,
+  setResetCategoryConfirm,
+  setResetAllConfirm,
+}: {
+  key: string;
+  resetCategoryConfirm: { readonly subject: string } | null;
+  resetAllConfirm: { readonly subject: 'all' } | null;
+  hasConfigManager: boolean;
+  currentItems: () => SettingEntry[];
+  groups: Map<SettingsCategory, SettingEntry[]>;
+  setValue: (key: ConfigKey, value: unknown) => void;
+  setResetCategoryConfirm: (value: { readonly subject: string } | null) => void;
+  setResetAllConfirm: (value: { readonly subject: 'all' } | null) => void;
+}): ResetConfirmKeyResult {
+  const gate = resetCategoryConfirm ?? resetAllConfirm;
+  if (!gate || !hasConfigManager) return 'inactive';
+
+  if (key === 'enter' || key === 'y') {
+    const entries: Array<{ key: string; value: unknown }> = [];
+    if (resetCategoryConfirm) {
+      // Reset all settings in the current category to defaults.
+      const items = currentItems();
+      for (const item of items) {
+        setValue(item.setting.key as ConfigKey, item.setting.default);
+        entries.push({ key: item.setting.key, value: item.setting.default });
+      }
+      setResetCategoryConfirm(null);
+    } else {
+      // Reset ALL settings across all categories to defaults.
+      for (const [, items] of groups) {
+        for (const item of items) {
+          setValue(item.setting.key as ConfigKey, item.setting.default);
+          entries.push({ key: item.setting.key, value: item.setting.default });
+        }
+      }
+      setResetAllConfirm(null);
+    }
+    return { result: 'confirmed', entries };
+  }
+
+  if (key === 'escape' || key === 'n') {
+    setResetCategoryConfirm(null);
+    setResetAllConfirm(null);
+    return 'cancelled';
+  }
+
+  // All other keys are absorbed while the gate is active.
+  return 'absorbed';
+}

package/src/input/settings-modal.ts

@@ -19,7 +19,7 @@ import type { ModelPickerTarget } from './model-picker.ts';
 import type { ConfigManager } from '@pellux/goodvibes-sdk/platform/config';
 import type { SubscriptionManager } from '@pellux/goodvibes-sdk/platform/config';
 import type { ServiceInspectionQuery } from '../runtime/ui-service-queries.ts';
-import { buildGoodVibesSecretKey, isSecretConfigKey } from '../config/secret-config.ts';
+import { isSecretConfigKey } from '../config/secret-config.ts';
 import {
   getNumericAdjustmentMeta,
   modelPickerLaunchForKey,
@@ -32,7 +32,7 @@ import {
 import type { FeatureFlagManager } from '@/runtime/index.ts';
 import type { FlagState } from '@/runtime/index.ts';
 import type { McpRegistry } from '@pellux/goodvibes-sdk/platform/mcp';
-import { logger, summarizeError } from '@pellux/goodvibes-sdk/platform/utils';
+
 import {
   SETTINGS_CATEGORIES,
   SETTINGS_CATEGORY_GROUPS,
@@ -60,6 +60,13 @@ import {
   persistFlagState,
   type SettingAppliedCallback,
 } from './settings-modal-mutations.ts';
+import {
+  resetSelected as _resetSelected,
+  initiateResetCategory as _initiateResetCategory,
+  initiateResetAll as _initiateResetAll,
+  handleResetConfirmKey as _handleResetConfirmKey,
+  type ResetConfirmKeyResult,
+} from './settings-modal-reset.ts';
 
 export interface SettingsModalChange {
   readonly key: ConfigKey;
@@ -124,6 +131,11 @@ export class SettingsModal {
   /** Provider awaiting explicit logout confirmation, if any. */
   public subscriptionLogoutConfirmationTarget: string | null = null;
 
+  /** Pending category-reset confirmation gate, or null when inactive. */
+  public resetCategoryConfirm: { readonly subject: string } | null = null;
+  /** Pending reset-all confirmation gate, or null when inactive. */
+  public resetAllConfirm: { readonly subject: 'all' } | null = null;
+
   /** Settings grouped by category. */
   public groups: Map<SettingsCategory, SettingEntry[]> = new Map();
 
@@ -674,17 +686,47 @@ export class SettingsModal {
   }
 
   resetSelected(): { key: ConfigKey; value: unknown } | null {
-    if (this.editingMode || !this.configManager) return null;
-    const entry = this.getSelected();
-    if (!entry) return null;
-    const key = entry.setting.key as ConfigKey;
-    this._setValue(key, entry.setting.default);
-    if (isSecretConfigKey(key) && this.secretsManager) {
-      void this.secretsManager.delete(buildGoodVibesSecretKey(key), { scope: 'user' }).catch((error) => {
-        logger.error('SettingsModal: failed to clear secret while resetting setting', { key, error: summarizeError(error) });
-      });
-    }
-    return { key, value: entry.setting.default };
+    return _resetSelected({
+      editingMode: this.editingMode,
+      hasConfigManager: this.configManager !== null,
+      selected: this.getSelected(),
+      secretsManager: this.secretsManager,
+      setValue: (key, value) => this._setValue(key, value),
+    });
+  }
+
+  /** Arm a category-reset confirmation gate for the current category. */
+  initiateResetCategory(): void {
+    _initiateResetCategory({
+      hasConfigManager: this.configManager !== null,
+      currentCategory: this.currentCategory,
+      setResetCategoryConfirm: (v) => { this.resetCategoryConfirm = v; },
+      setResetAllConfirm: (v) => { this.resetAllConfirm = v; },
+    });
+  }
+
+  /** Arm a reset-all confirmation gate. */
+  initiateResetAll(): void {
+    _initiateResetAll({
+      hasConfigManager: this.configManager !== null,
+      setResetCategoryConfirm: (v) => { this.resetCategoryConfirm = v; },
+      setResetAllConfirm: (v) => { this.resetAllConfirm = v; },
+    });
+  }
+
+  /** Route a key through the active reset confirm gate. See ResetConfirmKeyResult for the return contract. */
+  handleResetConfirmKey(key: string): ResetConfirmKeyResult {
+    return _handleResetConfirmKey({
+      key,
+      resetCategoryConfirm: this.resetCategoryConfirm,
+      resetAllConfirm: this.resetAllConfirm,
+      hasConfigManager: this.configManager !== null,
+      currentItems: () => this._currentItems(),
+      groups: this.groups,
+      setValue: (k, value) => this._setValue(k, value),
+      setResetCategoryConfirm: (v) => { this.resetCategoryConfirm = v; },
+      setResetAllConfirm: (v) => { this.resetAllConfirm = v; },
+    });
   }
 
   /** Handle a keystroke in edit mode: regular chars appended, Backspace removes last char. */

package/src/main.ts

@@ -33,12 +33,10 @@ import { renderPanelTabBar } from './renderer/panel-tab-bar.ts';
 import { bootstrapRuntime } from './runtime/bootstrap.ts';
 import type { BootstrapContext } from './runtime/bootstrap.ts';
 import type { HITLMode } from '@pellux/goodvibes-sdk/platform/state';
-import type { HookPhase, HookCategory, HookEventPath } from '@pellux/goodvibes-sdk/platform/hooks';
 import {
   checkRecoveryFile,
   deleteRecoveryFile,
   loadRecoveryConversation,
-  persistConversation,
   writeRecoveryFile,
 } from '@/runtime/index.ts';
 import { handleBlockingShellInput, type PendingPermissionState } from './shell/blocking-input.ts';
@@ -57,6 +55,9 @@ import { buildCommandArgsHint } from './input/command-args-hint.ts';
 import { summarizeRunningAgents } from './renderer/process-summary.ts';
 import { formatUserFacingErrorLine } from './core/format-user-error.ts';
 import { wireStreamEventMetrics, type StreamMetrics } from './core/stream-event-wiring.ts';
+import { wireTurnEventHandlers } from './core/turn-event-wiring.ts';
+import { buildContextStatusHint } from './renderer/context-status-hint.ts';
+import { evaluateSessionMaintenance } from './panels/session-maintenance.ts';
 
 const ALT_SCREEN_ENTER = '\x1b[?1049h';
 const ALT_SCREEN_EXIT  = '\x1b[?1049l';
@@ -104,6 +105,7 @@ async function main() {
     permissionPromptRef,
     _writeLastSessionPointer: writeLastSessionPointer,
     systemMessageRouter,
+    setOpenAgentDetail,
   } = ctx;
   const workingDir = ctx.services.workingDirectory;
   const homeDirectory = ctx.services.homeDirectory;
@@ -439,6 +441,7 @@ async function main() {
   input.filePicker.setOnUpdate(() => render());
   input.agentDetailModal.setOnRefresh(() => render());
   input.processModal.setOnRefresh(() => render());
+  setOpenAgentDetail((id) => input.agentDetailModal.open(id));
 
   // Model picker callback is handled in bootstrap.ts — do not duplicate here.
   input.setHistory(inputHistory);
@@ -479,6 +482,17 @@ async function main() {
       hasAttachments: input.getImageAttachments().size > 0,
       turnState: sessionSnapshot.turnState,
     });
+    const maintenanceStatus = evaluateSessionMaintenance({
+      configManager,
+      currentTokens: orchestrator.lastInputTokens,
+      contextWindow: currentModel.contextWindow,
+      sessionMemoryCount: ctx.services.sessionMemoryStore.list().length,
+    });
+    const contextStatusHint = buildContextStatusHint({
+      level: maintenanceStatus.level,
+      autoCompactEnabled: maintenanceStatus.autoCompactEnabled,
+      usagePct: maintenanceStatus.usagePct,
+    });
     const footerLines = buildShellFooter({
       width,
       promptText: promptInfo.visibleLines.join('\n'),
@@ -496,6 +510,7 @@ async function main() {
       workingDir,
       provider: runtime.provider,
       contextWindow: currentModel.contextWindow,
+      contextStatusHint,
       // behavior.autoCompactThreshold is stored as a percent integer (e.g. 80);
       // the meter expects a fraction [0..1]. Clamp to [0,1] to guard nonsense values.
       compactThreshold: Math.min(1, Math.max(0, (configManager.get('behavior.autoCompactThreshold') as number) / 100)),
@@ -674,32 +689,25 @@ async function main() {
     render,
   });
 
-  // --- Streaming speed + tool preview wiring ---
-  const refreshGit = () => gitStatusProvider.refresh().then((info) => { lastGitInfoRef.value = info; render(); }).catch(() => { /* non-fatal */ });
-  // Refresh git status after each turn completes or after tool results arrive
-  unsubs.push(uiServices.events.turns.on('TURN_COMPLETED', () => {
-    // Auto-save after every LLM turn so kills don't lose the session
-    try {
-      const snapshot = conversation.toJSON() as { messages: Array<import('./core/conversation.ts').ConversationMessageSnapshot>; timestamp?: number };
-      const persisted = buildPersistedSessionContext(snapshot.messages, conversation.getTitleSource(), buildSessionContinuityHints());
-      persistConversation(
-        runtime.sessionId,
-        { ...snapshot, ...persisted },
-        runtime.model,
-        runtime.provider,
-        conversation.title || '',
-        { workingDirectory: workingDir, homeDirectory, sessionManager: ctx.services.sessionManager },
-      );
-      hookDispatcher.fire({ path: 'Lifecycle:session:save' as HookEventPath, phase: 'Lifecycle' as HookPhase, category: 'session' as HookCategory, specific: 'save', sessionId: runtime.sessionId, timestamp: Date.now(), payload: { sessionId: runtime.sessionId } }).catch((err: unknown) => logger.debug('hook fire error', { error: summarizeError(err) }));
-    } catch (e) { logger.debug('auto-save on turn:complete failed', { error: summarizeError(e) }); }
-    refreshGit();
-  }));
-  unsubs.push(uiServices.events.tools.on('TOOL_SUCCEEDED', () => {
-    refreshGit();
-  }));
-  unsubs.push(uiServices.events.tools.on('TOOL_FAILED', () => {
-    refreshGit();
-  }));
+  // --- Turn-completed / git-refresh event wiring ---
+  const { refreshGit, unsubs: turnUnsubs } = wireTurnEventHandlers({
+    events: uiServices.events,
+    conversation,
+    runtime,
+    orchestrator,
+    configManager,
+    providerRegistry,
+    systemMessageRouter,
+    hookDispatcher,
+    workingDir,
+    homeDirectory,
+    sessionManager: ctx.services.sessionManager,
+    gitStatusProvider,
+    lastGitInfoRef,
+    buildSessionContinuityHints,
+    render,
+  });
+  unsubs.push(...turnUnsubs);
 
   // --- Stream metrics + tool-timer event wiring ---
   const streamUnsubs = wireStreamEventMetrics({

package/src/panels/agent-inspector-panel.ts

@@ -21,6 +21,10 @@ import {
   resolveScrollablePanelSection,
   DEFAULT_PANEL_PALETTE,
 } from './polish.ts';
+import {
+  type ConfirmState,
+  handleConfirmInput,
+} from './confirm-state.ts';
 import { truncateDisplay } from '../utils/terminal-width.ts';
 import { summarizeError } from '@pellux/goodvibes-sdk/platform/utils';
 import {
@@ -32,6 +36,8 @@ import {
   formatAgentDuration as formatMs,
   formatAgentTime as shortTime,
   jsonlToTimeline,
+  AGENT_TERMINAL_STATUSES,
+  AGENT_STALL_THRESHOLD_MS,
 } from './agent-inspector-shared.ts';
 
 // ---------------------------------------------------------------------------
@@ -77,10 +83,14 @@ const COLOR = {
 // AgentInspectorPanel
 // ---------------------------------------------------------------------------
 
+// AGENT_TERMINAL_STATUSES and AGENT_STALL_THRESHOLD_MS imported from agent-inspector-shared.ts
+
 export interface AgentInspectorPanelDeps {
-  readonly agentManager: Pick<AgentManager, 'list' | 'getStatus'>;
+  readonly agentManager: Pick<AgentManager, 'list' | 'getStatus' | 'cancel'>;
   readonly agentMessageBus: Pick<AgentMessageBus, 'getMessages'>;
   readonly workingDirectory: string;
+  /** Cancel the agent by id. Uses the same orphan-free path as WRFC. Returns true if cancelled. */
+  readonly cancelAgent: (agentId: string) => boolean;
 }
 
 export class AgentInspectorPanel extends BasePanel {
@@ -102,6 +112,9 @@ export class AgentInspectorPanel extends BasePanel {
   // Row cache — cleared on markDirty(), computed once per render cycle
   private _cachedRows: DisplayRow[] | null = null;
 
+  /** Pending cancel confirmation — subject is the agent id to cancel. */
+  private confirmCancel: ConfirmState<string> | null = null;
+
   constructor(private readonly deps: AgentInspectorPanelDeps) {
     super('inspector', 'Inspector', 'I', 'agent');
   }
@@ -157,13 +170,36 @@ export class AgentInspectorPanel extends BasePanel {
   // -------------------------------------------------------------------------
 
   handleInput(key: string): boolean {
+    // Confirm-cancel flow takes priority — same contract as WRFC panel.
+    if (this.confirmCancel) {
+      const result = handleConfirmInput(this.confirmCancel, key);
+      if (result === 'confirmed') {
+        const rec = this.selectedAgentId
+          ? this.deps.agentManager.getStatus(this.selectedAgentId)
+          : null;
+        if (rec && !AGENT_TERMINAL_STATUSES.has(rec.status)) {
+          this.deps.cancelAgent(rec.id);
+        }
+        this.confirmCancel = null;
+        this.markDirty();
+        return true;
+      }
+      if (result === 'cancelled') {
+        this.confirmCancel = null;
+        this.markDirty();
+      }
+      // absorbed: confirm stays pending
+      return true;
+    }
+
     switch (key) {
-      case 'up':       this._moveCursor(-1); return true;
-      case 'down':     this._moveCursor(1);  return true;
-      case 'pageup':   this._scroll(-10);    return true;
-      case 'pagedown': this._scroll(10);     return true;
-      case 'return':   this._toggleExpand(); return true;
-      case 'tab':      this._nextAgent();    return true;
+      case 'up':       this._moveCursor(-1);         return true;
+      case 'down':     this._moveCursor(1);           return true;
+      case 'pageup':   this._scroll(-10);             return true;
+      case 'pagedown': this._scroll(10);              return true;
+      case 'return':   this._toggleExpand();          return true;
+      case 'tab':      this._nextAgent();             return true;
+      case 'c':        this._beginCancelConfirm();    return true;
       default:         return false;
     }
   }
@@ -217,6 +253,11 @@ export class AgentInspectorPanel extends BasePanel {
     }
 
     summaryLines.push(this._renderAgentInfoSummary(width, rec));
+    const now = Date.now();
+    const isStalled = this._isAgentStalled(rec, now);
+    if (isStalled) {
+      summaryLines.push(buildPanelLine(width, [['  STALLED', '#f59e0b'], [' — no activity for 5+ minutes', DEFAULT_PANEL_PALETTE.dim]]));
+    }
     const allRows = this._getCachedRows();
     if (allRows.length === 0) {
       return buildPanelWorkspace(width, height, {
@@ -243,13 +284,42 @@ export class AgentInspectorPanel extends BasePanel {
     }
 
     this.cursorIndex = Math.max(0, Math.min(this.cursorIndex, allRows.length - 1));
+    const selectedRec = this.selectedAgentId
+      ? this.deps.agentManager.getStatus(this.selectedAgentId)
+      : null;
+    const cancellable = selectedRec && !AGENT_TERMINAL_STATUSES.has(selectedRec.status);
     const summarySection = { title: 'Summary', lines: summaryLines } as const;
     const agentsSection = { title: 'Agents', lines: [selectorLine] } as const;
+
+    // Confirm-cancel overlay section.
+    const confirmSection = this.confirmCancel ? {
+      title: 'Confirm Cancel',
+      lines: [
+        buildPanelLine(width, [
+          [' Cancel agent "', DEFAULT_PANEL_PALETTE.warn],
+          [this.confirmCancel.label, DEFAULT_PANEL_PALETTE.value],
+          ['"?', DEFAULT_PANEL_PALETTE.warn],
+        ]),
+        buildPanelLine(width, [
+          [' y', DEFAULT_PANEL_PALETTE.info], ['  confirm', DEFAULT_PANEL_PALETTE.dim],
+          ['   Enter', DEFAULT_PANEL_PALETTE.info], ['  confirm', DEFAULT_PANEL_PALETTE.dim],
+          ['   n / Esc', DEFAULT_PANEL_PALETTE.info], ['  cancel', DEFAULT_PANEL_PALETTE.dim],
+        ]),
+      ],
+    } : null;
+
+    const cancelHintFg = cancellable ? DEFAULT_PANEL_PALETTE.info : DEFAULT_PANEL_PALETTE.dim;
+    const footerLine = buildPanelLine(width, [
+      [` L${this.cursorIndex + 1}/${allRows.length}`, DEFAULT_PANEL_PALETTE.dim],
+      ['   Tab', DEFAULT_PANEL_PALETTE.info], [' cycle agents', DEFAULT_PANEL_PALETTE.dim],
+      ['   Up/Down', DEFAULT_PANEL_PALETTE.info], [' navigate', DEFAULT_PANEL_PALETTE.dim],
+      ['   Enter', DEFAULT_PANEL_PALETTE.info], [' expand', DEFAULT_PANEL_PALETTE.dim],
+      ['   c', cancelHintFg], [cancellable ? ' cancel' : ' cancel (n/a)', DEFAULT_PANEL_PALETTE.dim],
+    ]);
+
     const timelineSection = resolveScrollablePanelSection(width, height, {
       intro: 'Inspect a selected agent timeline, tool activity, expanded details, and live/historical message flow.',
-      footerLines: [
-        buildPanelLine(width, [[` L${this.cursorIndex + 1}/${allRows.length}`, DEFAULT_PANEL_PALETTE.dim], ['   Tab', DEFAULT_PANEL_PALETTE.info], [' cycle agents', DEFAULT_PANEL_PALETTE.dim], ['   Up/Down', DEFAULT_PANEL_PALETTE.info], [' navigate', DEFAULT_PANEL_PALETTE.dim], ['   Enter', DEFAULT_PANEL_PALETTE.info], [' expand', DEFAULT_PANEL_PALETTE.dim]]),
-      ],
+      footerLines: [footerLine],
       palette: DEFAULT_PANEL_PALETTE,
       beforeSections: [summarySection, agentsSection],
       section: {
@@ -259,20 +329,22 @@ export class AgentInspectorPanel extends BasePanel {
         scrollOffset: this.scrollOffset,
         minRows: 8,
       },
+      afterSections: confirmSection ? [confirmSection] : undefined,
     });
     this.scrollOffset = timelineSection.scrollOffset;
 
+    const sections = [
+      summarySection,
+      agentsSection,
+      timelineSection.section,
+      ...(confirmSection ? [confirmSection] : []),
+    ];
+
     return buildPanelWorkspace(width, height, {
       title: ` Inspector [${agents.length} agent${agents.length !== 1 ? 's' : ''}]`,
       intro: 'Inspect a selected agent timeline, tool activity, expanded details, and live/historical message flow.',
-      sections: [
-        summarySection,
-        agentsSection,
-        timelineSection.section,
-      ],
-      footerLines: [
-        buildPanelLine(width, [[` L${this.cursorIndex + 1}/${allRows.length}`, DEFAULT_PANEL_PALETTE.dim], ['   Tab', DEFAULT_PANEL_PALETTE.info], [' cycle agents', DEFAULT_PANEL_PALETTE.dim], ['   Up/Down', DEFAULT_PANEL_PALETTE.info], [' navigate', DEFAULT_PANEL_PALETTE.dim], ['   Enter', DEFAULT_PANEL_PALETTE.info], [' expand', DEFAULT_PANEL_PALETTE.dim]]),
-      ],
+      sections,
+      footerLines: [footerLine],
       palette: DEFAULT_PANEL_PALETTE,
     });
   }
@@ -517,4 +589,34 @@ export class AgentInspectorPanel extends BasePanel {
       this.inspectAgent(next.id);
     }
   }
+
+  // -------------------------------------------------------------------------
+  // Private — cancel + stall
+  // -------------------------------------------------------------------------
+
+  /** Initiate cancel-confirm flow for the selected agent (noop if terminal or none selected). */
+  private _beginCancelConfirm(): void {
+    if (!this.selectedAgentId) return;
+    const rec = this.deps.agentManager.getStatus(this.selectedAgentId);
+    if (!rec || AGENT_TERMINAL_STATUSES.has(rec.status)) return;
+    const label = rec.task.split('\n')[0]?.slice(0, 40) ?? rec.id.slice(-8);
+    this.confirmCancel = { subject: rec.id, label };
+    this.markDirty();
+  }
+
+  /** Returns whether an agent is considered stalled (non-terminal, running past threshold). */
+  private _isAgentStalled(rec: AgentRecord, now: number): boolean {
+    if (AGENT_TERMINAL_STATUSES.has(rec.status)) return false;
+    return (now - rec.startedAt) >= AGENT_STALL_THRESHOLD_MS;
+  }
+
+  /**
+   * Count of all tracked agents that are stalled (non-terminal, no activity
+   * for AGENT_STALL_THRESHOLD_MS). Exposed so callers can aggregate a
+   * stalledAgentCount for cockpit / roster read-models.
+   */
+  getStalledAgentCount(): number {
+    const now = Date.now();
+    return this.deps.agentManager.list().filter(rec => this._isAgentStalled(rec, now)).length;
+  }
 }

package/src/panels/agent-inspector-shared.ts

@@ -1,5 +1,34 @@
 export type AgentInspectorEntryKind = 'user' | 'assistant' | 'tool_call' | 'tool_result' | 'session' | 'error';
 
+// ---------------------------------------------------------------------------
+// Shared agent status / stall constants
+// Used by AgentInspectorPanel, AgentDetailModal, and cockpit read-model consumers.
+// ---------------------------------------------------------------------------
+
+/** Terminal statuses — cancel not offered; stall check skipped. */
+export const AGENT_TERMINAL_STATUSES = new Set(['completed', 'failed', 'cancelled']);
+
+/** Agents in a non-terminal state for longer than this are considered STALLED. */
+export const AGENT_STALL_THRESHOLD_MS = 5 * 60 * 1000;
+
+/**
+ * Count stalled agents from a raw record list.
+ * An agent is stalled when it is non-terminal and has been running for at
+ * least AGENT_STALL_THRESHOLD_MS without completing.
+ *
+ * Extracted as a standalone export so read-models and panels can share the
+ * canonical stall-count logic (TASK-046).
+ */
+export function countStalledAgents(
+  records: ReadonlyArray<{ status: string; startedAt: number }>,
+  now: number = Date.now(),
+): number {
+  return records.filter(
+    (r) => !AGENT_TERMINAL_STATUSES.has(r.status) && (now - r.startedAt) >= AGENT_STALL_THRESHOLD_MS,
+  ).length;
+}
+
+
 export interface AgentTimelineEntry {
   kind: AgentInspectorEntryKind;
   timestamp: number;

package/src/panels/builtin/development.ts

@@ -51,6 +51,7 @@ export function registerDevelopmentPanels(manager: PanelManager, deps: ResolvedB
         agentManager: ui.agents.agentManager,
         agentMessageBus: ui.agents.agentMessageBus,
         workingDirectory: ui.environment.workingDirectory,
+        cancelAgent: (agentId: string) => ui.agents.agentManager.cancel(agentId),
       });
     },
   });

package/src/panels/builtin/knowledge.ts

@@ -1,26 +1,27 @@
 import type { PanelManager } from '../panel-manager.ts';
 import { MemoryPanel } from '../memory-panel.ts';
-import { KnowledgePanel } from '../knowledge-panel.ts';
+import { KnowledgeGraphPanel } from '../knowledge-graph-panel.ts';
 import type { ResolvedBuiltinPanelDeps } from './shared.ts';
 
 export function registerKnowledgePanels(manager: PanelManager, deps: ResolvedBuiltinPanelDeps): void {
-  if (!deps.memoryRegistry) return;
-
-  const { memoryRegistry } = deps;
+  // KnowledgeGraphPanel is a no-arg panel — always register it regardless of memoryRegistry.
   manager.registerType({
     id: 'knowledge',
     name: 'Knowledge',
     icon: 'K',
     category: 'agent',
     description: 'Structured project knowledge: risks, runbooks, architecture notes, incidents, and durable facts',
-    factory: () => new KnowledgePanel(memoryRegistry),
-  });
-  manager.registerType({
-    id: 'memory',
-    name: 'Memory',
-    icon: 'M',
-    category: 'agent',
-    description: 'Project memory: decisions, constraints, incidents, and patterns with provenance links',
-    factory: () => new MemoryPanel(memoryRegistry),
+    factory: () => new KnowledgeGraphPanel(),
   });
+  if (deps.memoryRegistry) {
+    const { memoryRegistry } = deps;
+    manager.registerType({
+      id: 'memory',
+      name: 'Memory',
+      icon: 'M',
+      category: 'agent',
+      description: 'Project memory: decisions, constraints, incidents, and patterns with provenance links',
+      factory: () => new MemoryPanel(memoryRegistry),
+    });
+  }
 }