gloomberb 0.11.2 → 0.12.0

package/src/components/layout/market-summary.ts

@@ -0,0 +1,109 @@
+import { useEffect, useState } from "react";
+import { priceColor } from "../../theme/colors";
+import { useThemeColors } from "../../theme/theme-context";
+import { useAppActive } from "../../state/app/activity";
+import { useAppSelector } from "../../state/app/context";
+import { selectBaseCurrency } from "../../state/selectors-ui";
+import { getSharedMarketDataCoordinator } from "../../market-data/coordinator";
+import { t } from "../../i18n";
+import { useQuoteEntry, useResolvedEntryValue } from "../../market-data/hooks";
+import { formatPercentRaw } from "../../utils/format";
+import { formatMarketPrice } from "../../market-data/market/format";
+import { getActiveQuoteDisplay, marketStateColor, marketStateCountdown, marketStateLabel } from "../../market-data/market/status";
+
+const SPY_REFRESH_MS = 5 * 60_000; // 5 min
+
+export interface MarketSummary {
+  baseCurrency: string;
+  marketColor: string;
+  /** Market state with its countdown, when the state has one. */
+  marketLabel: string;
+  /** Market state alone, for a header too narrow for the countdown. */
+  marketLabelShort: string;
+  spyColor: string;
+  spyText: string;
+}
+
+export interface MarketSummaryFit {
+  showBaseCurrency: boolean;
+  showCountdown: boolean;
+  showState: boolean;
+  showSpy: boolean;
+}
+
+/**
+ * Picks which parts of the cluster survive at a given width, ordered by how
+ * much each can still change: SPY first, then the market-state label, then the
+ * base currency, then the countdown suffix that widens the label. A narrowing
+ * header therefore sheds the countdown, then the currency, then the state, and
+ * keeps SPY longest. `countdownWidth` is what the suffix adds to the label.
+ */
+export function resolveMarketSummaryFit(options: {
+  available: number;
+  baseCurrencyWidth: number;
+  countdownWidth: number;
+  spyWidth: number;
+  stateWidth: number;
+}): MarketSummaryFit {
+  let remaining = options.available;
+  const take = (width: number): boolean => {
+    if (width <= 0 || width > remaining) return false;
+    remaining -= width;
+    return true;
+  };
+  const showSpy = take(options.spyWidth);
+  const showState = take(options.stateWidth);
+  const showBaseCurrency = take(options.baseCurrencyWidth);
+  const showCountdown = showState && take(options.countdownWidth);
+  return { showBaseCurrency, showCountdown, showState, showSpy };
+}
+
+export function useMarketSummary(): MarketSummary {
+  const colors = useThemeColors();
+  const appActive = useAppActive();
+  const baseCurrency = useAppSelector(selectBaseCurrency);
+  const spyQuoteEntry = useQuoteEntry("SPY", null);
+  const spyQuote = useResolvedEntryValue(spyQuoteEntry);
+  const mktState = spyQuote?.marketState;
+  const [now, setNow] = useState(Date.now());
+
+  useEffect(() => {
+    if (!appActive || (mktState !== "PRE" && mktState !== "REGULAR")) return;
+    setNow(Date.now());
+    const id = setInterval(() => setNow(Date.now()), 1_000);
+    return () => clearInterval(id);
+  }, [appActive, mktState]);
+
+  useEffect(() => {
+    if (!appActive) return;
+    const coordinator = getSharedMarketDataCoordinator();
+    if (!coordinator) return;
+    const fetchSpy = async () => {
+      await coordinator.loadQuote({ symbol: "SPY" }).catch(() => {});
+    };
+    fetchSpy();
+    const id = setInterval(fetchSpy, SPY_REFRESH_MS);
+    return () => { clearInterval(id); };
+  }, [appActive]);
+
+  const activeSpyQuote = getActiveQuoteDisplay(spyQuote);
+  const spyColor = activeSpyQuote ? priceColor(activeSpyQuote.change, colors) : colors.textDim;
+  const spyText = activeSpyQuote
+    ? `SPY ${formatMarketPrice(activeSpyQuote.price, { assetCategory: "ETF" })} ${formatPercentRaw(activeSpyQuote.changePercent)}`
+    : "SPY —";
+
+  const mktCountdown = mktState ? marketStateCountdown(mktState, now) : null;
+  const marketLabelShort = mktState ? t(marketStateLabel(mktState)) : "";
+  const marketLabel = marketLabelShort && mktCountdown
+    ? `${marketLabelShort} · ${mktCountdown}`
+    : marketLabelShort;
+
+  return {
+    baseCurrency,
+    marketColor: mktState ? marketStateColor(mktState, colors) : colors.textDim,
+    marketLabel,
+    marketLabelShort,
+    spyColor,
+    spyText,
+  };
+}

package/src/components/layout/shell/chrome.ts

@@ -1,8 +1,103 @@
-import { TITLEBAR_OVERLAY_HEIGHT_PX } from "../titlebar-overlay";
+import { TITLEBAR_OVERLAY_HEIGHT_PX, getTitlebarLeadingInset } from "../titlebar-overlay";
 
 export const DEFAULT_HEADER_HEIGHT = 1;
 
+const HEADER_PROMPT_MIN_WIDTH = 10;
+/** Columns the header keeps free right of the prompt for the update status. */
+const HEADER_PROMPT_UPDATE_COLUMNS = 14;
+/**
+ * Width the prompt holds before the market cluster is offered anything. Above
+ * the command surface minimum so a mid-size window does not hand the cluster a
+ * whole tier and leave the sheet sitting on its floor.
+ */
+const HEADER_PROMPT_COMFORT_WIDTH = 48;
+/** Narrowest command surface, by host: a document snippet still reads here. */
+const COMMAND_SURFACE_MIN_WIDTH = { native: 46, terminal: 42 };
+
+/**
+ * The market cluster's reserve at the header's right edge, widest first. Each
+ * step is the worst case for what it shows, so a ticking countdown or a longer
+ * state label can never push the cluster past its columns:
+ *
+ *   42  PRE-MKT · 5h 30m  SPY 1,234.56 -10.60%  USD
+ *   31  the state label and SPY
+ *   21  SPY alone
+ *
+ * Steps rather than a share of the window: a reserve of, say, 18 columns is
+ * too narrow for anything and would waste all 18. There is deliberately no
+ * step for "everything but the countdown", which would cost the sheet eleven
+ * columns to add the base currency, the one value here that barely moves.
+ */
+const HEADER_MARKET_TIERS = [42, 31, 21] as const;
+
+/**
+ * Update status is transient, so on a narrow header it gives most of its
+ * reserve back rather than shortening the placeholder that has to sell the
+ * command bar to a first-time user.
+ */
+function headerPromptUpdateColumns(termWidth: number): number {
+  return Math.min(HEADER_PROMPT_UPDATE_COLUMNS, Math.max(4, Math.floor(termWidth * 0.12)));
+}
+
+/**
+ * Columns the market cluster gets, from the terminal width alone: a reserve
+ * that tracked the quote would resize the prompt every time SPY ticked.
+ */
+function headerMarketColumns(termWidth: number, left: number, updateColumns: number): number {
+  const spare = termWidth - left - updateColumns - HEADER_PROMPT_COMFORT_WIDTH;
+  return HEADER_MARKET_TIERS.find((tier) => tier <= spare) ?? 0;
+}
+
 export function resolveAppHeaderHeightCells(options: { titleBarOverlay?: boolean; cellHeightPx?: number }): number {
   if (!options.titleBarOverlay || !options.cellHeightPx || options.cellHeightPx <= 0) return DEFAULT_HEADER_HEIGHT;
   return TITLEBAR_OVERLAY_HEIGHT_PX / options.cellHeightPx;
 }
+
+/**
+ * Width shared by the header prompt and the command sheet that drops out of
+ * it, so the sheet reads as the prompt expanding downward. A fraction of the
+ * window so the update status and the Help pill keep their place, capped where
+ * a document snippet still has room but a label does not run past where the
+ * eye goes.
+ */
+export function resolveCommandSurfaceWidth(options: { termWidth: number; nativePaneChrome?: boolean }): number {
+  const { termWidth } = options;
+  return options.nativePaneChrome
+    ? Math.max(COMMAND_SURFACE_MIN_WIDTH.native, Math.min(104, termWidth - 10, Math.floor(termWidth * 0.64)))
+    : Math.max(COMMAND_SURFACE_MIN_WIDTH.terminal, Math.min(96, termWidth - 8, Math.floor(termWidth * 0.68)));
+}
+
+export interface HeaderPromptGeometry {
+  /** Column the prompt starts at. */
+  left: number;
+  width: number;
+  /** Columns held at the header's right edge for the market cluster. */
+  marketColumns: number;
+}
+
+/**
+ * Geometry of the always-visible command prompt in the header. While the
+ * command bar is open the same prompt hosts its input, so the geometry never
+ * changes underneath the user.
+ */
+export function resolveHeaderPromptGeometry(options: {
+  termWidth: number;
+  nativePaneChrome?: boolean;
+  nativeWindowChrome?: boolean;
+  titleBarOverlay?: boolean;
+}): HeaderPromptGeometry {
+  const { nativePaneChrome, termWidth, titleBarOverlay } = options;
+  const nativeWindowChrome = options.nativeWindowChrome ?? titleBarOverlay;
+  const leadingInset = titleBarOverlay && nativeWindowChrome ? getTitlebarLeadingInset() : 0;
+  const left = leadingInset + 1;
+  const updateColumns = headerPromptUpdateColumns(termWidth);
+  const marketColumns = headerMarketColumns(termWidth, left, updateColumns);
+  const width = Math.max(
+    HEADER_PROMPT_MIN_WIDTH,
+    Math.min(
+      resolveCommandSurfaceWidth({ nativePaneChrome, termWidth }),
+      termWidth - left - updateColumns - marketColumns,
+    ),
+  );
+  return { left, width, marketColumns };
+}

package/src/components/layout/shell/index.tsx

@@ -30,9 +30,10 @@ import {
   selectStatusBarVisible,
 } from "../../../state/selectors-ui";
 import { useThemeColors } from "../../../theme/theme-context";
+import { tf } from "../../../i18n";
 import { getPaneDisplayTitle } from "../pane/title";
 import type { PaneHeaderQuickSetting } from "../pane/header";
-import { getShortcutDisplayMode } from "../../../utils/shortcut-labels";
+import { formatCommandBarShortcut, getShortcutDisplayMode } from "../../../utils/shortcut-labels";
 import {
   actionMenuWidth,
   menuForPane,
@@ -257,10 +258,13 @@ export function Shell({
   });
 
   const {
+    canExportPaneCsv,
     closeAllFloatingPanes,
     closeFocusedPane,
     copyFocusedPaneScreenshot,
     copyPaneScreenshot,
+    exportFocusedPaneCsv,
+    exportPaneCsv,
     gridlockVisiblePanes,
     handleFloatingClose,
     openFocusedPaneSettings,
@@ -474,6 +478,7 @@ export function Shell({
     closeAllFloatingPanes,
     closeFocusedPane,
     copyFocusedPaneScreenshot,
+    exportFocusedPaneCsv,
     focusedPaneId,
     gridlockVisiblePanes,
     hasActiveDrag,
@@ -526,6 +531,7 @@ export function Shell({
         state: titleState,
         persistLayout,
       }),
+      canExportPaneCsv(paneId) ? exportPaneCsv : undefined,
     );
     void showContextMenu(context, items, event).then((shown) => {
       if (shown) return;
@@ -549,7 +555,7 @@ export function Shell({
         items: fallbackItems,
       });
     });
-  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, paneState, persistLayout, pluginRegistry, publicSharing, rendererHost.copyPngImage, sharePane, shortcutDisplayMode, showContextMenu, titleState, visibleLayout, width]);
+  }, [canExportPaneCsv, contentHeight, copyPaneScreenshot, desktopWindowBridge, exportPaneCsv, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, paneState, persistLayout, pluginRegistry, publicSharing, rendererHost.copyPngImage, sharePane, shortcutDisplayMode, showContextMenu, titleState, visibleLayout, width]);
 
   const {
     handleFloatingCloseMouseDown,
@@ -632,7 +638,9 @@ export function Shell({
         <Box flexDirection="column" alignItems="center">
           <AsciiText text="Gloomberb" font="wordmark" color={colors.textMuted} />
           <Box height={1} />
-          <Text fg={colors.textDim}>Ctrl+P to get started.</Text>
+          <Text fg={colors.textDim}>
+            {tf("{shortcut} to get started.", { shortcut: formatCommandBarShortcut(shortcutDisplayMode) })}
+          </Text>
         </Box>
       </Box>
 

package/src/components/layout/shell/menu.ts

@@ -34,6 +34,7 @@ export function menuForPane(
   copyPaneScreenshot?: (paneId: string) => void | Promise<void>,
   sharePane?: () => void | Promise<void>,
   linkItems: ContextMenuItem[] = [],
+  exportPaneCsv?: (paneId: string) => void | Promise<void>,
 ): ContextMenuItem[] {
   const baseActions: ContextMenuItem[] = [];
   if (pluginRegistry.hasPaneSettings(pane.instance.instanceId)) {
@@ -60,6 +61,14 @@ export function menuForPane(
       onSelect: () => copyPaneScreenshot(pane.instance.instanceId),
     });
   }
+  if (exportPaneCsv) {
+    baseActions.push({
+      id: "export-csv",
+      label: "Export CSV",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.exportCsv,
+      onSelect: () => exportPaneCsv(pane.instance.instanceId),
+    });
+  }
 
   if (pane.floating) {
     baseActions.push({

package/src/components/layout/shell/pane/actions.ts

@@ -13,6 +13,10 @@ import type { PluginRegistry } from "../../../../plugins/registry";
 import type { LayoutConfig } from "../../../../types/config";
 import type { RendererHost } from "../../../../ui";
 import { capturePaneScreenshotPngBase64 } from "../../../../utils/dom-screenshot";
+import {
+  exportPaneTableCsv,
+  hasPaneTableExporter,
+} from "../../../../state/pane-table-export-registry";
 
 function removedFocusRestoreOptions(
   layout: LayoutConfig,
@@ -75,6 +79,28 @@ export function useShellPaneActions({
     }
   }, [closePaneMenu, pluginRegistry, rendererHost]);
 
+  const canExportPaneCsv = useCallback((paneId: string) => {
+    const pane = paneMap.get(paneId);
+    return pane?.def.tableExport === true && hasPaneTableExporter(paneId);
+  }, [paneMap]);
+
+  const exportPaneCsv = useCallback(async (paneId: string) => {
+    closePaneMenu();
+    const pane = paneMap.get(paneId);
+    if (!pane) return;
+    await exportPaneTableCsv(
+      paneId,
+      pane.instance.title ?? pane.def.name,
+      pluginRegistry.notify,
+    );
+  }, [closePaneMenu, paneMap, pluginRegistry]);
+
+  const exportFocusedPaneCsv = useCallback(() => {
+    if (!focusedPaneId || !canExportPaneCsv(focusedPaneId)) return false;
+    void exportPaneCsv(focusedPaneId);
+    return true;
+  }, [canExportPaneCsv, exportPaneCsv, focusedPaneId]);
+
   const closeFocusedPane = useCallback(() => {
     if (!focusedPaneId || !isPaneInLayout(visibleLayout, focusedPaneId)) return false;
     const nextLayout = removePane(visibleLayout, focusedPaneId);
@@ -132,10 +158,13 @@ export function useShellPaneActions({
   }, [focusedPaneId, persistLayout, previousFocusedPaneId, visibleLayout]);
 
   return {
+    canExportPaneCsv,
     closeAllFloatingPanes,
     closeFocusedPane,
     copyFocusedPaneScreenshot,
     copyPaneScreenshot,
+    exportFocusedPaneCsv,
+    exportPaneCsv,
     gridlockVisiblePanes,
     handleFloatingClose,
     openFocusedPaneSettings,

package/src/components/layout/shell/pane/management-shortcuts.ts

@@ -16,6 +16,7 @@ interface ShellPaneManagementShortcutOptions {
   closeAllFloatingPanes(): boolean;
   closeFocusedPane(): boolean;
   copyFocusedPaneScreenshot(): boolean;
+  exportFocusedPaneCsv(): boolean;
   focusedPaneId: string | null;
   gridlockVisiblePanes(): boolean;
   hasActiveDrag(): boolean;
@@ -35,6 +36,7 @@ export function useShellPaneManagementShortcuts({
   closeAllFloatingPanes,
   closeFocusedPane,
   copyFocusedPaneScreenshot,
+  exportFocusedPaneCsv,
   focusedPaneId,
   gridlockVisiblePanes,
   hasActiveDrag,
@@ -121,6 +123,9 @@ export function useShellPaneManagementShortcuts({
       case "copy-screenshot":
         handled = copyFocusedPaneScreenshot();
         break;
+      case "export-csv":
+        handled = exportFocusedPaneCsv();
+        break;
       case "share":
         handled = shareFocusedPane();
         break;

package/src/components/layout/shell/shortcuts.ts

@@ -6,6 +6,7 @@ export const PANE_MANAGEMENT_ACCELERATORS = {
   toggleFloating: "CmdOrCtrl+Shift+D",
   popOut: "CmdOrCtrl+Shift+O",
   copyScreenshot: "CmdOrCtrl+Shift+C",
+  exportCsv: "CmdOrCtrl+Shift+E",
   share: "CmdOrCtrl+Shift+S",
   close: "CmdOrCtrl+W",
   closeAllFloating: "CmdOrCtrl+Alt+W",
@@ -21,6 +22,7 @@ export type PaneManagementShortcut =
   | "toggle-floating"
   | "pop-out"
   | "copy-screenshot"
+  | "export-csv"
   | "share"
   | "close"
   | "close-all-floating"
@@ -41,6 +43,7 @@ export function resolvePaneManagementShortcut(
   if (!shifted && name === ",") return "settings";
   if (!shifted || event.alt) return null;
   if (name === "c") return "copy-screenshot";
+  if (name === "e") return "export-csv";
   if (name === "s") return "share";
   if (name === "d") return "toggle-floating";
   if (name === "f") return "toggle-fullscreen";

package/src/components/layout/status-bar.test.tsx

@@ -4,6 +4,7 @@ import { AppContext, createInitialState } from "../../state/app/context";
 import { cloneLayout, createDefaultConfig, createPaneInstance, type LayoutConfig } from "../../types/config";
 import type { AppNotificationRequest } from "../../types/plugin";
 import { StatusBar } from "./status-bar";
+import { VERSION } from "../../version";
 import { getDockedPaneIds } from "../../plugins/pane-manager";
 import { setSharedRegistryForTests } from "../../plugins/registry";
 import { act, useEffect, useState } from "react";
@@ -51,18 +52,18 @@ describe("StatusBar", () => {
     return null;
   }
 
-  test("opens the command bar from the shortcut hint", async () => {
+  test("opens the current version changelog from the version chip", async () => {
     const config = createDefaultConfig("/tmp/gloomberb-test");
     config.layouts = [{ name: "Home", layout: cloneLayout(config.layout) }];
     const state = {
       ...createInitialState(config),
       statusBarVisible: true,
     };
-    const actions: Array<{ type: string; open?: boolean; query?: string }> = [];
+    let openedVersion = "";
 
     testSetup = await testRender(
-      <AppContext value={{ state, dispatch: (action) => actions.push(action as { type: string; open?: boolean; query?: string }) }}>
-        <StatusBar />
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <StatusBar onOpenChangelog={(version) => { openedVersion = version; }} />
       </AppContext>,
       { width: 120, height: 1 },
     );
@@ -70,13 +71,13 @@ describe("StatusBar", () => {
     await testSetup.renderOnce();
 
     const frame = testSetup.captureCharFrame();
-    const hintX = frame.split("\n")[0]?.indexOf("Ctrl+P") ?? -1;
-    expect(hintX).toBeGreaterThanOrEqual(0);
+    const versionX = frame.split("\n")[0]?.indexOf(`v${VERSION}`) ?? -1;
+    expect(versionX).toBeGreaterThanOrEqual(0);
 
-    await testSetup.mockMouse.click(hintX + 1, 0);
+    await testSetup.mockMouse.click(versionX + 1, 0);
     await testSetup.renderOnce();
 
-    expect(actions).toContainEqual({ type: "SET_COMMAND_BAR", open: true, query: "" });
+    expect(openedVersion).toBe(VERSION);
   });
 
   test("shows a transient focus layout tab without replacing saved layouts", async () => {