gloomberb 0.2.0 → 0.3.1

package/src/components/layout/header.tsx

@@ -0,0 +1,129 @@
+import { useState, useEffect } from "react";
+import { TextAttributes } from "@opentui/core";
+import "opentui-spinner/react";
+import { colors, priceColor } from "../../theme/colors";
+import { useAppActive } from "../../state/app-activity";
+import { useAppState } from "../../state/app-context";
+import { getSharedMarketDataCoordinator } from "../../market-data/coordinator";
+import { useQuoteEntry, useResolvedEntryValue } from "../../market-data/hooks";
+import { formatPercentRaw } from "../../utils/format";
+import { marketStateLabel, marketStateColor, getExtendedHoursInfo } from "../../utils/market-status";
+import { VERSION } from "../../version";
+
+const SPY_REFRESH_MS = 5 * 60_000; // 5 min
+
+function UpdateStatus() {
+  const { state } = useAppState();
+  const { updateAvailable, updateProgress } = state;
+
+  if (updateProgress) {
+    if (updateProgress.phase === "downloading") {
+      return (
+        <box flexDirection="row" gap={1}>
+          <spinner name="dots" color={colors.headerText} />
+          <text fg={colors.headerText}>
+            Downloading v{updateAvailable?.version}... {updateProgress.percent ?? 0}%
+          </text>
+        </box>
+      );
+    }
+    if (updateProgress.phase === "replacing") {
+      return (
+        <box flexDirection="row" gap={1}>
+          <spinner name="dots" color={colors.headerText} />
+          <text fg={colors.headerText}>Installing update...</text>
+        </box>
+      );
+    }
+    if (updateProgress.phase === "done") {
+      return <text fg={colors.headerText}>Update installed — restart to apply</text>;
+    }
+    if (updateProgress.phase === "error") {
+      return <text fg={colors.headerText}>Update failed: {updateProgress.error}</text>;
+    }
+  }
+
+  if (updateAvailable) {
+    if (updateAvailable.updateAction.kind === "manual") {
+      return (
+        <text fg={colors.headerText}>
+          v{updateAvailable.version} available — run {updateAvailable.updateAction.command}
+        </text>
+      );
+    }
+    return (
+      <text fg={colors.headerText}>
+        v{updateAvailable.version} available — press <span fg={colors.headerText}>u</span> to update
+      </text>
+    );
+  }
+
+  return null;
+}
+
+export function Header() {
+  const { state } = useAppState();
+  const appActive = useAppActive();
+  const spyQuoteEntry = useQuoteEntry("SPY", null);
+  const spyQuote = useResolvedEntryValue(spyQuoteEntry);
+
+  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 spyColor = spyQuote ? priceColor(spyQuote.change) : colors.headerText;
+  const spyText = spyQuote
+    ? `SPY ${spyQuote.price.toFixed(2)} ${formatPercentRaw(spyQuote.changePercent)}`
+    : "SPY —";
+
+  // Extended hours info
+  const extText = getExtendedHoursInfo(spyQuote);
+
+  // Market status
+  const mktState = spyQuote?.marketState;
+  const mktLabel = mktState ? marketStateLabel(mktState) : "";
+  const mktColor = mktState ? marketStateColor(mktState) : colors.headerText;
+
+  return (
+    <box
+      flexDirection="row"
+      height={1}
+      backgroundColor={colors.header}
+    >
+      <box paddingLeft={1}>
+        <text attributes={TextAttributes.BOLD} fg={colors.headerText}>
+          Gloomberb v{VERSION}
+        </text>
+      </box>
+      <box flexGrow={1} paddingLeft={2}>
+        <UpdateStatus />
+      </box>
+      {mktLabel && (
+        <box paddingRight={1}>
+          <text fg={mktColor}>{mktLabel}</text>
+        </box>
+      )}
+      <box paddingRight={extText ? 0 : 1}>
+        <text fg={spyColor}>{spyText}</text>
+      </box>
+      {extText && (
+        <box paddingRight={1} paddingLeft={1}>
+          <text fg={extText.color}>{extText.text}</text>
+        </box>
+      )}
+      <box paddingRight={1}>
+        <text fg={colors.headerText}>
+          {state.config.baseCurrency}
+        </text>
+      </box>
+    </box>
+  );
+}

package/src/components/layout/pane-header.tsx

@@ -0,0 +1,44 @@
+import { floatingPaneTitleBg, paneTitleBg, paneTitleText } from "../../theme/colors";
+
+export const PANE_HEADER_HEIGHT = 1;
+export const PANE_HEADER_GRIP = ":: ";
+export const PANE_HEADER_ACTION = " ... ";
+export const PANE_HEADER_CLOSE = " x ";
+
+interface PaneHeaderProps {
+  title: string;
+  width: number;
+  focused: boolean;
+  floating?: boolean;
+  showActions?: boolean;
+}
+
+function truncateTitle(title: string, maxWidth: number): string {
+  if (maxWidth <= 0) return "";
+  if (title.length <= maxWidth) return title;
+  if (maxWidth <= 2) return ".".repeat(maxWidth);
+  return `${title.slice(0, maxWidth - 2)}..`;
+}
+
+export function PaneHeader({
+  title,
+  width,
+  focused,
+  floating = false,
+  showActions = false,
+}: PaneHeaderProps) {
+  const backgroundColor = floating ? floatingPaneTitleBg(focused) : paneTitleBg(focused);
+  const actionText = showActions ? PANE_HEADER_ACTION : "     ";
+  const closeText = floating ? PANE_HEADER_CLOSE : "";
+  const titleWidth = Math.max(0, width - PANE_HEADER_GRIP.length - actionText.length - closeText.length);
+  const clippedTitle = truncateTitle(title, titleWidth);
+  const padding = " ".repeat(Math.max(0, titleWidth - clippedTitle.length));
+
+  return (
+    <box height={PANE_HEADER_HEIGHT} width={width} backgroundColor={backgroundColor} flexDirection="row">
+      <text fg={paneTitleText(focused, floating)} selectable={false}>
+        {`${PANE_HEADER_GRIP}${clippedTitle}${padding}${actionText}${closeText}`}
+      </text>
+    </box>
+  );
+}

package/src/components/layout/pane.tsx

@@ -0,0 +1,49 @@
+import type { ReactNode } from "react";
+import { paneBg } from "../../theme/colors";
+import { PaneHeader } from "./pane-header";
+
+interface PaneWrapperProps {
+  title?: string;
+  focused: boolean;
+  width?: number;
+  height?: number | `${number}%` | "auto";
+  flexGrow?: number;
+  showActions?: boolean;
+  onMouseDown?: (event: any) => void;
+  onMouseMove?: (event: any) => void;
+  children: ReactNode;
+}
+
+export function PaneWrapper({
+  title,
+  focused,
+  width = 0,
+  height,
+  flexGrow,
+  showActions = false,
+  onMouseDown,
+  onMouseMove,
+  children,
+}: PaneWrapperProps) {
+  const bg = paneBg(focused);
+
+  return (
+    <box
+      flexDirection="column"
+      width={width}
+      height={height}
+      flexGrow={flexGrow}
+      backgroundColor={bg}
+      overflow="hidden"
+      onMouseDown={onMouseDown}
+      onMouseMove={onMouseMove}
+    >
+      {title && (
+        <PaneHeader title={title} width={width} focused={focused} showActions={showActions} />
+      )}
+      <box flexGrow={1} overflow="hidden">
+        {children}
+      </box>
+    </box>
+  );
+}

package/src/components/layout/pixel-mouse-mode.test.ts

@@ -0,0 +1,122 @@
+import { afterEach, beforeEach, describe, expect, test } from "bun:test";
+import { CliRenderer } from "@opentui/core";
+
+const syncPixelMouseMode = (CliRenderer as any).prototype.syncPixelMouseMode as (this: any, force?: boolean) => void;
+const getMouseProtocolTrackingMode = (CliRenderer as any).prototype.getMouseProtocolTrackingMode as (this: any) => string;
+const buildMouseProtocolSequence = (CliRenderer as any).prototype.buildMouseProtocolSequence as (this: any, pixelEnabled: boolean) => string;
+const originalPixelMouseDisabledEnv = process.env.GLOOMBERB_DISABLE_PIXEL_MOUSE;
+
+function createRendererHarness(overrides: Record<string, unknown> = {}) {
+  const writes: string[] = [];
+  const protocolPatches: Array<Record<string, unknown>> = [];
+  const renderer = {
+    _useMouse: true,
+    _terminalWidth: 120,
+    _terminalHeight: 40,
+    _capabilities: { sgr_pixels: true },
+    _resolution: null,
+    _mouseProtocolSignature: "disabled",
+    _pixelMouseEnabled: false,
+    enableMouseMovement: false,
+    getMouseProtocolTrackingMode,
+    buildMouseProtocolSequence,
+    writeOut(sequence: string) {
+      writes.push(sequence);
+    },
+    updateStdinParserProtocolContext(patch: Record<string, unknown>) {
+      protocolPatches.push(patch);
+    },
+    ...overrides,
+  };
+
+  return { renderer, writes, protocolPatches };
+}
+
+describe("pixel mouse mode enablement", () => {
+  beforeEach(() => {
+    delete process.env.GLOOMBERB_DISABLE_PIXEL_MOUSE;
+  });
+
+  afterEach(() => {
+    if (originalPixelMouseDisabledEnv === undefined) {
+      delete process.env.GLOOMBERB_DISABLE_PIXEL_MOUSE;
+    } else {
+      process.env.GLOOMBERB_DISABLE_PIXEL_MOUSE = originalPixelMouseDisabledEnv;
+    }
+  });
+
+  test("stays in cell mode until pixel resolution is known", () => {
+    const { renderer, writes, protocolPatches } = createRendererHarness({
+      _resolution: null,
+    });
+
+    syncPixelMouseMode.call(renderer);
+
+    expect(writes).toEqual(["\x1B[?1005l\x1B[?1015l\x1B[?1006h\x1B[?1003l\x1B[?1002l\x1B[?1000h\x1B[?1016l"]);
+    expect((renderer as any)._mouseProtocolSignature).toBe("press:cell");
+    expect((renderer as any)._pixelMouseEnabled).toBe(false);
+    expect(protocolPatches.at(-1)).toMatchObject({
+      mouseUsesPixels: false,
+      mousePixelsConfirmed: false,
+      pixelWidth: 0,
+      pixelHeight: 0,
+    });
+  });
+
+  test("stays in cell mode when the terminal does not advertise sgr pixel support", () => {
+    const { renderer, writes, protocolPatches } = createRendererHarness({
+      _capabilities: { sgr_pixels: false },
+      _resolution: { width: 1440, height: 900 },
+    });
+
+    syncPixelMouseMode.call(renderer);
+
+    expect(writes).toEqual(["\x1B[?1005l\x1B[?1015l\x1B[?1006h\x1B[?1003l\x1B[?1002l\x1B[?1000h\x1B[?1016l"]);
+    expect((renderer as any)._mouseProtocolSignature).toBe("press:cell");
+    expect((renderer as any)._pixelMouseEnabled).toBe(false);
+    expect(protocolPatches.at(-1)).toMatchObject({
+      mouseUsesPixels: false,
+      mousePixelsConfirmed: false,
+      pixelWidth: 1440,
+      pixelHeight: 900,
+    });
+  });
+
+  test("enables pixel mouse by default after capability detection and pixel resolution are ready", () => {
+    const { renderer, writes, protocolPatches } = createRendererHarness({
+      _resolution: { width: 1440, height: 900 },
+    });
+
+    syncPixelMouseMode.call(renderer);
+
+    expect(writes).toEqual(["\x1B[?1005l\x1B[?1015l\x1B[?1006h\x1B[?1003l\x1B[?1002l\x1B[?1000h\x1B[?1016h"]);
+    expect((renderer as any)._mouseProtocolSignature).toBe("press:pixel");
+    expect((renderer as any)._pixelMouseEnabled).toBe(true);
+    expect(protocolPatches.at(-1)).toMatchObject({
+      mouseUsesPixels: true,
+      mousePixelsConfirmed: true,
+      pixelWidth: 1440,
+      pixelHeight: 900,
+    });
+  });
+
+  test("stays in cell mode when pixel mouse is explicitly disabled", () => {
+    process.env.GLOOMBERB_DISABLE_PIXEL_MOUSE = "1";
+
+    const { renderer, writes, protocolPatches } = createRendererHarness({
+      _resolution: { width: 1440, height: 900 },
+    });
+
+    syncPixelMouseMode.call(renderer);
+
+    expect(writes).toEqual(["\x1B[?1005l\x1B[?1015l\x1B[?1006h\x1B[?1003l\x1B[?1002l\x1B[?1000h\x1B[?1016l"]);
+    expect((renderer as any)._mouseProtocolSignature).toBe("press:cell");
+    expect((renderer as any)._pixelMouseEnabled).toBe(false);
+    expect(protocolPatches.at(-1)).toMatchObject({
+      mouseUsesPixels: false,
+      mousePixelsConfirmed: false,
+      pixelWidth: 1440,
+      pixelHeight: 900,
+    });
+  });
+});

package/src/components/layout/pixel-mouse.test.ts

@@ -0,0 +1,40 @@
+import { describe, expect, test } from "bun:test";
+import { MouseParser } from "@opentui/core";
+
+describe("pixel mouse projection", () => {
+  test("keeps bottom-row pixel clicks on the bottom terminal row", () => {
+    const parser = new MouseParser();
+    const event = parser.parseMouseEvent(
+      Buffer.from("\x1B[<0;101;565M"),
+      {
+        mouseUsesPixels: true,
+        mousePixelsConfirmed: true,
+        terminalWidth: 100,
+        terminalHeight: 24,
+        pixelWidth: 1000,
+        pixelHeight: 576,
+      },
+    );
+
+    expect(event).not.toBeNull();
+    expect(event?.y).toBe(23);
+  });
+
+  test("keeps second-last-row pixel clicks on the second-last terminal row", () => {
+    const parser = new MouseParser();
+    const event = parser.parseMouseEvent(
+      Buffer.from("\x1B[<0;101;541M"),
+      {
+        mouseUsesPixels: true,
+        mousePixelsConfirmed: true,
+        terminalWidth: 100,
+        terminalHeight: 24,
+        pixelWidth: 1000,
+        pixelHeight: 576,
+      },
+    );
+
+    expect(event).not.toBeNull();
+    expect(event?.y).toBe(22);
+  });
+});