@pellux/goodvibes-tui 0.27.0 → 0.29.0

package/src/panels/watchers-panel.ts

@@ -1,193 +0,0 @@
-import type { Line } from '../types/grid.ts';
-import { createEmptyLine } from '../types/grid.ts';
-import { ScrollableListPanel } from './scrollable-list-panel.ts';
-import type { UiReadModel, UiWatchersSnapshot } from '../runtime/ui-read-models.ts';
-import { truncateDisplay } from '../utils/terminal-width.ts';
-import {
-  buildEmptyState,
-  buildGuidanceLine,
-  buildKeyValueLine,
-  buildPanelLine,
-  buildPanelWorkspace,
-  DEFAULT_PANEL_PALETTE,
-  type PanelPalette,
-} from './polish.ts';
-
-const C = {
-  ...DEFAULT_PANEL_PALETTE,
-  header: '#94a3b8',
-  headerBg: '#1e293b',
-  ok: '#22c55e',
-  warn: '#eab308',
-  error: '#ef4444',
-  info: '#38bdf8',
-  selectBg: '#0f172a',
-} as const;
-
-function stateColor(state: string): string {
-  if (state === 'running') return C.ok;
-  if (state === 'degraded') return C.warn;
-  if (state === 'failed') return C.error;
-  return C.dim;
-}
-
-function sourceStatusColor(state?: string): string {
-  if (state === 'healthy') return C.ok;
-  if (state === 'lagging' || state === 'stale' || state === 'degraded') return C.warn;
-  if (state === 'failed') return C.error;
-  return C.dim;
-}
-
-function formatLag(value?: number): string {
-  if (!value || value <= 0) return 'n/a';
-  if (value < 1000) return `${value}ms`;
-  if (value < 60_000) return `${Math.round(value / 1000)}s`;
-  return `${Math.round(value / 60_000)}m`;
-}
-
-function formatTime(value?: number): string {
-  if (!value) return 'n/a';
-  return new Date(value).toLocaleString();
-}
-
-type WatcherEntry = UiWatchersSnapshot['watchers'][number];
-
-export class WatchersPanel extends ScrollableListPanel<WatcherEntry> {
-  private readonly readModel?: UiReadModel<UiWatchersSnapshot>;
-  private readonly unsub: (() => void) | null;
-
-  public constructor(readModel?: UiReadModel<UiWatchersSnapshot>) {
-    super('watchers', 'Watchers', 'W', 'monitoring');
-    this.showSelectionGutter = true; // I5: non-color selection affordance
-    this.readModel = readModel;
-    this.unsub = readModel ? readModel.subscribe(() => this.markDirty()) : null;
-  }
-
-  public override onDestroy(): void {
-    this.unsub?.();
-  }
-
-  protected override getPalette(): PanelPalette {
-    return C;
-  }
-
-  protected getItems(): readonly WatcherEntry[] {
-    if (!this.readModel) return [];
-    return this.readModel.getSnapshot().watchers;
-  }
-
-  protected renderItem(watcher: WatcherEntry, _index: number, selected: boolean, width: number): Line {
-    const bg = selected ? C.selectBg : undefined;
-    return buildPanelLine(width, [
-      [' ', C.label, bg],
-      [watcher.state.padEnd(10), stateColor(watcher.state), bg],
-      [` ${truncateDisplay(watcher.label, 18).padEnd(18)}`, C.value, bg],
-      [` ${String(watcher.sourceStatus ?? 'unknown').padEnd(10)}`, sourceStatusColor(watcher.sourceStatus), bg],
-      [` ${truncateDisplay(formatLag(watcher.sourceLagMs), Math.max(0, width - 43))}`, C.dim, bg],
-    ]);
-  }
-
-  protected override getEmptyStateMessage(): string {
-    return ' No watchers registered.';
-  }
-
-  protected override getEmptyStateActions(): Array<{ command: string; summary: string }> {
-    return [
-      { command: '/schedule list', summary: 'review automation that will consume watcher events' },
-      { command: '/services auth-review', summary: 'validate integration credentials before enabling remote watchers' },
-    ];
-  }
-
-  public render(width: number, height: number): Line[] {
-    const intro = 'Managed watchers and source health used to trigger automation, refresh routes, and surface degraded upstream conditions.';
-
-    if (!this.readModel) {
-      const workspace = buildPanelWorkspace(width, height, {
-        title: 'Watchers',
-        intro,
-        sections: [{
-          lines: buildEmptyState(
-            width,
-            ' Runtime store not wired.',
-            'This panel needs the shared runtime store to inspect watcher health and source lag.',
-            [{ command: '/services auth-review', summary: 'inspect supporting services until watcher wiring is available' }],
-            C,
-          ),
-        }],
-        palette: C,
-      });
-      while (workspace.length < height) workspace.push(createEmptyLine(width));
-      return workspace;
-    }
-
-    const snapshot = this.readModel.getSnapshot();
-    const watchers = this.getItems();
-
-    const headerLines: Line[] = [
-      buildKeyValueLine(width, [
-        { label: 'watchers', value: String(snapshot.totalWatchers), valueColor: snapshot.totalWatchers > 0 ? C.info : C.dim },
-        { label: 'active', value: String(snapshot.activeWatcherIds.length), valueColor: snapshot.activeWatcherIds.length > 0 ? C.ok : C.dim },
-        { label: 'degraded', value: String(snapshot.totalDegraded), valueColor: snapshot.totalDegraded > 0 ? C.warn : C.dim },
-        { label: 'lagged', value: String(snapshot.totalLagged), valueColor: snapshot.totalLagged > 0 ? C.warn : C.dim },
-      ], C),
-      buildGuidanceLine(width, '/schedule list', 'verify jobs consuming these sources and use daemon APIs for watcher lifecycle control', C),
-    ];
-
-    if (watchers.length === 0) {
-      return this.renderList(width, height, {
-        title: 'Watchers',
-        header: headerLines,
-        emptyMessage: ' No watchers registered.',
-      });
-    }
-
-    this.clampSelection();
-    const selected = watchers[this.selectedIndex]!;
-
-    const footerLines: Line[] = [
-      buildPanelLine(width, [
-        ['  Watcher: ', C.label],
-        [selected.label, C.value],
-        ['  Kind: ', C.label],
-        [selected.kind, C.info],
-      ]),
-      buildPanelLine(width, [
-        ['  State: ', C.label],
-        [selected.state, stateColor(selected.state)],
-        ['  Source: ', C.label],
-        [selected.source.kind, C.value],
-      ]),
-      buildPanelLine(width, [
-        ['  Source status: ', C.label],
-        [selected.sourceStatus ?? 'unknown', sourceStatusColor(selected.sourceStatus)],
-        ['  Lag: ', C.label],
-        [formatLag(selected.sourceLagMs), selected.sourceLagMs ? C.warn : C.dim],
-      ]),
-      buildPanelLine(width, [
-        ['  Heartbeat: ', C.label],
-        [formatTime(selected.lastHeartbeatAt), C.dim],
-        ['  Checkpoint: ', C.label],
-        [truncateDisplay(selected.lastCheckpoint ?? 'n/a', Math.max(0, width - 38)), C.dim],
-      ]),
-    ];
-    if (selected.degradedReason) {
-      footerLines.push(buildPanelLine(width, [
-        ['  Reason: ', C.label],
-        [truncateDisplay(selected.degradedReason, Math.max(0, width - 11)), C.warn],
-      ]));
-    }
-    if (selected.lastError) {
-      footerLines.push(buildPanelLine(width, [
-        ['  Error: ', C.label],
-        [truncateDisplay(selected.lastError, Math.max(0, width - 10)), C.error],
-      ]));
-    }
-    footerLines.push(buildPanelLine(width, [['  Up/Down move through watchers', C.dim]]));
-
-    return this.renderList(width, height, {
-      title: 'Watchers',
-      header: headerLines,
-      footer: footerLines,
-    });
-  }
-}

package/src/renderer/panel-picker-overlay.ts

@@ -1,202 +0,0 @@
-import { type Line } from '../types/grid.ts';
-import { fitDisplay, getDisplayWidth, truncateDisplay } from '../utils/terminal-width.ts';
-import type { PanelPicker } from '../panels/panel-picker.ts';
-import { CATEGORY_LABELS, CATEGORY_ORDER } from '../panels/panel-picker.ts';
-import type { PanelCategory, PanelRegistration } from '../panels/types.ts';
-import {
-  createOverlayBorderLine,
-  createOverlayBoxLayout,
-  createOverlayContentLine,
-  DEFAULT_OVERLAY_PALETTE,
-  putOverlayText,
-} from './overlay-box.ts';
-import { getOverlaySurfaceMetrics } from './overlay-viewport.ts';
-
-const TITLE_FG = '#cbd5e1';
-const CATEGORY_FG = '#94a3b8';
-const SELECTED_FG = '#e2e8f0';
-const SELECTED_BG = '#1e293b';
-const BODY_FG = '252';
-const BORDER_FG = DEFAULT_OVERLAY_PALETTE.borderFg;
-
-/**
- * Render the panel picker modal as Line[] for overlay in the viewport.
- * Panels are grouped by category. Category headers are inserted between groups.
- * When a search query is active a search-bar row is shown beneath the title.
- */
-export function renderPanelPickerOverlay(
-  picker: PanelPicker,
-  width: number,
-  viewportHeight = 24,
-): Line[] {
-  if (!picker.active) return [];
-
-  const lines: Line[] = [];
-  const metrics = getOverlaySurfaceMetrics(width, viewportHeight, {
-    margin: 4,
-    maxWidth: 72,
-    chromeRows: picker.searchQuery.length > 0 ? 7 : 6,
-    minContentRows: 6,
-    maxContentRows: 10,
-  });
-  const layout = createOverlayBoxLayout(width, metrics.margin, metrics.boxWidth);
-  const contentW = layout.innerWidth;
-  const titleFg = TITLE_FG;
-  const borderFg = BORDER_FG;
-
-  // ── Title bar ──────────────────────────────────────────────────────────────
-  const titleLine = createOverlayBorderLine(width, layout, '┌', '─', '┐', borderFg);
-  putOverlayText(titleLine, layout.margin + 2, layout.width - 4, 'Open Panel Workspace', { fg: titleFg, bold: true });
-  lines.push(titleLine);
-
-  // ── Search bar (shown when query is non-empty) ──────────────────────────────
-  if (picker.searchQuery.length > 0) {
-    const searchLine = createOverlayContentLine(width, layout, borderFg);
-    const searchLabel = '\u2315 ';
-    const queryAvail = contentW - getDisplayWidth(searchLabel);
-    const queryText = fitDisplay(picker.searchQuery, queryAvail);
-    putOverlayText(searchLine, layout.margin + 2, getDisplayWidth(searchLabel), searchLabel, { fg: titleFg });
-    putOverlayText(searchLine, layout.margin + 2 + getDisplayWidth(searchLabel), queryAvail, queryText, { fg: titleFg });
-    lines.push(searchLine);
-
-    lines.push(createOverlayBorderLine(width, layout, '├', '─', '┤', borderFg));
-  } else {
-    const placeholder = ' Browse by category or start typing to filter by panel name, purpose, or category.';
-    const row = createOverlayContentLine(width, layout, borderFg);
-    putOverlayText(row, layout.margin + 2, contentW, fitDisplay(placeholder, contentW), { fg: '244', dim: true });
-    lines.push(row);
-  }
-
-  const visible = picker.getVisible();
-
-  if (visible.length === 0) {
-    const noResults = 'No panels match your search';
-    const noRow = createOverlayContentLine(width, layout, borderFg);
-    putOverlayText(noRow, layout.margin + 2, contentW, fitDisplay(noResults, contentW), { fg: '244', dim: true });
-    lines.push(noRow);
-  } else {
-    // Build a flat render list of { type: 'header' | 'item', ... } entries
-    // so we can compute the correct scroll window over all rows.
-    type HeaderEntry = { type: 'header'; category: PanelCategory };
-    type ItemEntry   = { type: 'item';   reg: PanelRegistration; flatIndex: number };
-    type RenderEntry = HeaderEntry | ItemEntry;
-
-    const renderEntries: RenderEntry[] = [];
-
-    // When no search query, group by category; when searching, show flat list
-    // with a single "Results" header.
-    if (picker.searchQuery.length === 0) {
-      const byCategory = new Map<PanelCategory, PanelRegistration[]>();
-      for (const reg of visible) {
-        const group = byCategory.get(reg.category) ?? [];
-        group.push(reg);
-        byCategory.set(reg.category, group);
-      }
-      let flatIndex = 0;
-      for (const cat of CATEGORY_ORDER) {
-        const group = byCategory.get(cat);
-        if (!group || group.length === 0) continue;
-        renderEntries.push({ type: 'header', category: cat });
-        for (const reg of group) {
-          renderEntries.push({ type: 'item', reg, flatIndex });
-          flatIndex++;
-        }
-      }
-    } else {
-      for (let i = 0; i < visible.length; i++) {
-        renderEntries.push({ type: 'item', reg: visible[i], flatIndex: i });
-      }
-    }
-
-    // Compute scroll window: ensure the selected item row stays visible.
-    // Find the render-entry index of the selected item.
-    const selectedEntryIdx = renderEntries.findIndex(
-      e => e.type === 'item' && e.flatIndex === picker.selectedIndex,
-    );
-    const total = renderEntries.length;
-    const maxVisible = metrics.contentRows;
-    let startEntry = 0;
-    if (total > maxVisible && selectedEntryIdx >= 0) {
-      startEntry = Math.max(
-        0,
-        Math.min(
-          selectedEntryIdx - Math.floor(maxVisible / 2),
-          total - maxVisible,
-        ),
-      );
-    }
-    const endEntry = Math.min(startEntry + maxVisible, total);
-
-    for (let i = startEntry; i < endEntry; i++) {
-      const entry = renderEntries[i];
-
-      if (entry.type === 'header') {
-        // Category header row
-        const label = CATEGORY_LABELS[entry.category].toUpperCase();
-        const headerRow = createOverlayContentLine(width, layout, borderFg);
-        putOverlayText(headerRow, layout.margin + 2, contentW, fitDisplay(`  ${label}`, contentW), { fg: CATEGORY_FG, dim: true });
-        lines.push(headerRow);
-      } else {
-        const { reg, flatIndex } = entry;
-        const isSelected = flatIndex === picker.selectedIndex;
-        const indicator = isSelected ? '\u25b6 ' : '  ';
-
-        // icon (1 char) + 2 spaces + name
-        const iconStr = reg.icon + '  ';
-        const iconW = getDisplayWidth(iconStr);
-
-        // separator between name and description: ' \u2014 '
-        const sep = ' \u2014 ';
-        const sepW = getDisplayWidth(sep);
-
-        // Allocate space: indicator(2) + icon(iconW) + name + sep + desc fills contentW
-        const nameMaxW = Math.max(8, Math.floor((contentW - 2 - iconW - sepW) * 0.35));
-        const descMaxW = contentW - 2 - iconW - nameMaxW - sepW;
-
-        const nameRaw = reg.name;
-        const nameStr = fitDisplay(nameRaw, nameMaxW);
-
-        const descRaw = reg.description;
-        const descStr = fitDisplay(descRaw, descMaxW);
-
-        const row = createOverlayContentLine(width, layout, borderFg, isSelected ? SELECTED_BG : '');
-        const rowText = indicator + iconStr + nameStr + sep + descStr;
-        putOverlayText(row, layout.margin + 2, contentW, fitDisplay(truncateDisplay(rowText, contentW), contentW), {
-          fg: isSelected ? SELECTED_FG : BODY_FG,
-          bg: isSelected ? SELECTED_BG : '',
-          bold: isSelected,
-        });
-        lines.push(row);
-      }
-    }
-
-    const selected = picker.getSelected();
-    if (selected) {
-      lines.push(createOverlayBorderLine(width, layout, '├', '─', '┤', borderFg));
-      const categoryLabel = CATEGORY_LABELS[selected.category].toUpperCase();
-      const selectedLine = createOverlayContentLine(width, layout, borderFg);
-      putOverlayText(selectedLine, layout.margin + 2, contentW, fitDisplay(`${selected.icon} ${selected.name}  [${categoryLabel}]`, contentW), { fg: SELECTED_FG });
-      lines.push(selectedLine);
-      const desc = fitDisplay(truncateDisplay(selected.description, contentW), contentW);
-      const descRow = createOverlayContentLine(width, layout, borderFg);
-      putOverlayText(descRow, layout.margin + 2, contentW, desc, { fg: '244', dim: true });
-      lines.push(descRow);
-    }
-
-    // ── Scroll indicator ───────────────────────────────────────────────────
-    if (total > maxVisible) {
-      const scrollInfo = `${picker.selectedIndex + 1}/${visible.length}`;
-      const scrollRow = createOverlayContentLine(width, layout, borderFg);
-      putOverlayText(scrollRow, layout.margin + 2 + Math.max(0, contentW - getDisplayWidth(scrollInfo)), getDisplayWidth(scrollInfo), scrollInfo, { fg: '240', dim: true });
-      lines.push(scrollRow);
-    }
-  }
-
-  // ── Bottom border with hints ───────────────────────────────────────────────
-  const hints = '[Up/Down] Navigate  [Enter] Open  [/] Filter  [Esc] Cancel';
-  const bottomLine = createOverlayBorderLine(width, layout, '└', '─', '┘', borderFg);
-  putOverlayText(bottomLine, layout.margin + 2, layout.width - 4, truncateDisplay(hints, layout.width - 4), { fg: '240', dim: true });
-  lines.push(bottomLine);
-
-  return lines;
-}

package/src/renderer/panel-tab-bar.ts

@@ -1,69 +0,0 @@
-import { type Line } from '../types/grid.ts';
-import type { Panel } from '../panels/types.ts';
-import { renderTabStrip } from './tab-strip.ts';
-
-const ACTIVE_FG = '#e2e8f0';
-const ACTIVE_FG_UNFOCUSED = '#94a3b8';
-const ACTIVE_BG = '#1e293b';
-const INACTIVE_FG = '244';
-const SEPARATOR_FG = '238';
-const CLOSE_FG = '238';
-const LABEL_FG = '#cbd5e1';
-const LABEL_BG = '#0f172a';
-
-/**
- * Render the panel tab bar.
- *
- * Shows open panel tabs with the active one highlighted.
- * Format: │ icon Name │ icon Name │ ...
- *
- * Active tab:   slate-white, bold, bg #1e293b
- * Inactive tab: grey (244), no background
- * Separators:   │ in dim grey (238)
- * Overflow:     > right scroll indicator (stateless - shows when tabs extend beyond width)
- * Close button: x at far right for active tab
- */
-export function renderPanelTabBar(
-  panels: Panel[],
-  activeIndex: number,
-  width: number,
-  focused: boolean = true,
-  paneLabel?: string,
-): Line {
-  if (panels.length === 0) return renderTabStrip({ width, tabs: [], style: {
-    activeFg: ACTIVE_FG,
-    activeBg: ACTIVE_BG,
-    activeBold: focused,
-    inactiveFg: INACTIVE_FG,
-    separatorFg: SEPARATOR_FG,
-    labelFg: LABEL_FG,
-    labelBg: focused ? LABEL_BG : '',
-    labelBold: focused,
-    overflowFg: SEPARATOR_FG,
-    trailingFg: focused ? ACTIVE_FG_UNFOCUSED : INACTIVE_FG,
-  } });
-
-  const tabs = panels.map((panel, index) => ({
-    label: `${panel.icon} ${panel.name}`,
-    active: index === activeIndex,
-  }));
-
-  return renderTabStrip({
-    width,
-    tabs,
-    prefixLabel: paneLabel ? ` ${paneLabel.toUpperCase()} ` : undefined,
-    suffixLabel: ` ${panels.length}  x `,
-    style: {
-      activeFg: focused ? ACTIVE_FG : ACTIVE_FG_UNFOCUSED,
-      activeBg: ACTIVE_BG,
-      activeBold: focused,
-      inactiveFg: INACTIVE_FG,
-      separatorFg: SEPARATOR_FG,
-      labelFg: LABEL_FG,
-      labelBg: focused ? LABEL_BG : '',
-      labelBold: focused,
-      overflowFg: SEPARATOR_FG,
-      trailingFg: CLOSE_FG,
-    },
-  });
-}

package/src/runtime/diagnostics/panels/panel-resources.ts

@@ -1,118 +0,0 @@
-/**
- * Panel resource diagnostics panel data provider.
- *
- * Polls the shared TUI-owned ComponentHealthMonitor and produces PanelResourceSnapshot
- * values for the diagnostics panel to render.
- */
-import type { ComponentHealthMonitor } from '../../perf/panel-health-monitor.ts';
-import type {
-  ComponentResourceEntry,
-  ComponentResourceSnapshot,
-} from '@/runtime/index.ts';
-
-const DEFAULT_POLL_INTERVAL_MS = 500;
-
-const HEALTH_ORDER: Record<string, number> = {
-  overloaded: 0,
-  warning: 1,
-  healthy: 2,
-};
-
-export class PanelResourcesPanel {
-  private readonly _pollIntervalMs: number;
-  private readonly _monitor: ComponentHealthMonitor;
-  private _current: ComponentResourceSnapshot;
-  private _timerId: ReturnType<typeof setInterval> | null = null;
-  private readonly _subscribers = new Set<() => void>();
-
-  constructor(monitor: ComponentHealthMonitor, pollIntervalMs: number = DEFAULT_POLL_INTERVAL_MS) {
-    this._monitor = monitor;
-    this._pollIntervalMs = pollIntervalMs;
-    this._current = this._buildSnapshot(Date.now());
-  }
-
-  start(): void {
-    if (this._timerId !== null) return;
-    this._timerId = setInterval(() => {
-      this._current = this._buildSnapshot(Date.now());
-      this._notify();
-    }, this._pollIntervalMs);
-  }
-
-  stop(): void {
-    if (this._timerId !== null) {
-      clearInterval(this._timerId);
-      this._timerId = null;
-    }
-  }
-
-  getSnapshot(): ComponentResourceSnapshot {
-    return this._current;
-  }
-
-  refresh(now: number = Date.now()): ComponentResourceSnapshot {
-    this._current = this._buildSnapshot(now);
-    return this._current;
-  }
-
-  subscribe(callback: () => void): () => void {
-    this._subscribers.add(callback);
-    return () => this._subscribers.delete(callback);
-  }
-
-  dispose(): void {
-    this.stop();
-    this._subscribers.clear();
-  }
-
-  private _buildSnapshot(capturedAt: number): ComponentResourceSnapshot {
-    const healthStates = this._monitor.getAllHealth();
-
-    const panels: ComponentResourceEntry[] = healthStates.map((health) => {
-      const contract = this._monitor.getContract(health.componentId);
-      return {
-        componentId: health.componentId,
-        throttleStatus: health.throttleStatus,
-        healthStatus: health.healthStatus,
-        renderP95Ms: health.renderP95Ms,
-        maxRenderMs: contract?.maxRenderMs ?? 0,
-        rendersInWindow: health.rendersInWindow,
-        maxUpdatesPerSecond: contract?.maxUpdatesPerSecond ?? 0,
-        consecutiveViolations: health.consecutiveViolations,
-        totalSuppressed: health.totalSuppressed,
-        totalPermitted: health.totalPermitted,
-        lastRenderAt: health.lastRenderAt,
-        nextAllowedAt: health.nextAllowedAt,
-      };
-    });
-
-    panels.sort((left, right) => {
-      const diff = (HEALTH_ORDER[left.healthStatus] ?? 2) - (HEALTH_ORDER[right.healthStatus] ?? 2);
-      return diff !== 0 ? diff : left.componentId.localeCompare(right.componentId);
-    });
-
-    const overloadedCount = panels.filter((panel) => panel.healthStatus === 'overloaded').length;
-    const warningCount = panels.filter((panel) => panel.healthStatus === 'warning').length;
-    const healthyCount = panels.filter((panel) => panel.healthStatus === 'healthy').length;
-    const totalSuppressed = panels.reduce((sum, panel) => sum + panel.totalSuppressed, 0);
-
-    return {
-      panels,
-      overloadedCount,
-      warningCount,
-      healthyCount,
-      totalSuppressed,
-      capturedAt,
-    };
-  }
-
-  private _notify(): void {
-    for (const callback of this._subscribers) {
-      try {
-        callback();
-      } catch {
-        // Subscriber failures must not take down diagnostics polling.
-      }
-    }
-  }
-}