gloomberb 0.6.1 → 0.7.1

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

@@ -1,11 +1,10 @@
 import { afterEach, describe, expect, test } from "bun:test";
 import { act, useEffect, useRef, useState } from "react";
-import { testRender } from "../../renderers/opentui/test-utils";
-import { DialogProvider } from "@opentui-ui/dialog/react";
+import { TestDialogProvider, testRender } from "../../renderers/opentui/test-utils";
 import type { BoxRenderable, ScrollBoxRenderable } from "@opentui/core";
 import { Button } from "./button";
 import { ChoiceDialog } from "./choice-dialog";
-import { DataTable } from "./data-table";
+import { DataTable, type DataTableColumn } from "./data-table";
 import { TextField } from "./fields";
 import { ListView } from "./list-view";
 import { MultiSelectDialogButton } from "./multi-select-dialog";
@@ -21,12 +20,13 @@ import { Tabs } from "./tabs";
 import { ToggleList } from "../toggle-list";
 import { AppContext, PaneInstanceProvider, createInitialState } from "../../state/app-context";
 import { createDefaultConfig } from "../../types/config";
+import { DataTableView } from "../data-table-view";
 
 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 tableHorizontalScrollbarVisible: boolean | null = null;
+let tableScrollBoxForTest: ScrollBoxRenderable | null = null;
 let closedTab: string | null = null;
 let addedTab = false;
 let resolvedChoice: string | null = null;
@@ -125,34 +125,47 @@ function DataTableSectionHarness() {
   );
 }
 
-function DataTableNoHorizontalScrollHarness() {
+function DataTableHorizontalScrollHarness({
+  columns = [{ id: "name", label: "NAME", width: 12, align: "left" }],
+  containerWidth = 32,
+  containerHeight = 5,
+  rowCount = 1,
+  showHorizontalScrollbar,
+}: {
+  columns?: DataTableColumn[];
+  containerWidth?: number;
+  containerHeight?: number;
+  rowCount?: number;
+  showHorizontalScrollbar?: boolean;
+}) {
   const headerScrollRef = useRef<ScrollBoxRenderable>(null);
   const scrollRef = useRef<ScrollBoxRenderable>(null);
-  const [hoveredIdx, setHoveredIdx] = useState<number | null>(null);
+  const items = Array.from({ length: rowCount }, (_, index) => ({
+    id: `row-${index}`,
+    name: index === 0 ? "Alpha" : `Alpha ${index + 1}`,
+  }));
 
   useEffect(() => {
-    tableHorizontalScrollbarVisible = scrollRef.current?.horizontalScrollBar.visible ?? null;
+    tableScrollBoxForTest = scrollRef.current;
   });
 
   return (
-    <DataTable
-      columns={[{ id: "name", label: "NAME", width: 12, align: "left" }]}
-      items={[{ id: "alpha", name: "Alpha" }]}
+    <DataTableView
+      rootWidth={containerWidth}
+      rootHeight={containerHeight}
+      columns={columns}
+      items={items}
       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."
-      showHorizontalScrollbar={false}
+      showHorizontalScrollbar={showHorizontalScrollbar}
     />
   );
 }
@@ -166,6 +179,15 @@ function DataTableVirtualizationHarness() {
     name: `Row ${index}`,
   }));
 
+  useEffect(() => {
+    tableScrollBoxForTest = scrollRef.current;
+    return () => {
+      if (tableScrollBoxForTest === scrollRef.current) {
+        tableScrollBoxForTest = null;
+      }
+    };
+  });
+
   return (
     <DataTable
       columns={[{ id: "name", label: "NAME", width: 12, align: "left" }]}
@@ -192,7 +214,7 @@ function MultiSelectDialogButtonHarness() {
   const [values, setValues] = useState(["sma"]);
 
   return (
-    <DialogProvider dialogOptions={{ style: { backgroundColor: "#000000", borderColor: "#ffffff", borderStyle: "single" } }}>
+    <TestDialogProvider>
       <MultiSelectDialogButton
         label="IND"
         title="Chart Indicators"
@@ -204,7 +226,7 @@ function MultiSelectDialogButtonHarness() {
           { value: "ema", label: "EMA" },
         ]}
       />
-    </DialogProvider>
+    </TestDialogProvider>
   );
 }
 
@@ -253,7 +275,7 @@ afterEach(() => {
   setListSelection = null;
   selectedTableRow = null;
   activatedTableRow = null;
-  tableHorizontalScrollbarVisible = null;
+  tableScrollBoxForTest = null;
   closedTab = null;
   addedTab = false;
   resolvedChoice = null;
@@ -320,6 +342,46 @@ describe("shared UI kit", () => {
     expect(frame).toContain("Insider");
   });
 
+  test("moves focused tabs with arrow keys and leaves Tab for pane focus", async () => {
+    let lastSelected = "overview";
+
+    function KeyboardTabsHarness() {
+      const [activeValue, setActiveValue] = useState("overview");
+      return (
+        <Tabs
+          tabs={[
+            { label: "Overview", value: "overview" },
+            { label: "News", value: "news" },
+            { label: "Chart", value: "chart" },
+          ]}
+          activeValue={activeValue}
+          onSelect={(value) => {
+            lastSelected = value;
+            setActiveValue(value);
+          }}
+          focused
+        />
+      );
+    }
+
+    testSetup = await testRender(<KeyboardTabsHarness />, { width: 40, height: 4 });
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+      testSetup!.mockInput.pressArrow("right");
+      await testSetup!.renderOnce();
+    });
+
+    expect(lastSelected).toBe("news");
+
+    await act(async () => {
+      testSetup!.mockInput.pressTab();
+      await testSetup!.renderOnce();
+    });
+
+    expect(lastSelected).toBe("news");
+  });
+
   test("renders tab actions for editable tab sets", async () => {
     testSetup = await testRender(
       <Tabs
@@ -650,10 +712,77 @@ describe("shared UI kit", () => {
 
   test("hides data table horizontal scrolling when disabled", async () => {
     const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    tableScrollBoxForTest = null;
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <PaneInstanceProvider paneId="portfolio-list:main">
+          <DataTableHorizontalScrollHarness showHorizontalScrollbar={false} />
+        </PaneInstanceProvider>
+      </AppContext>,
+      { width: 32, height: 5 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+      await testSetup!.renderOnce();
+    });
+
+    expect(tableScrollBoxForTest?.horizontalScrollBar.visible).toBe(false);
+  });
+
+  test("hides data table horizontal scrolling when content fits", async () => {
+    const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    tableScrollBoxForTest = null;
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <PaneInstanceProvider paneId="portfolio-list:main">
+          <DataTableHorizontalScrollHarness />
+        </PaneInstanceProvider>
+      </AppContext>,
+      { width: 32, height: 5 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+      await testSetup!.renderOnce();
+    });
+
+    expect(tableScrollBoxForTest?.horizontalScrollBar.visible).toBe(false);
+  });
+
+  test("shows data table horizontal scrolling when content overflows", async () => {
+    const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    tableScrollBoxForTest = null;
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <PaneInstanceProvider paneId="portfolio-list:main">
+          <DataTableHorizontalScrollHarness
+            containerWidth={24}
+            columns={[
+              { id: "name", label: "NAME", width: 24, align: "left" },
+              { id: "price", label: "PRICE", width: 18, align: "right" },
+            ]}
+          />
+        </PaneInstanceProvider>
+      </AppContext>,
+      { width: 24, height: 5 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+      await testSetup!.renderOnce();
+    });
+
+    expect(tableScrollBoxForTest?.horizontalScrollBar.visible).toBe(true);
+  });
+
+  test("shows data table vertical scrolling when rows overflow", async () => {
+    const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    tableScrollBoxForTest = null;
     testSetup = await testRender(
       <AppContext value={{ state, dispatch: () => {} }}>
         <PaneInstanceProvider paneId="portfolio-list:main">
-          <DataTableNoHorizontalScrollHarness />
+          <DataTableHorizontalScrollHarness rowCount={20} containerHeight={5} />
         </PaneInstanceProvider>
       </AppContext>,
       { width: 32, height: 5 },
@@ -664,11 +793,12 @@ describe("shared UI kit", () => {
       await testSetup!.renderOnce();
     });
 
-    expect(tableHorizontalScrollbarVisible).toBe(false);
+    expect(tableScrollBoxForTest?.verticalScrollBar.visible).toBe(true);
   });
 
-  test("virtualizes data table rows by default", async () => {
+  test("virtualizes data table rows and refreshes after wheel scrolling", async () => {
     const state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    tableScrollBoxForTest = null;
     testSetup = await testRender(
       <AppContext value={{ state, dispatch: () => {} }}>
         <PaneInstanceProvider paneId="portfolio-list:main">
@@ -685,5 +815,22 @@ describe("shared UI kit", () => {
     const frame = testSetup.captureCharFrame();
     expect(frame).toContain("Row 0");
     expect(frame).not.toContain("Row 99");
+    expect(tableScrollBoxForTest?.scrollTop).toBe(0);
+
+    await act(async () => {
+      for (let index = 0; index < 12; index++) {
+        await testSetup!.mockMouse.scroll(2, 2, "down");
+      }
+      await Promise.resolve();
+      await new Promise((resolve) => setTimeout(resolve, 0));
+      await testSetup!.renderOnce();
+    });
+    await testSetup.renderOnce();
+
+    const scrollTop = tableScrollBoxForTest?.scrollTop ?? 0;
+    expect(scrollTop).toBeGreaterThan(0);
+
+    const scrolledFrame = testSetup.captureCharFrame();
+    expect(scrolledFrame).toContain(`Row ${scrollTop}`);
   });
 });

package/src/core/state/app-state.ts

@@ -318,23 +318,13 @@ function getTopFloatingPaneId(layout: LayoutConfig): string | null {
   return topInstanceId;
 }
 
-function resolveFocusedPaneId(
-  previousLayout: LayoutConfig,
-  nextLayout: LayoutConfig,
-  focusedPaneId: string | null,
-): string | null {
+function resolveFocusedPaneId(nextLayout: LayoutConfig, focusedPaneId: string | null): string | null {
   const paneOrder = getPaneOrder(nextLayout);
   if (paneOrder.length === 0) return null;
   if (focusedPaneId && paneOrder.includes(focusedPaneId)) {
     return focusedPaneId;
   }
-  const previouslyFloating = focusedPaneId
-    ? previousLayout.floating.some((entry) => entry.instanceId === focusedPaneId)
-    : false;
-  if (previouslyFloating) {
-    return getTopFloatingPaneId(nextLayout) ?? paneOrder[0] ?? null;
-  }
-  return paneOrder[0] ?? null;
+  return getTopFloatingPaneId(nextLayout) ?? paneOrder[0] ?? null;
 }
 
 function getPanelFocusTarget(layout: LayoutConfig, panel: "left" | "right"): string | null {
@@ -387,10 +377,12 @@ function removeHistoryIndex(layoutHistory: Record<number, LayoutHistoryEntry>, r
 
 /** If paneId is a floating pane, bump its zIndex to the top. */
 function bringFloatingToFront(layout: LayoutConfig, paneId: string): LayoutConfig {
-  const entry = layout.floating.find((e) => e.instanceId === paneId);
+  const entryIndex = layout.floating.findIndex((e) => e.instanceId === paneId);
+  const entry = entryIndex >= 0 ? layout.floating[entryIndex] : undefined;
   if (!entry) return layout;
   const maxZ = layout.floating.reduce((max, e) => Math.max(max, e.zIndex ?? 50), 0);
-  if ((entry.zIndex ?? 50) >= maxZ) return layout; // already on top
+  const topEqualIndex = layout.floating.findLastIndex((e) => (e.zIndex ?? 50) === maxZ);
+  if ((entry.zIndex ?? 50) === maxZ && entryIndex === topEqualIndex) return layout; // already on top
   return {
     ...layout,
     floating: layout.floating.map((e) =>
@@ -444,7 +436,7 @@ function withFocusedPane(state: AppState, config: AppConfig): AppState {
       layouts: syncLayouts(config.layouts, config.activeLayoutIndex, normalizedLayout),
     };
   const nextPaneState = reconcilePaneState(nextConfig, state.paneState);
-  const focusedPaneId = resolveFocusedPaneId(state.config.layout, nextConfig.layout, state.focusedPaneId);
+  const focusedPaneId = resolveFocusedPaneId(nextConfig.layout, state.focusedPaneId);
   const focusedConfig = bringFocusedFloatingPaneToFront(nextConfig, focusedPaneId);
   return {
     ...state,
@@ -792,7 +784,8 @@ export function appReducer(state: AppState, action: AppAction): AppState {
 
     case "FOCUS_PREV": {
       if (action.paneOrder.length === 0) return state;
-      const currentIndex = state.focusedPaneId ? action.paneOrder.indexOf(state.focusedPaneId) : 0;
+      const focusedIndex = state.focusedPaneId ? action.paneOrder.indexOf(state.focusedPaneId) : -1;
+      const currentIndex = focusedIndex >= 0 ? focusedIndex : 0;
       const nextPaneId = action.paneOrder[(currentIndex - 1 + action.paneOrder.length) % action.paneOrder.length]!;
       return focusPaneState(state, nextPaneId);
     }
@@ -851,7 +844,7 @@ export function appReducer(state: AppState, action: AppAction): AppState {
 
 export function createInitialState(config: AppConfig, sessionSnapshot: AppSessionSnapshot | null = null): AppState {
   const paneState = reconcilePaneState(config, sessionSnapshot?.paneState ?? {});
-  const defaultFocusedPaneId = getPaneOrder(config.layout)[0] ?? null;
+  const defaultFocusedPaneId = getTopFloatingPaneId(config.layout) ?? getPaneOrder(config.layout)[0] ?? null;
   const focusedPaneId = sessionSnapshot?.focusedPaneId
     && config.layout.instances.some((instance) => instance.instanceId === sessionSnapshot.focusedPaneId)
     ? sessionSnapshot.focusedPaneId

package/src/market-data/coordinator.test.ts

@@ -2,7 +2,7 @@ import { describe, expect, it } from "bun:test";
 import { MarketDataCoordinator } from "./coordinator";
 import type { DataProvider, QuoteSubscriptionTarget } from "../types/data-provider";
 import type { InstrumentSearchResult } from "../types/instrument";
-import type { OptionsChain, PricePoint, Quote, TickerFinancials } from "../types/financials";
+import type { PricePoint, Quote, TickerFinancials } from "../types/financials";
 import { createTestDataProvider } from "../test-support/data-provider";
 
 function createProvider(overrides: Partial<DataProvider> = {}): DataProvider {
@@ -632,4 +632,79 @@ describe("MarketDataCoordinator", () => {
     expect(financials?.quote?.marketCap).toBe(3_640_775_908_600);
     expect(financials?.fundamentals?.trailingPE).toBe(31.4);
   });
+
+  it("batch loads only missing quotes when fresh quote data is already stored", async () => {
+    const batchTargets: QuoteSubscriptionTarget[][] = [];
+    const provider = createProvider({
+      getQuote: async () => ({
+        symbol: "AAPL",
+        price: 100,
+        currency: "USD",
+        change: 0,
+        changePercent: 0,
+        lastUpdated: 1_700_000_000_000,
+      }),
+      getQuotesBatch: async (targets) => {
+        batchTargets.push(targets);
+        return targets.map((target) => ({
+          target,
+          quote: {
+            symbol: target.symbol,
+            price: target.symbol === "MSFT" ? 200 : 300,
+            currency: "USD",
+            change: 0,
+            changePercent: 0,
+            lastUpdated: 1_700_000_000_000,
+          },
+        }));
+      },
+    });
+    const coordinator = new MarketDataCoordinator(provider);
+    const aapl = { symbol: "AAPL", exchange: "NASDAQ" };
+    const msft = { symbol: "MSFT", exchange: "NASDAQ" };
+
+    await coordinator.loadQuote(aapl);
+    await coordinator.loadQuotesBatch([aapl, msft]);
+
+    expect(batchTargets).toHaveLength(1);
+    expect(batchTargets[0]?.map((target) => target.symbol)).toEqual(["MSFT"]);
+    expect(coordinator.getQuoteEntry(aapl).data?.price).toBe(100);
+    expect(coordinator.getQuoteEntry(msft).data?.price).toBe(200);
+  });
+
+  it("batch loads snapshots through provider batch support", async () => {
+    const batchSymbols: string[][] = [];
+    const provider = createProvider({
+      getTickerFinancialsBatch: async (targets) => {
+        batchSymbols.push(targets.map((target) => target.symbol));
+        return targets.map((target) => ({
+          target,
+          financials: {
+            quote: {
+              symbol: target.symbol,
+              price: target.symbol === "AAPL" ? 150 : 250,
+              currency: "USD",
+              change: 0,
+              changePercent: 0,
+              lastUpdated: 1_700_000_000_000,
+            },
+            fundamentals: { trailingPE: target.symbol === "AAPL" ? 20 : 30 },
+            annualStatements: [],
+            quarterlyStatements: [],
+            priceHistory: [],
+          },
+        }));
+      },
+    });
+    const coordinator = new MarketDataCoordinator(provider);
+
+    await coordinator.loadSnapshotsBatch([
+      { symbol: "AAPL", exchange: "NASDAQ" },
+      { symbol: "MSFT", exchange: "NASDAQ" },
+    ]);
+
+    expect(batchSymbols).toEqual([["AAPL", "MSFT"]]);
+    expect(coordinator.getTickerFinancialsSync({ symbol: "AAPL", exchange: "NASDAQ" })?.quote?.price).toBe(150);
+    expect(coordinator.getTickerFinancialsSync({ symbol: "MSFT", exchange: "NASDAQ" })?.fundamentals?.trailingPE).toBe(30);
+  });
 });