@pellux/goodvibes-tui 0.27.0 → 0.29.0

package/src/panels/session-maintenance.ts

@@ -1,13 +1,11 @@
 /**
- * Session maintenance types and local evaluator.
+ * Session maintenance types.
  *
  * The canonical evaluator is the SDK version exported from @/runtime/index.ts
  * (via operations.evaluateSessionMaintenance), which reads from configManager.
- *
- * This module provides:
- *  - The shared type surface used across TUI panels.
- *  - A thin local evaluator kept in sync with the SDK signature so panel code
- *    that passes configManager has a coherent call site.
+ * Import the evaluator from there — this module provides only the shared
+ * Panel* type surface used across TUI panels and tests; it intentionally does
+ * not re-implement the evaluator.
  */
 import type { ConfigManager } from '@pellux/goodvibes-sdk/platform/config';
 
@@ -58,119 +56,3 @@ export interface PanelSessionMaintenanceStatus {
   readonly lastCompactedAt?: number;
   readonly compactRecommended: boolean;
 }
-
-/**
- * Evaluate session maintenance from config-driven thresholds.
- *
- * behavior.autoCompactThreshold (percent integer, SDK schema range [10, 100], default 80):
- *  - [10, 100] → threshold at that percent; autoCompactEnabled = true.
- *  - 0 (defensive fallback for null/missing config only; not a valid schema value).
- *
- * NOTE: The SDK's evaluateSessionMaintenance (from @/runtime/index.ts) is the
- * canonical implementation used in production.  This local version exists so
- * panel tests can import types without crossing the SDK boundary.
- */
-export function evaluateSessionMaintenance(input: PanelSessionMaintenanceInput): PanelSessionMaintenanceStatus {
-  const guidanceMode: PanelGuidanceMode = (input.configManager.get('behavior.guidanceMode') as PanelGuidanceMode | undefined) ?? 'minimal';
-  const rawThreshold = Number(input.configManager.get('behavior.autoCompactThreshold') ?? 0);
-  const thresholdPct = Math.max(0, Number.isFinite(rawThreshold) ? rawThreshold : 0);
-  const autoCompactEnabled = thresholdPct > 0;
-
-  const usagePct = input.contextWindow > 0 ? Math.min(100, Math.round((Math.max(0, input.currentTokens) / input.contextWindow) * 100)) : 0;
-  const remainingTokens = Math.max(0, input.contextWindow - input.currentTokens);
-  const sessionMemoryCount = Math.max(0, input.sessionMemoryCount ?? 0);
-  const compactionCount = Math.max(0, input.session?.lineage?.filter((entry) => entry.branchReason === 'compaction').length ?? 0);
-  const lastCompactedAt = input.session?.lastCompactedAt;
-  const messageCount = Math.max(0, input.messageCount ?? 0);
-  const staleByMessageGrowth = (input.session?.compactionMessageCount ?? 0) > 0
-    ? messageCount - (input.session?.compactionMessageCount ?? 0) >= 12
-    : messageCount >= 24;
-
-  if (input.contextWindow <= 0) {
-    return {
-      level: 'unknown',
-      summary: 'Context window unavailable.',
-      reasons: ['Current model does not expose a known context limit yet.'],
-      nextSteps: ['/provider', '/context'],
-      guidanceMode,
-      usagePct,
-      remainingTokens,
-      thresholdPct,
-      autoCompactEnabled,
-      sessionMemoryCount,
-      compactionCount,
-      lastCompactedAt,
-      compactRecommended: false,
-    };
-  }
-
-  if (input.session?.compactionState === 'failed') {
-    return {
-      level: 'needs-repair',
-      summary: 'Compaction needs operator repair.',
-      reasons: ['Compaction failed and the session may need manual recovery.'],
-      nextSteps: ['/compact', '/health review'],
-      guidanceMode,
-      usagePct,
-      remainingTokens,
-      thresholdPct,
-      autoCompactEnabled,
-      sessionMemoryCount,
-      compactionCount,
-      lastCompactedAt,
-      compactRecommended: true,
-    };
-  }
-
-  const reasons: string[] = [];
-  const nextSteps: string[] = [];
-  let summary = 'Session maintenance is stable.';
-  let compactRecommended = false;
-  let level: PanelSessionMaintenanceLevel = 'stable';
-
-  const atThreshold = autoCompactEnabled ? usagePct >= thresholdPct : usagePct >= 80;
-  if (atThreshold || remainingTokens <= 15_000) {
-    level = 'suggest-compact';
-    summary = `Compact now to recover context headroom (${usagePct}% used).`;
-    reasons.push(`Context pressure is high at ${usagePct}% usage.`);
-    nextSteps.push('/compact', '/panel tokens');
-    compactRecommended = true;
-  } else if (usagePct >= Math.max(70, autoCompactEnabled ? thresholdPct - 10 : 70) || staleByMessageGrowth) {
-    level = 'watch';
-    summary = staleByMessageGrowth
-      ? `Conversation has grown ${messageCount.toLocaleString()} messages since the last maintenance checkpoint.`
-      : `Watch context growth (${usagePct}% used, threshold ${thresholdPct}%).`;
-    reasons.push(staleByMessageGrowth
-      ? `Conversation has grown ${messageCount.toLocaleString()} messages since the last maintenance checkpoint.`
-      : `Context usage is climbing toward the ${thresholdPct > 0 ? `${thresholdPct}% auto-compact threshold` : 'maintenance band'}.`);
-    nextSteps.push('/panel tokens');
-  } else {
-    reasons.push('Context pressure is currently within the stable operating band.');
-  }
-
-  if (sessionMemoryCount > 0) {
-    reasons.push(`${sessionMemoryCount} pinned session memor${sessionMemoryCount === 1 ? 'y is' : 'ies are'} preserved during compaction.`);
-  }
-  if (compactionCount > 0) {
-    reasons.push(`Last compaction ran ${lastCompactedAt ? new Date(lastCompactedAt).toISOString() : 'recently'}.`);
-  }
-  if (!autoCompactEnabled) {
-    reasons.push('Auto-compaction is disabled; maintenance stays fully manual.');
-  }
-
-  return {
-    level,
-    summary,
-    reasons,
-    nextSteps,
-    guidanceMode,
-    usagePct,
-    remainingTokens,
-    thresholdPct,
-    autoCompactEnabled,
-    sessionMemoryCount,
-    compactionCount,
-    lastCompactedAt,
-    compactRecommended,
-  };
-}

package/src/panels/settings-sync-panel.ts

@@ -1,33 +1,68 @@
+import { logger } from '@pellux/goodvibes-sdk/platform/utils';
 import type { Line } from '../types/grid.ts';
+import { createEmptyLine } from '../types/grid.ts';
+import { fitDisplay, truncateDisplay } from '../utils/terminal-width.ts';
 import { ScrollableListPanel } from './scrollable-list-panel.ts';
 import {
   buildDetailBlock,
-  buildGuidanceLine,
+  buildKeyboardHints,
   buildPanelListRow,
   buildPanelLine,
+  buildPanelWorkspace,
   buildStatusPill,
   buildSummaryBlock,
   DEFAULT_PANEL_PALETTE,
+  resolveScrollablePanelSection,
   type PanelPalette,
+  type PanelWorkspaceSection,
 } from './polish.ts';
 import { getSettingsControlPlaneSnapshot } from '@/runtime/index.ts';
 import type { ConfigManager } from '../config/index.ts';
+import type { PanelIntegrationContext } from './types.ts';
 
-const C = {
-  ...DEFAULT_PANEL_PALETTE,
-  dim: '#475569',
-  info: '#38bdf8',
-  ok: '#22c55e',
-  warn: '#eab308',
-  error: '#ef4444',
-} as const;
+// Base chrome only — state colors and text tokens come straight from
+// DEFAULT_PANEL_PALETTE (WO-002).
+const C = DEFAULT_PANEL_PALETTE;
 
-type ResolvedEntry = ReturnType<typeof getSettingsControlPlaneSnapshot>['resolvedEntries'][number];
+type SettingsSnapshot = ReturnType<typeof getSettingsControlPlaneSnapshot>;
+type ResolvedEntry = SettingsSnapshot['resolvedEntries'][number];
+
+// Tab-toggled browse modes (RemotePanel pattern): 'keys' is the primary
+// selectable list (kept at its own scroll viewport); the rest were
+// previously dumped unconditionally into the header, squeezing the key
+// list out of view.
+const BROWSE_MODES = ['keys', 'events', 'locks', 'failures', 'conflicts', 'rollback'] as const;
+type BrowseMode = typeof BROWSE_MODES[number];
+
+interface BrowseModeContent {
+  readonly title: string;
+  readonly rows: Line[];
+  readonly emptyMessage: string;
+}
 
 export class SettingsSyncPanel extends ScrollableListPanel<ResolvedEntry> {
+  private browseMode: BrowseMode = 'keys';
+  private browseIndex = 0;
+  private browseScrollOffset = 0;
+
+  // Inline local/synced picker for a conflicted entry (Enter on the keys
+  // list). Resolved via handlePanelIntegrationAction, the only place
+  // executeCommand is available.
+  private _resolvePrompt: { readonly key: string } | null = null;
+  private _pendingResolve: { readonly key: string; readonly choice: 'local' | 'synced' } | null = null;
+  private _pendingManagedReview = false;
+
   public constructor(private readonly configManager: ConfigManager) {
-    super('settings-sync', 'Settings Sync', 'S', 'monitoring');
+    super('settings-sync', 'Settings Sync', '▱', 'security-policy');
     this.showSelectionGutter = true; // I5: non-color selection affordance
+    this.filterEnabled = true;
+    this.filterLabel = 'Filter settings';
+  }
+
+  protected override filterMatches(entry: ResolvedEntry, q: string): boolean {
+    return entry.key.toLowerCase().includes(q)
+      || String(entry.effectiveSource).toLowerCase().includes(q)
+      || String(entry.effectiveValue).toLowerCase().includes(q);
   }
 
   protected override getPalette(): PanelPalette {
@@ -40,9 +75,9 @@ export class SettingsSyncPanel extends ScrollableListPanel<ResolvedEntry> {
 
   protected renderItem(entry: ResolvedEntry, _index: number, selected: boolean, width: number): Line {
     return buildPanelListRow(width, [
-      { text: entry.key.padEnd(32), fg: C.value },
-      { text: ` ${entry.effectiveSource}`.padEnd(11), fg: entry.effectiveSource === 'managed' ? C.warn : entry.effectiveSource === 'synced' ? C.ok : entry.effectiveSource === 'local' ? C.info : C.dim },
-      { text: `${String(entry.effectiveValue)}`.slice(0, Math.max(0, width - 47)), fg: entry.locked ? C.warn : C.dim },
+      { text: fitDisplay(entry.key, 32).padEnd(32), fg: C.value },
+      { text: ` ${entry.effectiveSource}`.padEnd(11), fg: entry.effectiveSource === 'managed' ? C.warn : entry.effectiveSource === 'synced' ? C.good : entry.effectiveSource === 'local' ? C.info : C.dim },
+      { text: truncateDisplay(`${String(entry.effectiveValue)}`, Math.max(0, width - 47)), fg: entry.conflict ? C.bad : entry.locked ? C.warn : C.dim },
     ], C, { selected });
   }
 
@@ -50,71 +85,314 @@ export class SettingsSyncPanel extends ScrollableListPanel<ResolvedEntry> {
     return ' No resolved settings entries.';
   }
 
-  public render(width: number, height: number): Line[] {
+  /** Enter on a conflicted entry opens the inline local/synced picker. */
+  protected override onSelect(entry: ResolvedEntry): void {
+    if (!entry.conflict) return;
+    this._resolvePrompt = { key: entry.key };
+    this.needsRender = true;
+  }
+
+  public override handleInput(key: string): boolean {
+    if (this.lastError !== null) this.clearError();
+
+    if (this._resolvePrompt) {
+      if (key === 'l') {
+        this._pendingResolve = { key: this._resolvePrompt.key, choice: 'local' };
+        this._resolvePrompt = null;
+        this.needsRender = true;
+        return true;
+      }
+      if (key === 's') {
+        this._pendingResolve = { key: this._resolvePrompt.key, choice: 'synced' };
+        this._resolvePrompt = null;
+        this.needsRender = true;
+        return true;
+      }
+      if (key === 'escape' || key === 'n') {
+        this._resolvePrompt = null;
+        this.needsRender = true;
+        return true;
+      }
+      return true; // absorbed — keep the picker pending
+    }
+
+    // The inline `/`-filter capture must win over browse-mode/managed-review
+    // keys while it is actively collecting a query (e.g. typing "m").
+    if (this.filterActive) {
+      return super.handleInput(key);
+    }
+
+    if (key === 'tab') {
+      const idx = BROWSE_MODES.indexOf(this.browseMode);
+      this.browseMode = BROWSE_MODES[(idx + 1) % BROWSE_MODES.length]!;
+      this.browseIndex = 0;
+      this.browseScrollOffset = 0;
+      this.needsRender = true;
+      return true;
+    }
+
+    if (key === 'm') {
+      const snapshot = getSettingsControlPlaneSnapshot(this.configManager);
+      if (snapshot.stagedManagedBundle) {
+        this._pendingManagedReview = true;
+        return true;
+      }
+      return false;
+    }
+
+    if (this.browseMode !== 'keys') {
+      return this._handleBrowseInput(key);
+    }
+
+    return super.handleInput(key);
+  }
+
+  public handlePanelIntegrationAction(_key: string, ctx: PanelIntegrationContext): boolean {
+    if (this._pendingResolve) {
+      const { key, choice } = this._pendingResolve;
+      this._pendingResolve = null;
+      void ctx.executeCommand?.('settings-sync', ['resolve', key, choice]).catch((err) => {
+        logger.debug('settings-sync resolve dispatch failed', { err });
+      });
+      return true;
+    }
+    if (this._pendingManagedReview) {
+      this._pendingManagedReview = false;
+      void ctx.executeCommand?.('managed', ['review']).catch((err) => {
+        logger.debug('managed review dispatch failed', { err });
+      });
+      return true;
+    }
+    return false;
+  }
+
+  private _browseItemCount(): number {
     const snapshot = getSettingsControlPlaneSnapshot(this.configManager);
+    switch (this.browseMode) {
+      case 'events': return snapshot.recentEvents.length;
+      case 'locks': return snapshot.managedLocks.length;
+      case 'failures': return snapshot.recentFailures.length;
+      case 'conflicts': return snapshot.conflicts.length;
+      case 'rollback': return snapshot.rollbackHistory.length;
+      default: return 0;
+    }
+  }
 
-    const postureLines: Line[] = [
-      buildPanelLine(width, [[' resolved keys ', C.label], [String(snapshot.resolvedEntries.length), C.value], ['  conflicts ', C.label], ...buildStatusPill(snapshot.conflicts.length > 0 ? 'bad' : 'good', String(snapshot.conflicts.length)), ['  failures ', C.label], ...buildStatusPill(snapshot.recentFailures.length > 0 ? 'warn' : 'good', String(snapshot.recentFailures.length))]),
-      buildPanelLine(width, [[' managed locks ', C.label], [String(snapshot.managedLockCount), snapshot.managedLockCount > 0 ? C.warn : C.dim], ['  staged bundle ', C.label], [snapshot.stagedManagedBundle ? snapshot.stagedManagedBundle.profileName : 'none', snapshot.stagedManagedBundle ? C.info : C.dim]]),
-      buildGuidanceLine(width, '/settings-sync conflicts', 'review conflicting synced values before they silently shape effective configuration', C),
-      buildGuidanceLine(width, '/managed review', 'inspect staged managed changes, risk posture, and rollback records', C),
+  private _handleBrowseInput(key: string): boolean {
+    const count = this._browseItemCount();
+    if (count === 0) return false;
+    switch (key) {
+      case 'up':
+      case 'k':
+        this.browseIndex = Math.max(0, this.browseIndex - 1);
+        this.needsRender = true;
+        return true;
+      case 'down':
+      case 'j':
+        this.browseIndex = Math.min(count - 1, this.browseIndex + 1);
+        this.needsRender = true;
+        return true;
+      case 'pageup':
+        this.browseIndex = Math.max(0, this.browseIndex - this.getPageSize());
+        this.needsRender = true;
+        return true;
+      case 'pagedown':
+        this.browseIndex = Math.min(count - 1, this.browseIndex + this.getPageSize());
+        this.needsRender = true;
+        return true;
+      case 'home':
+      case 'g':
+        this.browseIndex = 0;
+        this.needsRender = true;
+        return true;
+      case 'end':
+      case 'G':
+        this.browseIndex = count - 1;
+        this.needsRender = true;
+        return true;
+      default:
+        return false;
+    }
+  }
+
+  /** ≤5 fixed rows total (1 summary title + 4 rows), shared by every mode. */
+  private _buildPostureHeader(width: number, snapshot: SettingsSnapshot): Line[] {
+    const rows: Line[] = [
+      buildPanelLine(width, [
+        [' resolved keys ', C.label], [String(snapshot.resolvedEntries.length), C.value],
+        ['  conflicts ', C.label], ...buildStatusPill(snapshot.conflicts.length > 0 ? 'bad' : 'good', String(snapshot.conflicts.length)),
+        ['  failures ', C.label], ...buildStatusPill(snapshot.recentFailures.length > 0 ? 'warn' : 'good', String(snapshot.recentFailures.length)),
+      ]),
+      buildPanelLine(width, [
+        [' managed locks ', C.label], [String(snapshot.managedLockCount), snapshot.managedLockCount > 0 ? C.warn : C.dim],
+        ['  staged bundle ', C.label], [snapshot.stagedManagedBundle ? snapshot.stagedManagedBundle.profileName : 'none', snapshot.stagedManagedBundle ? C.info : C.dim],
+      ]),
+      buildPanelLine(width, [
+        [' effective local ', C.label], [String(snapshot.resolvedCounts.local), C.info],
+        ['  synced ', C.label], [String(snapshot.resolvedCounts.synced), snapshot.resolvedCounts.synced > 0 ? C.good : C.dim],
+        ['  managed ', C.label], [String(snapshot.resolvedCounts.managed), snapshot.resolvedCounts.managed > 0 ? C.warn : C.dim],
+      ]),
+      buildPanelLine(width, [
+        [' last sync ', C.label], [snapshot.lastSync ? `${snapshot.lastSync.surface}/${snapshot.lastSync.direction}` : 'none', snapshot.lastSync ? C.good : C.dim],
+        ['  mode ', C.label], [this.browseMode, C.info],
+      ]),
     ];
+    return buildSummaryBlock(width, 'Settings posture', rows, C);
+  }
 
-    const headerLines: Line[] = [
-      ...buildSummaryBlock(width, 'Settings posture', postureLines, C),
-      buildPanelLine(width, [[' local typed config ', C.label], [String(snapshot.liveKeyCount), C.value], ['  saved profiles ', C.label], [String(snapshot.profileCount), C.info], ['  managed locks ', C.label], [String(snapshot.managedLockCount), snapshot.managedLockCount > 0 ? C.warn : C.dim]]),
-      buildPanelLine(width, [[' effective local ', C.label], [String(snapshot.resolvedCounts.local), C.info], ['  synced ', C.label], [String(snapshot.resolvedCounts.synced), snapshot.resolvedCounts.synced > 0 ? C.ok : C.dim], ['  managed ', C.label], [String(snapshot.resolvedCounts.managed), snapshot.resolvedCounts.managed > 0 ? C.warn : C.dim]]),
-      buildPanelLine(width, [[' last sync ', C.label], [snapshot.lastSync ? `${snapshot.lastSync.surface}/${snapshot.lastSync.direction}` : 'none', snapshot.lastSync ? C.ok : C.dim], ['  when ', C.label], [snapshot.lastSync ? new Date(snapshot.lastSync.timestamp).toLocaleString() : 'n/a', C.dim]]),
-      // Staged Bundle
-      ...(snapshot.stagedManagedBundle
-        ? [
-            buildPanelLine(width, [[' profile ', C.label], [snapshot.stagedManagedBundle.profileName, C.value], ['  risk ', C.label], [snapshot.stagedManagedBundle.risk, snapshot.stagedManagedBundle.risk === 'high' ? C.error : snapshot.stagedManagedBundle.risk === 'medium' ? C.warn : C.ok], ['  changes ', C.label], [String(snapshot.stagedManagedBundle.changeCount), C.info]]),
-            buildPanelLine(width, [[' path ', C.label], [snapshot.stagedManagedBundle.path.slice(0, Math.max(0, width - 9)), C.dim]]),
-          ]
-        : [buildPanelLine(width, [[' No staged managed settings bundle.', C.dim]])]),
-      // Recent Events
-      ...(snapshot.recentEvents.length > 0
-        ? snapshot.recentEvents.map((event) => buildPanelLine(width, [[` ${event.surface}/${event.direction}`.padEnd(18), C.info], [` ${event.detail}`.slice(0, Math.max(0, width - 20)), C.dim]]))
-        : [buildPanelLine(width, [[' No sync or managed-setting events recorded yet.', C.dim]])]),
-      // Managed Locks
-      ...(snapshot.managedLocks.length > 0
-        ? snapshot.managedLocks.slice(0, 10).map((lock) => buildPanelLine(width, [[` ${lock.key}`.padEnd(30), C.value], [` source=${lock.source}`.padEnd(24), C.info], [` ${lock.reason}`.slice(0, Math.max(0, width - 56)), C.dim]]))
-        : [buildPanelLine(width, [[' No managed locks are currently active.', C.dim]])]),
-      // Failures
-      ...(snapshot.recentFailures.length > 0
-        ? snapshot.recentFailures.map((failure) => buildPanelLine(width, [[` ${failure.surface}`.padEnd(10), C.error], [` ${failure.message}`.slice(0, Math.max(0, width - 12)), C.dim]]))
-        : [buildPanelLine(width, [[' No recent sync or managed-setting failures.', C.dim]])]),
-      // Conflicts
-      ...(snapshot.conflicts.length > 0
-        ? snapshot.conflicts.map((conflict) => buildPanelLine(width, [[` ${conflict.key}`.padEnd(30), C.value], [` ${conflict.source}`.padEnd(10), C.warn], [` resolve: /settings-sync resolve ${conflict.key} local|synced`.slice(0, Math.max(0, width - 42)), C.dim]]))
-        : [buildPanelLine(width, [[' No settings conflicts detected.', C.dim]])]),
-      // Rollback History
-      ...(snapshot.rollbackHistory.length > 0
-        ? snapshot.rollbackHistory.map((entry) => buildPanelLine(width, [[` ${entry.token}`.padEnd(18), C.info], [` ${entry.profileName}`.padEnd(18), C.value], [` restored=${String(entry.restoredKeys.length).padEnd(4)}`, C.warn], [` ${new Date(entry.appliedAt).toLocaleString()}`.slice(0, Math.max(0, width - 46)), C.dim]]))
-        : [buildPanelLine(width, [[' No managed rollback records yet.', C.dim]])]),
+  private _buildResolvePromptLines(width: number, key: string): Line[] {
+    return [
+      buildPanelLine(width, [[` Resolve conflict for "${key}"?`, C.warn]]),
+      buildPanelLine(width, [
+        [' l', C.info], ['  keep local', C.dim],
+        ['   s', C.info], ['  use synced', C.dim],
+        ['   Esc', C.info], ['  cancel', C.dim],
+      ]),
     ];
+  }
+
+  private _buildBrowseModeContent(width: number, snapshot: SettingsSnapshot): BrowseModeContent {
+    switch (this.browseMode) {
+      case 'events':
+        return {
+          title: 'Recent Sync & Managed-Setting Events',
+          rows: snapshot.recentEvents.map((event, index) => buildPanelListRow(width, [
+            { text: fitDisplay(` ${event.surface}/${event.direction}`, 18).padEnd(18), fg: C.info },
+            { text: truncateDisplay(` ${event.detail}`, Math.max(0, width - 20)), fg: C.dim },
+          ], C, { selected: index === this.browseIndex })),
+          emptyMessage: ' No sync or managed-setting events recorded yet.',
+        };
+      case 'locks':
+        return {
+          title: 'Managed Locks',
+          rows: snapshot.managedLocks.map((lock, index) => buildPanelListRow(width, [
+            { text: fitDisplay(` ${lock.key}`, 30).padEnd(30), fg: C.value },
+            { text: fitDisplay(` source=${lock.source}`, 24).padEnd(24), fg: C.info },
+            { text: truncateDisplay(` ${lock.reason}`, Math.max(0, width - 56)), fg: C.dim },
+          ], C, { selected: index === this.browseIndex })),
+          emptyMessage: ' No managed locks are currently active.',
+        };
+      case 'failures':
+        return {
+          title: 'Sync & Managed-Setting Failures',
+          rows: snapshot.recentFailures.map((failure, index) => buildPanelListRow(width, [
+            { text: ` ${failure.surface}`.padEnd(10), fg: C.bad },
+            { text: truncateDisplay(` ${failure.message}`, Math.max(0, width - 12)), fg: C.dim },
+          ], C, { selected: index === this.browseIndex })),
+          emptyMessage: ' No recent sync or managed-setting failures.',
+        };
+      case 'conflicts':
+        return {
+          title: 'Settings Conflicts',
+          rows: snapshot.conflicts.map((conflict, index) => buildPanelListRow(width, [
+            { text: fitDisplay(` ${conflict.key}`, 30).padEnd(30), fg: C.value },
+            { text: fitDisplay(` ${conflict.source}`, 10).padEnd(10), fg: C.warn },
+            { text: truncateDisplay(` local=${String(conflict.localValue)}  incoming=${String(conflict.incomingValue)}`, Math.max(0, width - 42)), fg: C.dim },
+          ], C, { selected: index === this.browseIndex })),
+          emptyMessage: ' No settings conflicts detected. Resolve conflicts from the keys list (Enter on a conflicted entry).',
+        };
+      case 'rollback':
+        return {
+          title: 'Managed Rollback History',
+          rows: snapshot.rollbackHistory.map((entry, index) => buildPanelListRow(width, [
+            { text: fitDisplay(` ${entry.token}`, 18).padEnd(18), fg: C.info },
+            { text: fitDisplay(` ${entry.profileName}`, 18).padEnd(18), fg: C.value },
+            { text: ` restored=${String(entry.restoredKeys.length).padEnd(4)}`, fg: C.warn },
+            { text: truncateDisplay(` ${new Date(entry.appliedAt).toLocaleString()}`, Math.max(0, width - 46)), fg: C.dim },
+          ], C, { selected: index === this.browseIndex })),
+          emptyMessage: ' No managed rollback records yet.',
+        };
+      default:
+        return { title: '', rows: [], emptyMessage: '' };
+    }
+  }
+
+  private _renderKeysMode(width: number, height: number, snapshot: SettingsSnapshot): Line[] {
+    const headerLines = this._buildPostureHeader(width, snapshot);
 
     this.clampSelection();
-    const selectedEntry = snapshot.resolvedEntries[this.selectedIndex];
-    const footerLines: Line[] = [
-      ...(selectedEntry
-        ? buildDetailBlock(width, 'Selected setting', [
-            buildPanelLine(width, [[' key ', C.label], [selectedEntry.key, C.value], ['  category ', C.label], [selectedEntry.category, C.info]]),
-            buildPanelLine(width, [[' effective ', C.label], [selectedEntry.effectiveSource, selectedEntry.effectiveSource === 'managed' ? C.warn : selectedEntry.effectiveSource === 'synced' ? C.ok : selectedEntry.effectiveSource === 'local' ? C.info : C.dim], ['  locked ', C.label], [selectedEntry.locked ? 'yes' : 'no', selectedEntry.locked ? C.warn : C.dim], ['  conflict ', C.label], [selectedEntry.conflict ? 'yes' : 'no', selectedEntry.conflict ? C.error : C.good]]),
-            buildPanelLine(width, [[' source ', C.label], [(selectedEntry.sourceLabel ?? 'local/default').slice(0, Math.max(0, width - 10)), C.dim]]),
-            buildPanelLine(width, [[' overrides ', C.label], [(selectedEntry.overriddenSources.length > 0 ? selectedEntry.overriddenSources.join(', ') : 'none').slice(0, Math.max(0, width - 13)), C.dim]]),
-            buildPanelLine(width, [[' local ', C.label], [String(selectedEntry.localValue).slice(0, Math.max(0, width - 9)), C.dim]]),
-            buildPanelLine(width, [[' synced ', C.label], [String(selectedEntry.syncedValue ?? '(unset)').slice(0, Math.max(0, width - 10)), C.ok]]),
-            buildPanelLine(width, [[' managed ', C.label], [String(selectedEntry.managedValue ?? '(unset)').slice(0, Math.max(0, width - 11)), C.warn]]),
-          ], C)
-        : []),
-      buildPanelLine(width, [[' ↑/↓ browse  /settings-sync show <key>  /settings-sync resolve <key> <local|synced>  /managed apply-staged [key...] ', C.dim]]),
-    ];
+    // Detail must describe the row the (possibly filtered) list highlights —
+    // raw resolvedEntries desyncs selectedIndex under an applied '/' filter.
+    const selectedEntry = this.getSelectedItem();
+    const detailLines: Line[] = this._resolvePrompt
+      ? this._buildResolvePromptLines(width, this._resolvePrompt.key)
+      : (selectedEntry
+          ? buildDetailBlock(width, 'Selected setting', [
+              buildPanelLine(width, [[' key ', C.label], [selectedEntry.key, C.value], ['  category ', C.label], [selectedEntry.category, C.info]]),
+              buildPanelLine(width, [[' effective ', C.label], [selectedEntry.effectiveSource, selectedEntry.effectiveSource === 'managed' ? C.warn : selectedEntry.effectiveSource === 'synced' ? C.good : selectedEntry.effectiveSource === 'local' ? C.info : C.dim], ['  locked ', C.label], [selectedEntry.locked ? 'yes' : 'no', selectedEntry.locked ? C.warn : C.dim], ['  conflict ', C.label], [selectedEntry.conflict ? 'yes' : 'no', selectedEntry.conflict ? C.bad : C.good]]),
+              buildPanelLine(width, [[' source ', C.label], [truncateDisplay(selectedEntry.sourceLabel ?? 'local/default', Math.max(0, width - 10)), C.dim]]),
+              buildPanelLine(width, [[' overrides ', C.label], [truncateDisplay(selectedEntry.overriddenSources.length > 0 ? selectedEntry.overriddenSources.join(', ') : 'none', Math.max(0, width - 13)), C.dim]]),
+              buildPanelLine(width, [[' local ', C.label], [truncateDisplay(String(selectedEntry.localValue), Math.max(0, width - 9)), C.dim]]),
+              buildPanelLine(width, [[' synced ', C.label], [truncateDisplay(String(selectedEntry.syncedValue ?? '(unset)'), Math.max(0, width - 10)), C.good]]),
+              buildPanelLine(width, [[' managed ', C.label], [truncateDisplay(String(selectedEntry.managedValue ?? '(unset)'), Math.max(0, width - 11)), C.warn]]),
+            ], C)
+          : [buildPanelLine(width, [[' Select a setting above to inspect its effective value, source, and overrides.', C.dim]])]);
 
     return this.renderList(width, height, {
       title: 'Settings Sync',
       header: headerLines,
-      footer: footerLines,
+      // Keyboard hints are placed BEFORE the detail block (rather than after,
+      // which is the usual convention) so that if the fixed-row budget is
+      // tight, the tail of the detail block is what gets clipped by the
+      // panel-workspace row budget — not the hints row itself.
+      footer: [
+        buildKeyboardHints(width, [
+          { keys: '↑/↓', label: 'browse' },
+          { keys: '/', label: 'filter' },
+          { keys: 'enter', label: 'resolve conflict' },
+          { keys: 'tab', label: 'events/locks/failures/conflicts/rollback' },
+          { keys: 'm', label: 'managed review' },
+        ], C),
+        ...detailLines,
+      ],
+    });
+  }
+
+  private _renderBrowseMode(width: number, height: number, snapshot: SettingsSnapshot): Line[] {
+    this.needsRender = false;
+    const postureSection: PanelWorkspaceSection = { lines: this._buildPostureHeader(width, snapshot) };
+    const content = this._buildBrowseModeContent(width, snapshot);
+    const itemCount = content.rows.length;
+    this.browseIndex = itemCount > 0 ? Math.min(this.browseIndex, itemCount - 1) : 0;
+    const scrollableLines = itemCount > 0 ? content.rows : [buildPanelLine(width, [[content.emptyMessage, C.dim]])];
+
+    const hintsLine = buildKeyboardHints(width, [
+      { keys: '↑/↓', label: 'browse' },
+      { keys: 'tab', label: 'next mode' },
+      { keys: 'm', label: 'managed review' },
+    ], C);
+
+    const resolved = resolveScrollablePanelSection(width, height, {
+      palette: C,
+      beforeSections: [postureSection],
+      footerLines: [hintsLine],
+      section: {
+        title: content.title,
+        scrollableLines,
+        selectedIndex: itemCount > 0 ? this.browseIndex : undefined,
+        scrollOffset: this.browseScrollOffset,
+        guardRows: 1,
+        minRows: 4,
+        appendWindowSummary: { dimColor: C.dim },
+      },
+    });
+    this.browseScrollOffset = resolved.scrollOffset;
+
+    const lines = buildPanelWorkspace(width, height, {
+      title: 'Settings Sync',
+      sections: [postureSection, resolved.section],
+      footerLines: [hintsLine],
+      palette: C,
     });
+    while (lines.length < height) lines.push(createEmptyLine(width));
+    return lines.slice(0, height);
+  }
+
+  public render(width: number, height: number): Line[] {
+    const snapshot = getSettingsControlPlaneSnapshot(this.configManager);
+    if (this.browseMode !== 'keys') {
+      return this._renderBrowseMode(width, height, snapshot);
+    }
+    return this._renderKeysMode(width, height, snapshot);
   }
 }