gloomberb 0.5.1 → 0.6.0

package/src/components/ui/ui.test.tsx

@@ -1,17 +1,22 @@
 import { afterEach, describe, expect, test } from "bun:test";
 import { act, useEffect, useRef, useState } from "react";
-import { testRender } from "@opentui/react/test-utils";
+import { testRender } from "../../renderers/opentui/test-utils";
 import { DialogProvider } from "@opentui-ui/dialog/react";
 import type { BoxRenderable, ScrollBoxRenderable } from "@opentui/core";
 import { Button } from "./button";
+import { ChoiceDialog } from "./choice-dialog";
 import { DataTable } from "./data-table";
 import { TextField } from "./fields";
 import { ListView } from "./list-view";
-import { MultiSelectChips } from "./multi-select-chips";
 import { MultiSelectDialogButton } from "./multi-select-dialog";
-import { toggleMultiSelectValue } from "./multi-select";
-import { ProgressBar } from "./loading";
-import { Notice } from "./status";
+import {
+  getMultiSelectDisplayValues,
+  moveMultiSelectDisplayValue,
+  normalizeOrderedMultiSelectValues,
+  orderMultiSelectOptionsForDisplay,
+  toggleMultiSelectValue,
+  toggleOrderedMultiSelectValue,
+} from "./multi-select";
 import { Tabs } from "./tabs";
 import { ToggleList } from "../toggle-list";
 import { AppContext, PaneInstanceProvider, createInitialState } from "../../state/app-context";
@@ -21,8 +26,10 @@ let testSetup: Awaited<ReturnType<typeof testRender>> | undefined;
 let setListSelection: ((index: number) => void) | null = null;
 let selectedTableRow: string | null = null;
 let activatedTableRow: string | null = null;
-let selectedChips: string[] = [];
 let tableHorizontalScrollbarVisible: boolean | null = null;
+let closedTab: string | null = null;
+let addedTab = false;
+let resolvedChoice: string | null = null;
 
 function ScrollableListHarness() {
   const [selectedIndex, setSelectedIndex] = useState(0);
@@ -150,20 +157,33 @@ function DataTableNoHorizontalScrollHarness() {
   );
 }
 
-function MultiSelectChipsHarness() {
-  const [values, setValues] = useState(["sma"]);
-  selectedChips = values;
+function DataTableVirtualizationHarness() {
+  const headerScrollRef = useRef<ScrollBoxRenderable>(null);
+  const scrollRef = useRef<ScrollBoxRenderable>(null);
+  const [hoveredIdx, setHoveredIdx] = useState<number | null>(null);
+  const rows = Array.from({ length: 100 }, (_, index) => ({
+    id: `row-${index}`,
+    name: `Row ${index}`,
+  }));
 
   return (
-    <MultiSelectChips
-      label="IND"
-      selectedValues={values}
-      onChange={setValues}
-      idPrefix="indicator-chip"
-      options={[
-        { value: "sma", label: "SMA" },
-        { value: "ema", label: "EMA" },
-      ]}
+    <DataTable
+      columns={[{ id: "name", label: "NAME", width: 12, align: "left" }]}
+      items={rows}
+      sortColumnId={null}
+      sortDirection="asc"
+      onHeaderClick={() => {}}
+      headerScrollRef={headerScrollRef}
+      scrollRef={scrollRef}
+      syncHeaderScroll={() => {}}
+      onBodyScrollActivity={() => {}}
+      hoveredIdx={hoveredIdx}
+      setHoveredIdx={setHoveredIdx}
+      getItemKey={(row) => row.id}
+      isSelected={() => false}
+      onSelect={() => {}}
+      renderCell={(row) => ({ text: row.name })}
+      emptyStateTitle="No rows."
     />
   );
 }
@@ -188,6 +208,43 @@ function MultiSelectDialogButtonHarness() {
   );
 }
 
+function ChoiceDialogHarness() {
+  return (
+    <ChoiceDialog
+      title="Choose Account"
+      dismiss={() => {}}
+      resolve={(value) => {
+        resolvedChoice = value;
+      }}
+      choices={[
+        { id: "alpha", label: "Alpha", description: "Alpha account" },
+        { id: "beta", label: "Beta", description: "Beta account" },
+        { id: "gamma", label: "Gamma", description: "Gamma account" },
+      ]}
+    />
+  );
+}
+
+async function emitKeypress(event: { name?: string; sequence?: string }) {
+  await act(async () => {
+    testSetup!.renderer.keyInput.emit("keypress", {
+      ctrl: false,
+      meta: false,
+      option: false,
+      shift: false,
+      eventType: "press",
+      repeated: false,
+      preventDefault: () => {},
+      stopPropagation: () => {},
+      ...event,
+    } as any);
+    await Promise.resolve();
+    await testSetup!.renderOnce();
+    await testSetup!.renderOnce();
+  });
+  await testSetup!.renderOnce();
+}
+
 afterEach(() => {
   if (testSetup) {
     testSetup.renderer.destroy();
@@ -196,12 +253,14 @@ afterEach(() => {
   setListSelection = null;
   selectedTableRow = null;
   activatedTableRow = null;
-  selectedChips = [];
   tableHorizontalScrollbarVisible = null;
+  closedTab = null;
+  addedTab = false;
+  resolvedChoice = null;
 });
 
 describe("shared UI kit", () => {
-  test("renders navigation and feedback primitives", async () => {
+  test("renders navigation and button primitives", async () => {
     testSetup = await testRender(
       <box flexDirection="column">
         <Tabs
@@ -214,12 +273,8 @@ describe("shared UI kit", () => {
         />
         <box height={1} />
         <Button label="Save" variant="primary" shortcut="⌘S" onPress={() => {}} />
-        <box height={1} />
-        <ProgressBar value={0.5} width={8} label="Syncing" />
-        <box height={1} />
-        <Notice title="Connected" message="Broker session is live" tone="success" />
       </box>,
-      { width: 40, height: 10 },
+      { width: 40, height: 6 },
     );
 
     await testSetup.renderOnce();
@@ -227,57 +282,126 @@ describe("shared UI kit", () => {
     const frame = testSetup.captureCharFrame();
     expect(frame).toContain("Overview");
     expect(frame).toContain("Save");
-    expect(frame).toContain("Syncing");
-    expect(frame).toContain("Connected");
   });
 
-  test("renders toggle lists with selection and descriptions", async () => {
+  test("scrolls overflowing tabs horizontally with the mouse wheel", async () => {
     testSetup = await testRender(
-      <ToggleList
-        items={[
-          { id: "news", label: "News", enabled: true, description: "Headlines and previews" },
-          { id: "notes", label: "Notes", enabled: false, description: "Ticker notes" },
+      <Tabs
+        tabs={[
+          { label: "Overview", value: "overview" },
+          { label: "Financials", value: "financials" },
+          { label: "Chart", value: "chart" },
+          { label: "Options", value: "options" },
+          { label: "Insider", value: "insider" },
         ]}
-        selectedIdx={0}
+        activeValue="overview"
         onSelect={() => {}}
-        onToggle={() => {}}
       />,
-      { width: 40, height: 6 },
+      { width: 24, height: 4 },
     );
 
-    await testSetup.renderOnce();
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
 
-    const frame = testSetup.captureCharFrame();
-    expect(frame).toContain("[✓] News");
-    expect(frame).toContain("Notes");
-    expect(frame).toContain("Headlines and previews");
+    let frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Overview");
+    expect(frame).not.toContain("Insider");
+
+    await act(async () => {
+      for (let i = 0; i < 40; i++) {
+        await testSetup!.mockMouse.scroll(1, 0, "down");
+      }
+      await testSetup!.renderOnce();
+    });
+
+    frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Options");
+    expect(frame).toContain("Insider");
   });
 
-  test("toggles multi-select chips with the mouse", async () => {
-    testSetup = await testRender(<MultiSelectChipsHarness />, { width: 32, height: 3 });
+  test("renders tab actions for editable tab sets", async () => {
+    testSetup = await testRender(
+      <Tabs
+        tabs={[
+          { label: "One", value: "one", onClose: (value) => { closedTab = value; } },
+          { label: "Two", value: "two" },
+        ]}
+        activeValue="one"
+        onSelect={() => {}}
+        compact
+        variant="pill"
+        closeMode="active"
+        onAdd={() => { addedTab = true; }}
+      />,
+      { width: 24, height: 3 },
+    );
 
     await act(async () => {
       await testSetup!.renderOnce();
     });
 
-    let frame = testSetup.captureCharFrame();
-    expect(frame).toContain("[x] SMA");
-    expect(frame).toContain("[ ] EMA");
-    const emaChip = testSetup.renderer.root.findDescendantById("indicator-chip:ema") as BoxRenderable | undefined;
-    expect(emaChip).toBeDefined();
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("One x");
+    expect(frame).toContain("+");
 
     await act(async () => {
-      await testSetup!.mockMouse.click(emaChip!.x + 1, emaChip!.y);
+      await testSetup!.mockMouse.click(5, 0);
+      await testSetup!.renderOnce();
     });
-    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(closedTab).toBe("one");
+
     await act(async () => {
+      await testSetup!.mockMouse.click(14, 0);
       await testSetup!.renderOnce();
     });
+    expect(addedTab).toBe(true);
+  });
 
-    frame = testSetup.captureCharFrame();
-    expect(frame).toContain("[x] SMA");
-    expect(frame).toContain("[x] EMA");
-    expect(selectedChips).toEqual(["sma", "ema"]);
+  test("renders default tabs in one row", async () => {
+    testSetup = await testRender(
+      <box flexDirection="column">
+        <Tabs
+          tabs={[
+            { label: "Overview", value: "overview" },
+            { label: "Chart", value: "chart" },
+          ]}
+          activeValue="chart"
+          onSelect={() => {}}
+        />
+        <text>After tabs</text>
+      </box>,
+      { width: 32, height: 3 },
+    );
+
+    await testSetup.renderOnce();
+
+    const lines = testSetup.captureCharFrame().split("\n");
+    expect(lines[0]).toContain("Overview");
+    expect(lines[0]).toContain("Chart");
+    expect(lines[1]).toContain("After tabs");
+  });
+
+  test("renders toggle lists with selection and descriptions", async () => {
+    testSetup = await testRender(
+      <ToggleList
+        items={[
+          { id: "news", label: "News", enabled: true, description: "Headlines and previews" },
+          { id: "notes", label: "Notes", enabled: false, description: "Ticker notes" },
+        ]}
+        selectedIdx={0}
+        onSelect={() => {}}
+        onToggle={() => {}}
+      />,
+      { width: 40, height: 6 },
+    );
+
+    await testSetup.renderOnce();
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("[✓] News");
+    expect(frame).toContain("Notes");
+    expect(frame).toContain("Headlines and previews");
   });
 
   test("opens compact multi-select dialogs from a button", async () => {
@@ -316,6 +440,57 @@ describe("shared UI kit", () => {
     expect(frame).not.toContain("Chart Indicators");
   });
 
+  test("supports keyboard and pointer selection in choice dialogs", async () => {
+    testSetup = await testRender(<ChoiceDialogHarness />, { width: 44, height: 10 });
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+
+    let frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Alpha account");
+
+    await emitKeypress({ name: "down" });
+    frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Beta account");
+
+    await emitKeypress({ name: "k", sequence: "k" });
+    frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Alpha account");
+
+    await emitKeypress({ name: "j", sequence: "j" });
+    await emitKeypress({ name: "enter", sequence: "\r" });
+    expect(resolvedChoice).toBe("beta");
+
+    const gammaRow = testSetup.captureCharFrame().split("\n").findIndex((line) => line.includes("Gamma"));
+    expect(gammaRow).toBeGreaterThanOrEqual(0);
+
+    await act(async () => {
+      await testSetup!.mockMouse.moveTo(2, gammaRow);
+      await testSetup!.renderOnce();
+    });
+    await testSetup.renderOnce();
+    frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Gamma account");
+
+    await act(async () => {
+      await testSetup!.mockMouse.click(2, gammaRow);
+      await testSetup!.renderOnce();
+    });
+    expect(resolvedChoice).toBe("gamma");
+  });
+
+  test("cancels choice dialogs with escape", async () => {
+    testSetup = await testRender(<ChoiceDialogHarness />, { width: 44, height: 10 });
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+    await emitKeypress({ name: "escape", sequence: "\u001b" });
+
+    expect(resolvedChoice).toBe("");
+  });
+
   test("keeps shared multi-select values in option order when toggling", () => {
     const options = [
       { value: "sma", label: "SMA" },
@@ -326,6 +501,24 @@ describe("shared UI kit", () => {
     expect(toggleMultiSelectValue(options, ["sma", "ema"], "sma")).toEqual(["ema"]);
   });
 
+  test("keeps ordered multi-select values in user order", () => {
+    const options = [
+      { value: "market", label: "MARKET" },
+      { value: "target", label: "TARGET" },
+      { value: "venue", label: "VENUE" },
+      { value: "odds", label: "TOP ODDS" },
+    ];
+
+    expect(normalizeOrderedMultiSelectValues(options, ["venue", "market"])).toEqual(["venue", "market"]);
+    expect(toggleOrderedMultiSelectValue(options, ["venue", "market"], "target")).toEqual(["venue", "market", "target"]);
+
+    const displayValues = getMultiSelectDisplayValues(options, ["venue", "market", "target"], true);
+    expect(orderMultiSelectOptionsForDisplay(options, displayValues).map((option) => option.value))
+      .toEqual(["venue", "market", "target", "odds"]);
+    expect(moveMultiSelectDisplayValue(displayValues, ["venue", "market", "target"], "market", "up"))
+      .toEqual(["market", "venue", "target", "odds"]);
+  });
+
   test("auto-scrolls a scrollable list to keep the selected row visible", async () => {
     testSetup = await testRender(
       <ScrollableListHarness />,
@@ -473,4 +666,24 @@ describe("shared UI kit", () => {
 
     expect(tableHorizontalScrollbarVisible).toBe(false);
   });
+
+  test("virtualizes data table rows by default", async () => {
+    const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <PaneInstanceProvider paneId="portfolio-list:main">
+          <DataTableVirtualizationHarness />
+        </PaneInstanceProvider>
+      </AppContext>,
+      { width: 32, height: 6 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Row 0");
+    expect(frame).not.toContain("Row 99");
+  });
 });

package/src/components/use-double-click-activation.ts

@@ -4,6 +4,10 @@ interface LastClickState {
   targetKey: string;
 }
 
+interface ClickEventLike {
+  detail?: number;
+}
+
 export function useDoubleClickActivation<T>({
   onSelect,
   onActivate,
@@ -13,12 +17,13 @@ export function useDoubleClickActivation<T>({
 }) {
   const lastClickRef = useRef<LastClickState | null>(null);
 
-  return useCallback((targetKey: string, value: T) => {
+  return useCallback((targetKey: string, value: T, event?: ClickEventLike) => {
     const lastClick = lastClickRef.current;
 
     onSelect?.(value);
 
-    if (lastClick && lastClick.targetKey === targetKey) {
+    if ((typeof event?.detail === "number" && event.detail >= 2)
+        || (lastClick && lastClick.targetKey === targetKey)) {
       lastClickRef.current = null;
       onActivate?.(value);
       return;

package/src/components/use-external-link-footer.ts

@@ -0,0 +1,79 @@
+import { useCallback, useMemo } from "react";
+import { useShortcut } from "../react/input";
+import { useRendererHost } from "../ui";
+import {
+  usePaneFooter,
+  type PaneFooterSegment,
+  type PaneHint,
+} from "./layout/pane-footer";
+
+interface UseExternalLinkFooterOptions {
+  registrationId: string;
+  focused: boolean;
+  url: string | null | undefined;
+  source?: string | null;
+  info?: PaneFooterSegment[];
+  hints?: PaneHint[];
+  label?: string;
+}
+
+const EMPTY_INFO: PaneFooterSegment[] = [];
+const EMPTY_HINTS: PaneHint[] = [];
+
+function normalizeUrl(url: string | null | undefined): string | null {
+  const trimmed = url?.trim();
+  return trimmed ? trimmed : null;
+}
+
+export function useExternalLinkFooter({
+  registrationId,
+  focused,
+  url: rawUrl,
+  source,
+  info = EMPTY_INFO,
+  hints = EMPTY_HINTS,
+  label = "link",
+}: UseExternalLinkFooterOptions) {
+  const rendererHost = useRendererHost();
+  const url = normalizeUrl(rawUrl);
+  const sourceLabel = source?.trim() || null;
+
+  const openUrl = useCallback(() => {
+    if (!url) return;
+    void rendererHost.openExternal(url);
+  }, [rendererHost, url]);
+
+  useShortcut((event) => {
+    const key = (event.name ?? event.key ?? "").toLowerCase();
+    if (!focused || !url || key !== "o") return;
+    event.stopPropagation?.();
+    event.preventDefault?.();
+    openUrl();
+  });
+
+  const footer = useMemo(() => {
+    const contextLabel = label.trim() || "link";
+    const linkInfo: PaneFooterSegment[] = url && sourceLabel
+      ? [{
+        id: "external-link",
+        onPress: openUrl,
+        parts: [
+          { text: contextLabel === "link" ? "source" : contextLabel, tone: "label" as const },
+          { text: sourceLabel, tone: "value" as const },
+        ],
+      }]
+      : [];
+
+    return {
+      info: [...info, ...linkInfo],
+      hints: [
+        ...hints,
+        ...(url ? [{ id: "open", key: "o", label: "pen", onPress: openUrl }] : []),
+      ],
+    };
+  }, [hints, info, label, openUrl, sourceLabel, url]);
+
+  usePaneFooter(registrationId, () => footer, [footer]);
+
+  return openUrl;
+}

package/src/core/app-services.ts

@@ -0,0 +1,95 @@
+import { join } from "path";
+import { AppPersistence } from "../data/app-persistence";
+import { TickerRepository } from "../data/ticker-repository";
+import { MarketDataCoordinator, setSharedMarketDataCoordinator } from "../market-data/coordinator";
+import { NewsService } from "../news/aggregator";
+import { setSharedNewsService } from "../news/hooks";
+import { getLoadablePlugins } from "../plugins/catalog";
+import type { LoadedExternalPlugin } from "../plugins/loader";
+import { PluginRegistry } from "../plugins/registry";
+import { AssetDataRouter } from "../sources/provider-router";
+import { assetDataProvider, newsProvider } from "../capabilities";
+import type { AppConfig } from "../types/config";
+import type { DataProvider } from "../types/data-provider";
+import { debugLog } from "../utils/debug-log";
+import { measurePerf } from "../utils/perf-marks";
+
+const servicesLog = debugLog.createLogger("services");
+
+export interface AppServices {
+  persistence: AppPersistence;
+  tickerRepository: TickerRepository;
+  providerRouter: AssetDataRouter;
+  dataProvider: DataProvider;
+  marketData: MarketDataCoordinator;
+  pluginRegistry: PluginRegistry;
+  newsService: NewsService;
+  destroy(): void;
+}
+
+export function createAppServices({
+  config,
+  externalPlugins,
+}: {
+  config: AppConfig;
+  externalPlugins: LoadedExternalPlugin[];
+}): AppServices {
+  servicesLog.info("create services start", {
+    externalPluginCount: externalPlugins.length,
+    brokerInstanceCount: config.brokerInstances.length,
+  });
+  const dbPath = join(config.dataDir, ".gloomberb-cache.db");
+  const persistence = measurePerf("startup.services.persistence", () => new AppPersistence(dbPath));
+  const tickerRepository = measurePerf("startup.services.ticker-repository", () => new TickerRepository(persistence.tickers));
+  const providerRouter = measurePerf("startup.services.asset-data-router", () => new AssetDataRouter(null, [], persistence.resources));
+  const dataProvider: DataProvider = providerRouter;
+  const marketData = new MarketDataCoordinator(dataProvider);
+  const pluginRegistry = new PluginRegistry(dataProvider, tickerRepository, persistence);
+  const newsService = new NewsService();
+  pluginRegistry.capabilities.register("core", assetDataProvider(providerRouter));
+  pluginRegistry.capabilities.register("core", newsProvider({
+    id: "core",
+    name: "News",
+    provider: {
+      fetchNews: async (query) => (await newsService.load(query)).articles,
+      getCachedNews: (query) => newsService.getQueryState(query).articles,
+    },
+  }));
+
+  providerRouter.attachRegistry(pluginRegistry);
+  pluginRegistry.getConfigFn = () => config;
+  pluginRegistry.getLayoutFn = () => config.layout;
+  pluginRegistry.registerNewsCapabilityFn = (capability) => newsService.register(capability);
+  pluginRegistry.watchNewsQueryFn = (query, listener) => newsService.watchQuery(query, listener);
+
+  setSharedNewsService(newsService);
+  setSharedMarketDataCoordinator(marketData);
+
+  const plugins = getLoadablePlugins(externalPlugins);
+  for (const plugin of plugins) {
+    measurePerf("startup.services.register-plugin", () => {
+      void pluginRegistry.register(plugin);
+    }, { pluginId: plugin.id });
+  }
+  measurePerf("startup.services.news-start", () => {
+    newsService.start();
+  });
+  servicesLog.info("create services complete", { pluginCount: plugins.length });
+
+  return {
+    persistence,
+    tickerRepository,
+    providerRouter,
+    dataProvider,
+    marketData,
+    pluginRegistry,
+    newsService,
+    destroy() {
+      setSharedMarketDataCoordinator(null);
+      setSharedNewsService(null);
+      newsService.stop();
+      pluginRegistry.destroy();
+      persistence.close();
+    },
+  };
+}