gloomberb 0.11.2 → 0.12.0

package/src/renderers/electrobun/view/main.tsx

@@ -1,4 +1,5 @@
 /** @jsxImportSource react */
+import { setCurrentPluginTarget } from "../../../plugins/current-target";
 import { createRoot } from "react-dom/client";
 import { App } from "../../../app";
 import { applyLanguageFromConfig } from "../../../i18n";
@@ -30,7 +31,13 @@ import { createDesktopDeepLinkBridge } from "./desktop-deeplink-bridge";
 import { createDesktopWindowBridge } from "./desktop/window/bridge";
 import { prepareDetachedSnapshot } from "./desktop/window/snapshot";
 import { createElectrobunAppServices } from "./app-services";
-import { getRendererBuiltinPlugins } from "../../../plugins/catalog-ui";
+import { getRendererPlugins } from "../../../plugins/catalog-ui";
+import { loadDesktopExternalPlugins } from "./external-plugins";
+import { setPluginInstaller } from "../../../plugins/builtin/plugin-marketplace/store";
+
+// Declared here rather than sniffed: the desktop view and the hosted browser
+// app are both browser contexts but differ in what plugins may do.
+setCurrentPluginTarget("desktop");
 
 const rootElement = document.getElementById("root");
 if (!rootElement) {
@@ -100,6 +107,23 @@ async function boot() {
   const desktopApplicationMenuBridge = createApplicationMenuBridge();
   const desktopDeepLinkBridge = createDesktopDeepLinkBridge();
   const webUiHost = createWebUiHost(init.desktopPlatform);
+  // Compiled by the Bun process, which owns the filesystem. A failure here must
+  // not stop the app from starting: the marketplace reports broken plugins, and
+  // the built-in catalog is enough to run on.
+  const externalPlugins = await measurePerfAsync(
+    "startup.electrobun.load-external-plugins",
+    async () => {
+      try {
+        return await loadDesktopExternalPlugins(await backendRequest("plugins.listExternal"));
+      } catch (error) {
+        debugLog.createLogger("desktop-plugins").error(`External plugin load failed: ${error}`);
+        return [];
+      }
+    },
+  );
+
+  setPluginInstaller((ref) => backendRequest("plugins.install", { ref }));
+
   const remoteControlAdapter = init.windowKind === "main"
     ? { registerHandler: setElectrobunRemoteRequestHandler }
     : undefined;
@@ -113,7 +137,8 @@ async function boot() {
                 <App
                   config={config}
                   servicesFactory={createElectrobunAppServices}
-                  plugins={getRendererBuiltinPlugins()}
+                  externalPlugins={externalPlugins}
+                  plugins={getRendererPlugins(externalPlugins)}
                   desktopWindowBridge={desktopWindowBridge}
                   desktopApplicationMenuBridge={desktopApplicationMenuBridge}
                   desktopDeepLinkBridge={desktopDeepLinkBridge}

package/src/renderers/electrobun/view/styles.css

@@ -504,6 +504,11 @@ body.gloom-dragging [data-gloom-role="chart-surface"] {
   border-radius: 4px;
   color: var(--gloom-text-bright);
 }
+/* Secondary reads as the quieter option next to the primary action. */
+.gloom-toast-action-secondary {
+  border-color: var(--gloom-border);
+  color: var(--gloom-text-dim);
+}
 .gloom-toast-dismiss {
   display: grid;
   width: 22px;

package/src/renderers/electrobun/view/toast-host.tsx

@@ -11,6 +11,7 @@ interface ToastEntry {
   title?: string;
   subtitle?: string;
   action?: ToastOptions["action"];
+  secondaryAction?: ToastOptions["secondaryAction"];
 }
 
 let nextToastId = 1;
@@ -31,6 +32,7 @@ export function WebToastHostProvider({ children }: { children: ReactNode }) {
       title: options?.title,
       subtitle: options?.subtitle,
       action: options?.action,
+      secondaryAction: options?.secondaryAction,
     }]);
     if (options?.duration !== 0) {
       setTimeout(() => dismiss(id), options?.duration ?? 4500);
@@ -82,6 +84,22 @@ export function WebToastHostProvider({ children }: { children: ReactNode }) {
                       {toast.action.label}
                     </button>
                   )}
+                  {toast.secondaryAction && (
+                    <button
+                      type="button"
+                      className="gloom-toast-action gloom-toast-action-secondary"
+                      onClick={(event) => {
+                        event.stopPropagation();
+                        try {
+                          toast.secondaryAction?.onClick();
+                        } finally {
+                          dismiss(toast.id);
+                        }
+                      }}
+                    >
+                      {toast.secondaryAction.label}
+                    </button>
+                  )}
                   <button
                     type="button"
                     className="gloom-toast-dismiss"

package/src/renderers/electrobun/view/ui-host.tsx

@@ -61,6 +61,9 @@ export const webRendererHost: RendererHost = {
       return backendRequest("host.readText");
     }
   },
+  async saveTextFile({ name, text, mimeType }) {
+    return backendRequest("host.saveTextFile", { name, text, mimeType });
+  },
   notify(notification) {
     void backendRequest("host.notify", {
       title: notification.title,

package/src/renderers/opentui/chart-surface.tsx

@@ -200,7 +200,9 @@ export const OpenTuiChartSurface = forwardRef<unknown, ChartSurfaceProps>(functi
     const size = computeBitmapSize(rect, renderer.resolution, renderer.terminalWidth, renderer.terminalHeight);
     const strips = renderCrosshairStrips({
       pixelX: scaleLocalPixelCoordinate(nativeCrosshair.pixelX, nativeBitmap.width, size.pixelWidth) ?? 0,
-      pixelY: scaleLocalPixelCoordinate(nativeCrosshair.pixelY, nativeBitmap.height, size.pixelHeight) ?? 0,
+      pixelY: nativeCrosshair.pixelY === null
+        ? null
+        : scaleLocalPixelCoordinate(nativeCrosshair.pixelY, nativeBitmap.height, size.pixelHeight) ?? 0,
       pixelWidth: size.pixelWidth,
       pixelHeight: size.pixelHeight,
       cols: rect.width,
@@ -218,6 +220,8 @@ export const OpenTuiChartSurface = forwardRef<unknown, ChartSurfaceProps>(functi
       return;
     }
 
+    // A column-only cursor has no level strip; drop the stale one if it existed.
+    for (const id of crosshairSurfaceIds.slice(strips.length)) nativeSurfaceManager.removeSurface(id);
     strips.forEach((strip, index) => {
       const id = crosshairSurfaceIds[index];
       if (!id) return;

package/src/renderers/opentui/host.tsx

@@ -1,12 +1,14 @@
 import { createCliRenderer, type CliRenderer } from "@opentui/core";
 import { createRoot, useKeyboard, useTerminalDimensions } from "@opentui/react";
-import type { ReactNode } from "react";
+import { Profiler, type ReactNode } from "react";
 import { resetTerminalInputState } from "../../utils/terminal-input-reset";
 import type { KeyEventLike } from "../../react/input";
 import type { NativeRendererHost, PixelResolution, RendererHost } from "../../ui/host";
 import { colors } from "../../theme/colors";
 import { safeExternalUrl } from "../../utils/external-url";
 import { createTerminalMediaReaper, terminalMediaStateFile } from "./terminal-media";
+import { saveTextFileToDownloads } from "../../utils/save-text-file";
+import { installInteractionPerformanceRecorder } from "./interaction-performance";
 
 export { useKeyboard, useTerminalDimensions };
 
@@ -96,6 +98,8 @@ export async function createOpenTuiHost(): Promise<OpenTuiHost> {
   });
   const root = createRoot(renderer);
   installResolutionEventBridge(renderer);
+  const stopInteractionPerformanceRecorder = installInteractionPerformanceRecorder(renderer);
+  renderer.once("destroy", stopInteractionPerformanceRecorder);
 
   const rendererHost: RendererHost = {
     requestExit: () => renderer.destroy(),
@@ -134,6 +138,9 @@ export async function createOpenTuiHost(): Promise<OpenTuiHost> {
       });
       return await new Response(proc.stdout).text();
     },
+    async saveTextFile({ name, text }) {
+      return saveTextFileToDownloads(name, text);
+    },
     notify() {
       // The app-level notifier still owns toast/desktop notification behavior.
     },
@@ -241,7 +248,18 @@ export async function createOpenTuiHost(): Promise<OpenTuiHost> {
     renderer,
     rendererHost,
     nativeRenderer,
-    render: (node) => root.render(node),
+    render: (node) => root.render(
+      stopInteractionPerformanceRecorder.enabled
+        ? (
+            <Profiler
+              id="interaction-performance"
+              onRender={stopInteractionPerformanceRecorder.markCommit}
+            >
+              {node}
+            </Profiler>
+          )
+        : node,
+    ),
     destroy: () => renderer.destroy(),
   };
 }

package/src/renderers/opentui/interaction-performance.test.ts

@@ -0,0 +1,79 @@
+import { afterEach, expect, test } from "bun:test";
+import { EventEmitter } from "events";
+import { mkdtempSync, readFileSync, rmSync } from "fs";
+import { tmpdir } from "os";
+import { join } from "path";
+import type { CliRenderer } from "@opentui/core";
+import {
+  installInteractionPerformanceRecorder,
+  summarizeInteractionPerformance,
+  type InteractionPerformanceSample,
+} from "./interaction-performance";
+
+const temporaryDirectories: string[] = [];
+
+afterEach(() => {
+  for (const directory of temporaryDirectories.splice(0)) {
+    rmSync(directory, { recursive: true, force: true });
+  }
+});
+
+function sample(latencyMs: number): InteractionPerformanceSample {
+  return {
+    id: latencyMs,
+    key: "down",
+    frameId: 1,
+    inputsInFrame: 1,
+    latencyMs,
+    frameCallbackMs: 0,
+    cellsUpdated: 0,
+    rssBytes: 0,
+  };
+}
+
+test("summarizes key-to-frame latency with nearest-rank percentiles", () => {
+  const samples = Array.from({ length: 20 }, (_, index) => sample(index + 1));
+  expect(summarizeInteractionPerformance(samples)).toEqual({
+    count: 20,
+    p50Ms: 10,
+    p95Ms: 19,
+    maxMs: 20,
+  });
+});
+
+test("waits for the key's React commit before attributing a renderer frame", () => {
+  const directory = mkdtempSync(join(tmpdir(), "gloomberb-interaction-performance-"));
+  temporaryDirectories.push(directory);
+  const output = join(directory, "report.json");
+  const rendererEvents = new EventEmitter();
+  const keyInput = new EventEmitter();
+  const renderer = Object.assign(rendererEvents, {
+    keyInput,
+    setGatherStats: () => {},
+    getStats: () => ({ frameCallbackTime: 1.25, cellsUpdated: 42 }),
+  }) as unknown as CliRenderer;
+  const recorder = installInteractionPerformanceRecorder(renderer, output);
+
+  keyInput.emit("keypress", { name: "down" });
+  keyInput.emit("keypress", { name: "up" });
+  rendererEvents.emit("frame", { frameId: 10 });
+  recorder.markCommit();
+  rendererEvents.emit("frame", { frameId: 11 });
+  recorder();
+
+  const report = JSON.parse(readFileSync(output, "utf8")) as {
+    unframedInputCount: number;
+    samples: InteractionPerformanceSample[];
+  };
+  expect(report.unframedInputCount).toBe(0);
+  expect(report.samples).toHaveLength(2);
+  expect(report.samples.map((entry) => entry.key)).toEqual(["down", "up"]);
+  for (const entry of report.samples) {
+    expect(entry).toMatchObject({
+      frameId: 11,
+      inputsInFrame: 2,
+      frameCallbackMs: 1.25,
+      cellsUpdated: 42,
+    });
+  }
+});

package/src/renderers/opentui/interaction-performance.ts

@@ -0,0 +1,188 @@
+import { mkdirSync, writeFileSync } from "fs";
+import { dirname, resolve } from "path";
+import type { CliRenderer, CliRendererStats } from "@opentui/core";
+
+const SAFE_INTERACTION_KEYS = new Set([
+  "up",
+  "down",
+  "left",
+  "right",
+  "pageup",
+  "pagedown",
+  "home",
+  "end",
+  "enter",
+  "return",
+  "tab",
+  "escape",
+]);
+
+interface PendingInteraction {
+  id: number;
+  key: string;
+  startedAtMs: number;
+}
+
+export interface InteractionPerformanceSample {
+  id: number;
+  key: string;
+  frameId: number;
+  inputsInFrame: number;
+  latencyMs: number;
+  frameCallbackMs: number;
+  /** Renderer-wide count shared by every input completed in this frame. */
+  cellsUpdated: number;
+  rssBytes: number;
+}
+
+export interface InteractionPerformanceSummary {
+  count: number;
+  p50Ms: number;
+  p95Ms: number;
+  maxMs: number;
+}
+
+export interface InteractionPerformanceRecorder {
+  (): void;
+  readonly enabled: boolean;
+  markCommit(): void;
+}
+
+function round(value: number): number {
+  return Math.round(value * 100) / 100;
+}
+
+function percentile(sorted: readonly number[], quantile: number): number {
+  if (sorted.length === 0) return 0;
+  const index = Math.max(0, Math.ceil(sorted.length * quantile) - 1);
+  return sorted[Math.min(index, sorted.length - 1)]!;
+}
+
+export function summarizeInteractionPerformance(
+  samples: readonly InteractionPerformanceSample[],
+): InteractionPerformanceSummary {
+  const latencies = samples.map((sample) => sample.latencyMs).sort((left, right) => left - right);
+  return {
+    count: latencies.length,
+    p50Ms: round(percentile(latencies, 0.5)),
+    p95Ms: round(percentile(latencies, 0.95)),
+    maxMs: round(latencies.at(-1) ?? 0),
+  };
+}
+
+function statsForFrame(renderer: CliRenderer): CliRendererStats {
+  try {
+    return renderer.getStats();
+  } catch {
+    return {
+      fps: 0,
+      frameCount: 0,
+      frameTimes: [],
+      averageFrameTime: 0,
+      minFrameTime: 0,
+      maxFrameTime: 0,
+      frameCallbackTime: 0,
+      nativeLastFrameTime: 0,
+      nativeAverageFrameTime: 0,
+      nativeFrameCount: 0,
+      cellsUpdated: 0,
+      averageCellsUpdated: 0,
+    };
+  }
+}
+
+/**
+ * Opt-in key-to-frame telemetry for repeatable tmux benchmarks. The recorder
+ * ignores printable keys, buffers in memory, and writes once during renderer
+ * shutdown so measurement does not add filesystem work to the hot path.
+ */
+export function installInteractionPerformanceRecorder(
+  renderer: CliRenderer,
+  outputPath = process.env.GLOOMBERB_INTERACTION_PERF,
+): InteractionPerformanceRecorder {
+  if (!outputPath) {
+    const stop = (() => {}) as InteractionPerformanceRecorder;
+    Object.defineProperties(stop, {
+      enabled: { value: false },
+      markCommit: { value: () => {} },
+    });
+    return stop;
+  }
+
+  const startedAt = new Date().toISOString();
+  const pending: PendingInteraction[] = [];
+  const samples: InteractionPerformanceSample[] = [];
+  let committedCount = 0;
+  let nextId = 1;
+  let stopped = false;
+
+  renderer.setGatherStats(true);
+
+  const onKeypress = (event: { name?: string }) => {
+    const key = event.name?.toLowerCase() ?? "";
+    if (!SAFE_INTERACTION_KEYS.has(key)) return;
+    pending.push({ id: nextId++, key, startedAtMs: performance.now() });
+  };
+  const onFrame = (event: { frameId: number }) => {
+    if (committedCount === 0) return;
+    const completedAtMs = performance.now();
+    const stats = statsForFrame(renderer);
+    const rssBytes = process.memoryUsage.rss();
+    const completed = pending.splice(0, committedCount);
+    committedCount = 0;
+    for (const interaction of completed) {
+      samples.push({
+        id: interaction.id,
+        key: interaction.key,
+        frameId: event.frameId,
+        inputsInFrame: completed.length,
+        latencyMs: round(completedAtMs - interaction.startedAtMs),
+        frameCallbackMs: round(stats.frameCallbackTime),
+        cellsUpdated: stats.cellsUpdated,
+        rssBytes,
+      });
+    }
+  };
+
+  renderer.keyInput.on("keypress", onKeypress);
+  renderer.on("frame", onFrame);
+
+  const stop = (() => {
+    if (stopped) return;
+    stopped = true;
+    renderer.keyInput.off("keypress", onKeypress);
+    renderer.off("frame", onFrame);
+
+    const byKey = Object.fromEntries(
+      [...new Set(samples.map((sample) => sample.key))]
+        .sort()
+        .map((key) => [
+          key,
+          summarizeInteractionPerformance(samples.filter((sample) => sample.key === key)),
+        ]),
+    );
+    const report = {
+      version: 2,
+      startedAt,
+      endedAt: new Date().toISOString(),
+      summary: summarizeInteractionPerformance(samples),
+      byKey,
+      unframedInputCount: pending.length,
+      samples,
+    };
+    const target = resolve(outputPath);
+    mkdirSync(dirname(target), { recursive: true });
+    writeFileSync(target, `${JSON.stringify(report, null, 2)}\n`, "utf8");
+  }) as InteractionPerformanceRecorder;
+  Object.defineProperties(stop, {
+    enabled: { value: true },
+    markCommit: {
+      value: () => {
+        // A React Profiler callback runs after host mutations commit. Only
+        // inputs present by then may be completed by the following frame.
+        committedCount = pending.length;
+      },
+    },
+  });
+  return stop;
+}

package/src/renderers/opentui/start.tsx

@@ -6,6 +6,9 @@ import { getDataDir, initDataDir, setConfigStoreHost } from "../../data/config/s
 import { applyLanguageFromConfig } from "../../i18n";
 import * as nodeConfigStoreHost from "../../data/config/store/node";
 import { loadExternalPlugins } from "../../plugins/loader";
+import { restoreExtractedPlugins } from "../../cli/restore-plugins";
+import { setPluginInstaller } from "../../plugins/builtin/plugin-marketplace/store";
+import { setCurrentPluginTarget } from "../../plugins/current-target";
 import { getLoadablePlugins } from "../../plugins/catalog";
 import { OpenTuiInputHostProvider } from "./input-host";
 import { debugLog } from "../../utils/debug-log";
@@ -27,6 +30,10 @@ import {
 } from "../../plugins/builtin/ai/runner";
 import { createAppServices } from "../../core/app-services";
 
+// Declared here rather than sniffed: the desktop view and the hosted browser
+// app are both browser contexts but differ in what plugins may do.
+setCurrentPluginTarget("tui");
+
 const AI_STARTUP_READINESS_TIMEOUT_MS = 5_000;
 
 export interface StartOpenTuiAppOptions {
@@ -73,7 +80,25 @@ export async function startOpenTuiApp(options: StartOpenTuiAppOptions = {}): Pro
   };
 
   const cliArgs = options.cliArgs ?? process.argv.slice(2);
-  const externalPlugins = options.externalPlugins ?? await measurePerfAsync("startup.opentui.load-external-plugins", () => loadExternalPlugins());
+  // Before the catalog is read, so a plugin that moved out of this repository is
+  // available in the same session rather than only after a restart. Placed here
+  // rather than in the CLI entry because `src/index.tsx` starts the app directly
+  // and would otherwise skip it.
+  if (!options.externalPlugins) {
+    await measurePerfAsync("startup.opentui.restore-plugins", restoreExtractedPlugins);
+  }
+
+  setPluginInstaller(async (ref) => {
+    try {
+      const { installPlugin } = await import("../../cli/commands/plugins");
+      await installPlugin(ref, { quiet: true });
+      return { ok: true };
+    } catch (error) {
+      return { ok: false, error: error instanceof Error ? error.message : String(error) };
+    }
+  });
+
+  const externalPlugins = options.externalPlugins ?? await measurePerfAsync("startup.opentui.load-external-plugins", () => loadExternalPlugins("tui"));
   let cliLaunchRequest = options.cliLaunchRequest ?? null;
   if (!options.skipCliDispatch && cliArgs.length > 0) {
     const dispatchResult = await dispatchCli(cliArgs, { externalPlugins });

package/src/renderers/opentui/test-utils.tsx

@@ -9,6 +9,15 @@ import { openTuiUiHost } from "./ui-host";
 import { OpenTuiDialogHostProvider } from "./dialog-host";
 import { openTuiToastHost } from "./toast-host";
 
+let lastSavedTextFile: { name: string; text: string } | null = null;
+
+/** Returns the most recent file written through the test renderer's `saveTextFile`. */
+export function takeSavedTextFile(): { name: string; text: string } | null {
+  const saved = lastSavedTextFile;
+  lastSavedTextFile = null;
+  return saved;
+}
+
 export function TestDialogProvider({ children }: { children: ReactNode }) {
   return (
     <OpenTuiDialogHostProvider
@@ -46,6 +55,10 @@ function OpenTuiTestProviders({ children }: { children: ReactNode }) {
     copyText: async () => {},
     readText: async () => "",
     notify: () => {},
+    saveTextFile: async ({ name, text }) => {
+      lastSavedTextFile = { name, text };
+      return `~/Downloads/${name}`;
+    },
   }), [renderer]);
   const nativeRenderer = useMemo(() => createTestNativeRendererHost(renderer), [renderer]);
 

package/src/renderers/opentui/toast-host.tsx

@@ -13,6 +13,10 @@ interface ToastRecord {
   options?: ToastOptions;
 }
 
+const MAX_VISIBLE_TOASTS = 4;
+/** Small buffer above the visible cap so a dismissal can reveal a recent toast. */
+const MAX_RETAINED_TOASTS = 8;
+
 let nextToastId = 1;
 let toasts: ToastRecord[] = [];
 const listeners = new Set<() => void>();
@@ -36,7 +40,16 @@ function dismissToast(id: string | number): void {
 
 function addToast(tone: ToastTone, body: string, options?: ToastOptions): number {
   const id = nextToastId++;
-  toasts = [...toasts, { id, body, tone, options }];
+  // Only the newest MAX_VISIBLE_TOASTS render, so anything past the cap is
+  // unreachable. Keeping it would let a dismissal resurface a stale toast.
+  const kept = [...toasts, { id, body, tone, options }].slice(-MAX_RETAINED_TOASTS);
+  for (const dropped of toasts) {
+    if (kept.some((toast) => toast.id === dropped.id)) continue;
+    const timer = timers.get(dropped.id);
+    if (timer) clearTimeout(timer);
+    timers.delete(dropped.id);
+  }
+  toasts = kept;
   publish();
   const duration = options?.duration ?? 4_000;
   if (Number.isFinite(duration) && duration > 0) {
@@ -89,7 +102,7 @@ function ToastViewport({ position = "bottom-right" }: { position?: string }) {
       flexDirection="column"
       gap={1}
     >
-      {visibleToasts.slice(-4).map((toast) => (
+      {visibleToasts.slice(-MAX_VISIBLE_TOASTS).map((toast) => (
         <box
           key={toast.id}
           width="100%"
@@ -115,6 +128,17 @@ function ToastViewport({ position = "bottom-right" }: { position?: string }) {
               {`[${toast.options.action.label}]`}
             </text>
           )}
+          {toast.options?.secondaryAction && (
+            <text
+              fg={colors.textMuted}
+              onMouseDown={(event) => {
+                event.stopPropagation();
+                toast.options?.secondaryAction?.onClick();
+              }}
+            >
+              {`[${toast.options.secondaryAction.label}]`}
+            </text>
+          )}
           <text
             fg={colors.textMuted}
             onMouseDown={(event) => {

package/src/renderers/opentui/ui-host.tsx

@@ -109,6 +109,7 @@ export const openTuiUiHost: UiHost = {
   kind: "opentui",
   capabilities: {
     nativeCharts: true,
+    publicSharing: true,
   },
   Box: OpenTuiBox as UiHost["Box"],
   Text: OpenTuiText as UiHost["Text"],