gloomberb 0.7.1 → 0.7.3

package/src/renderers/opentui/host.tsx

@@ -4,6 +4,7 @@ import type { ReactNode } from "react";
 import { resetTerminalInputState } from "../../utils/terminal-input-reset";
 import type { KeyEventLike } from "../../react/input";
 import type { NativeRendererHost, RendererHost } from "../../ui/host";
+import { colors } from "../../theme/colors";
 
 export { useKeyboard, useRenderer, useTerminalDimensions };
 export type { CliRenderer };
@@ -54,7 +55,7 @@ export async function createOpenTuiHost(): Promise<OpenTuiHost> {
 
   const renderer = await createCliRenderer({
     exitOnCtrlC: true,
-    backgroundColor: "#000000",
+    backgroundColor: colors.bg,
     enableMouseMovement: true,
   });
   const root = createRoot(renderer);

package/src/renderers/opentui/start.tsx

@@ -66,7 +66,7 @@ export async function startOpenTuiApp(): Promise<void> {
             <OpenTuiDialogHostProvider
               size="medium"
               dialogOptions={{ style: { backgroundColor: colors.bg, borderColor: colors.borderFocused, borderStyle: "single", paddingX: 2, paddingY: 1 } }}
-              backdropColor="#000000"
+              backdropColor={colors.bg}
               backdropOpacity={0.8}
             >
               <App

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

@@ -4,6 +4,7 @@ import { testRender as openTuiTestRender } from "@opentui/react/test-utils";
 import { createRoot as openTuiCreateRoot, useRenderer } from "@opentui/react";
 import { UiHostProvider, type NativeRendererHost, type RendererHost } from "../../ui";
 import { ToastHostProvider } from "../../ui/toast";
+import { colors } from "../../theme/colors";
 import { OpenTuiInputHostProvider } from "./input-host";
 import { openTuiUiHost } from "./ui-host";
 import { OpenTuiDialogHostProvider } from "./dialog-host";
@@ -14,8 +15,8 @@ export function TestDialogProvider({ children }: { children: ReactNode }) {
     <DialogProvider
       dialogOptions={{
         style: {
-          backgroundColor: "#000000",
-          borderColor: "#ffffff",
+          backgroundColor: colors.bg,
+          borderColor: colors.borderFocused,
           borderStyle: "single",
         },
       }}
@@ -54,9 +55,9 @@ export function OpenTuiTestProviders({ children }: { children: ReactNode }) {
       <OpenTuiInputHostProvider>
         <ToastHostProvider host={openTuiToastHost}>
           <OpenTuiDialogHostProvider
-            backgroundColor="#000000"
-            containerBorderColor="#555555"
-            focusedBorderColor="#9cdcfe"
+            backgroundColor={colors.bg}
+            containerBorderColor={colors.border}
+            focusedBorderColor={colors.borderFocused}
           >
             {children}
           </OpenTuiDialogHostProvider>

package/src/state/app-bootstrap.ts

@@ -37,11 +37,11 @@ interface RefreshPlanEntry {
 }
 
 const MAX_BACKGROUND_WARMUP_TICKERS = 12;
-const PORTFOLIO_FINANCIAL_COLUMN_IDS = new Set([
-  "market_cap",
+const PORTFOLIO_FULL_SNAPSHOT_COLUMN_IDS = new Set([
   "pe",
   "forward_pe",
   "dividend_yield",
+  "sparkline",
 ]);
 const startupLog = debugLog.createLogger("startup");
 
@@ -157,7 +157,7 @@ function buildRefreshPlan(
     const columnIds = Array.isArray(instance.settings?.columnIds)
       ? instance.settings.columnIds.filter((value): value is string => typeof value === "string")
       : [];
-    return columnIds.some((columnId) => PORTFOLIO_FINANCIAL_COLUMN_IDS.has(columnId))
+    return columnIds.some((columnId) => PORTFOLIO_FULL_SNAPSHOT_COLUMN_IDS.has(columnId))
       ? "financials"
       : "quote";
   };

package/src/state/app-context.test.ts

@@ -329,6 +329,64 @@ describe("pane state updates", () => {
 
     expect(next).toBe(initial);
   });
+
+  test("keeps pane runtime state scoped to each saved layout", () => {
+    let state = createInitialState(createDefaultConfig("/tmp/gloomberb-test"));
+    const originalLayoutIndex = state.config.activeLayoutIndex;
+
+    state = appReducer(state, {
+      type: "UPDATE_PANE_STATE",
+      paneId: "ticker-detail:main",
+      patch: { activeTabId: "chart" },
+    });
+    state = appReducer(state, { type: "DUPLICATE_LAYOUT", index: originalLayoutIndex });
+    const duplicateLayoutIndex = state.config.activeLayoutIndex;
+
+    state = appReducer(state, {
+      type: "UPDATE_PANE_STATE",
+      paneId: "ticker-detail:main",
+      patch: { activeTabId: "financials" },
+    });
+
+    expect(state.config.layouts[duplicateLayoutIndex]?.paneState?.["ticker-detail:main"]?.activeTabId).toBe("financials");
+
+    state = appReducer(state, { type: "SWITCH_LAYOUT", index: originalLayoutIndex });
+    expect(state.paneState["ticker-detail:main"]?.activeTabId).toBe("chart");
+    expect(state.config.layouts[originalLayoutIndex]?.paneState?.["ticker-detail:main"]?.activeTabId).toBe("chart");
+
+    state = appReducer(state, { type: "SWITCH_LAYOUT", index: duplicateLayoutIndex });
+    expect(state.paneState["ticker-detail:main"]?.activeTabId).toBe("financials");
+  });
+
+  test("hydrates saved layout pane state before legacy session pane state", () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    config.layouts[config.activeLayoutIndex] = {
+      ...config.layouts[config.activeLayoutIndex]!,
+      paneState: {
+        "ticker-detail:main": { activeTabId: "chart" },
+      },
+      focusedPaneId: "ticker-detail:main",
+      activePanel: "right",
+    };
+    const sessionSnapshot: AppSessionSnapshot = {
+      paneState: {
+        "ticker-detail:main": { activeTabId: "overview" },
+      },
+      focusedPaneId: "portfolio-list:main",
+      activePanel: "left",
+      statusBarVisible: true,
+      openPaneIds: ["portfolio-list:main", "ticker-detail:main"],
+      hydrationTargets: [],
+      exchangeCurrencies: ["USD"],
+      savedAt: Date.now(),
+    };
+
+    const state = createInitialState(config, sessionSnapshot);
+
+    expect(state.paneState["ticker-detail:main"]?.activeTabId).toBe("chart");
+    expect(state.focusedPaneId).toBe("ticker-detail:main");
+    expect(state.activePanel).toBe("right");
+  });
 });
 
 describe("quote merging", () => {
@@ -487,6 +545,61 @@ describe("quote merging", () => {
 });
 
 describe("layout focus fallback", () => {
+  test("switching to an old layout without focused metadata uses that layout's top floating pane", () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    const targetLayout = {
+      ...cloneLayout(config.layout),
+      dockRoot: null,
+      floating: [
+        { instanceId: "chat:main", x: 4, y: 2, width: 36, height: 10, zIndex: 70 },
+        { instanceId: "ticker-detail:main", x: 12, y: 4, width: 36, height: 10, zIndex: 95 },
+      ],
+    };
+    config.layouts = [
+      { name: "Current", layout: cloneLayout(config.layout), paneState: {} },
+      { name: "Floating", layout: cloneLayout(targetLayout), paneState: {} },
+    ];
+    config.activeLayoutIndex = 0;
+
+    let state = createInitialState(config);
+    state = appReducer(state, { type: "FOCUS_PANE", paneId: "chat:main" });
+    state = appReducer(state, { type: "SWITCH_LAYOUT", index: 1 });
+
+    const chatEntry = state.config.layout.floating.find((entry) => entry.instanceId === "chat:main");
+    const tickerEntry = state.config.layout.floating.find((entry) => entry.instanceId === "ticker-detail:main");
+    expect(state.focusedPaneId).toBe("ticker-detail:main");
+    expect((tickerEntry?.zIndex ?? 0) > (chatEntry?.zIndex ?? 0)).toBe(true);
+  });
+
+  test("switching layouts raises the saved focused floating pane above stale z-order", () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    const targetLayout = {
+      ...cloneLayout(config.layout),
+      dockRoot: null,
+      floating: [
+        { instanceId: "chat:main", x: 4, y: 2, width: 36, height: 10, zIndex: 70 },
+        { instanceId: "ticker-detail:main", x: 12, y: 4, width: 36, height: 10, zIndex: 95 },
+      ],
+    };
+    config.layouts = [
+      { name: "Current", layout: cloneLayout(config.layout), paneState: {} },
+      {
+        name: "Floating",
+        layout: cloneLayout(targetLayout),
+        paneState: {},
+        focusedPaneId: "chat:main",
+      },
+    ];
+    config.activeLayoutIndex = 0;
+
+    const state = appReducer(createInitialState(config), { type: "SWITCH_LAYOUT", index: 1 });
+
+    const chatEntry = state.config.layout.floating.find((entry) => entry.instanceId === "chat:main");
+    const tickerEntry = state.config.layout.floating.find((entry) => entry.instanceId === "ticker-detail:main");
+    expect(state.focusedPaneId).toBe("chat:main");
+    expect((chatEntry?.zIndex ?? 0) > (tickerEntry?.zIndex ?? 0)).toBe(true);
+  });
+
   test("starts with the top floating pane focused when no session pane is active", () => {
     const config = createDefaultConfig("/tmp/gloomberb-test");
     const layout = {

package/src/state/app-context.tsx

@@ -37,6 +37,7 @@ import {
   type PaneRuntimeState,
   resolveCollectionForPane,
   resolveTickerForPane,
+  syncConfigActiveLayoutState,
 } from "../core/state/app-state";
 import type { AppAction, AppState } from "../core/state/app-state";
 import { scheduleConfigSave } from "./config-save-scheduler";
@@ -50,6 +51,7 @@ export {
   getPaneState,
   resolveCollectionForPane,
   resolveFinancialsForPane,
+  syncConfigActiveLayoutState,
   resolveTickerFileForPane,
   resolveTickerForPane,
 } from "../core/state/app-state";
@@ -283,10 +285,12 @@ export function usePaneSettingValue<T>(
       ? (nextValue as (previousValue: T) => T)(currentValue)
       : nextValue;
     const layout = setPaneSetting(currentState.config.layout, scopedPaneId, key, resolved);
-    const layouts = currentState.config.layouts.map((savedLayout, index) => (
-      index === currentState.config.activeLayoutIndex ? { ...savedLayout, layout } : savedLayout
-    ));
-    const nextConfig = { ...currentState.config, layout, layouts };
+    const nextConfig = syncConfigActiveLayoutState(
+      { ...currentState.config, layout },
+      currentState.paneState,
+      currentState.focusedPaneId,
+      currentState.activePanel,
+    );
     dispatch({ type: "SET_CONFIG", config: nextConfig });
     scheduleConfigSave(nextConfig);
   }, [dispatch, fallback, key, scopedPaneId, stateRef]);

package/src/theme/colors.ts

@@ -73,21 +73,20 @@ export function syncTheme(id: string): void {
 
 export { blendHex } from "./color-utils";
 
-const COMPARISON_SERIES_COLORS = [
-  "#5bc0eb",
-  "#f6ae2d",
-  "#f26419",
-  "#6f2dbd",
-  "#00a896",
-  "#ef476f",
-  "#118ab2",
-  "#8ac926",
-  "#ff7f51",
-  "#4361ee",
-] as const;
-
 export function getComparisonSeriesColor(index: number): string {
-  return COMPARISON_SERIES_COLORS[((index % COMPARISON_SERIES_COLORS.length) + COMPARISON_SERIES_COLORS.length) % COMPARISON_SERIES_COLORS.length]!;
+  const seriesColors = [
+    colors.borderFocused,
+    colors.warning,
+    colors.positive,
+    colors.negative,
+    colors.textBright,
+    colors.neutral,
+    blendHex(colors.borderFocused, colors.positive, 0.45),
+    blendHex(colors.warning, colors.negative, 0.35),
+    blendHex(colors.textBright, colors.positive, 0.35),
+    blendHex(colors.borderFocused, colors.negative, 0.35),
+  ];
+  return seriesColors[((index % seriesColors.length) + seriesColors.length) % seriesColors.length]!;
 }
 
 /** Returns a hover background color derived from bg and selected */

package/src/types/config.ts

@@ -1,8 +1,8 @@
 import type { Portfolio, Watchlist } from "./ticker";
 
-export const CURRENT_CONFIG_VERSION = 15;
+export const CURRENT_CONFIG_VERSION = 16;
 
-export type DefaultChartRenderMode = "area" | "line" | "candles" | "ohlc";
+export type DefaultChartRenderMode = "area" | "line" | "candles" | "ohlc" | "hlc";
 export type ChartRendererPreference = "auto" | "kitty" | "braille";
 
 export interface ChartPreferences {
@@ -108,8 +108,12 @@ export interface LayoutConfig {
 }
 
 export interface SavedLayout {
+  id?: string;
   name: string;
   layout: LayoutConfig;
+  paneState?: Record<string, Record<string, unknown>>;
+  focusedPaneId?: string | null;
+  activePanel?: "left" | "right";
 }
 
 export interface AppConfig {
@@ -154,6 +158,7 @@ export const DEFAULT_COLUMNS: ColumnConfig[] = [
 
 export const DEFAULT_PORTFOLIO_COLUMN_IDS = [
   ...DEFAULT_COLUMNS.map((column) => column.id),
+  "sparkline",
   "shares",
   "avg_cost",
   "cost_basis",
@@ -585,8 +590,8 @@ export function createDefaultConfig(dataDir: string): AppConfig {
     watchlists: [{ id: "watchlist", name: "Watchlist" }],
     layout,
     layouts: [
-      { name: "Home", layout: cloneLayout(layout) },
-      { name: "Monitor", layout: cloneLayout(DEFAULT_MONITOR_LAYOUT) },
+      { name: "Home", layout: cloneLayout(layout), paneState: {} },
+      { name: "Monitor", layout: cloneLayout(DEFAULT_MONITOR_LAYOUT), paneState: {} },
     ],
     activeLayoutIndex: 0,
     brokerInstances: [],

package/src/types/plugin.ts

@@ -110,6 +110,7 @@ export type PaneSettingField =
 
 export interface PaneSettingsDef {
   title?: string;
+  values?: Record<string, unknown>;
   fields: PaneSettingField[];
 }
 
@@ -406,6 +407,12 @@ export interface BrokerInstanceUpdateOptions {
   replaceConfig?: boolean;
 }
 
+export interface PinTickerOptions {
+  floating?: boolean;
+  paneType?: string;
+  forceNewPane?: boolean;
+}
+
 export interface GloomPluginContext {
   registerPane(pane: PaneDef): void;
   registerPaneTemplate(template: PaneTemplateDef): void;
@@ -448,7 +455,7 @@ export interface GloomPluginContext {
   createPaneFromTemplate(templateId: string, options?: PaneTemplateCreateOptions): void;
   hidePane(paneId: string): void;
   focusPane(paneId: string): void;
-  pinTicker(symbol: string, options?: { floating?: boolean; paneType?: string }): void;
+  pinTicker(symbol: string, options?: PinTickerOptions): void;
   navigateTicker(symbol: string, options?: { sourcePaneId?: string | null }): void;
   openPaneSettings(paneId?: string): void;
 

package/src/ui/context-menu.tsx

@@ -127,7 +127,7 @@ function selectedTextMenuItems(text: string, registry: PluginRegistry | null, co
       contextMenuDivider("selected-text:ticker-divider"),
       {
         id: "selected-text:open-ticker",
-        label: "Open as Ticker",
+        label: "Open Ticker Detail",
         onSelect: () => registry?.navigateTicker(symbol),
       },
       {
@@ -224,13 +224,13 @@ export function tickerContextMenuItems({
   const items: ContextMenuItem[] = [
     {
       id: "ticker:open",
-      label: `Open ${symbol}`,
+      label: `Open ${symbol} Detail`,
       onSelect: () => (openTicker ? openTicker(symbol) : registry?.navigateTicker(symbol)),
     },
     {
       id: "ticker:pin-floating",
-      label: `Pin ${symbol} in Floating Detail`,
-      onSelect: () => registry?.pinTicker(symbol, { floating: true, paneType: "ticker-detail" }),
+      label: `Open ${symbol} in New Floating Detail`,
+      onSelect: () => registry?.pinTicker(symbol, { floating: true, paneType: "ticker-detail", forceNewPane: true }),
     },
     {
       id: "ticker:copy-symbol",

package/src/ui/host.tsx

@@ -94,6 +94,12 @@ export interface BoxRenderable {
   [key: string]: unknown;
 }
 
+export interface ScrollBarRenderable {
+  visible: boolean;
+  on?(event: "change", handler: () => void): void;
+  off?(event: "change", handler: () => void): void;
+}
+
 export interface ScrollBoxRenderable {
   scrollTop: number;
   scrollLeft?: number;
@@ -107,8 +113,8 @@ export interface ScrollBoxRenderable {
   visible?: boolean;
   parent?: unknown;
   getBoundingClientRect?: () => { x: number; y: number; width: number; height: number };
-  horizontalScrollBar?: { visible: boolean };
-  verticalScrollBar?: { visible: boolean };
+  horizontalScrollBar?: ScrollBarRenderable;
+  verticalScrollBar?: ScrollBarRenderable;
   scrollTo(target: number | { x?: number; y?: number }, y?: number): void;
   scrollToPixels?(target: number | { x?: number; y?: number }, y?: number): void;
 }

package/src/ui/index.tsx

@@ -39,6 +39,7 @@ export type {
   PixelResolution,
   RGBA as RGBAColor,
   RendererHost,
+  ScrollBarRenderable,
   ScrollBoxRenderable,
   ScrollBoxProps,
   SyntaxStyleLike,

package/src/utils/api-client.test.ts

@@ -282,6 +282,134 @@ describe("apiClient chat timestamps", () => {
     expect(seenCreatedAts).toEqual(["2026-04-08T07:28:27.625Z"]);
     channel.close();
   });
+
+  test("fetches chat state and normalizes pending notification timestamps", async () => {
+    let requestedUrl = "";
+    globalThis.fetch = mockFetch(async (input: Request | string | URL) => {
+      requestedUrl = String(input);
+      return createResponse({
+        channels: [{ id: "everyone", name: "everyone", created_at: "2026-04-08T07:00:00.000Z" }],
+        onlineCount: 2,
+        channelStates: [{
+          channelId: "everyone",
+          notificationsEnabled: true,
+          lastReadMessageId: "m1",
+          unreadCount: 1,
+        }],
+        notifications: [{
+          id: "n1",
+          type: "reply",
+          channelId: "everyone",
+          messageId: "m2",
+          createdAt: "2026-04-08 07:30:00.000",
+          message: {
+            id: "m2",
+            channelId: "everyone",
+            content: "reply",
+            replyToId: "m1",
+            createdAt: "2026-04-08 07:29:00.000",
+            user: { id: "u2", username: "bob", displayName: "Bob" },
+            replyTo: { content: "parent", user: { id: "u1", username: "vince" } },
+          },
+        }],
+      });
+    });
+
+    const state = await apiClient.getChatState();
+
+    expect(new URL(requestedUrl).pathname).toBe("/chat/state");
+    expect(state.onlineCount).toBe(2);
+    expect(state.notifications[0]?.createdAt).toBe("2026-04-08T07:30:00.000Z");
+    expect(state.notifications[0]?.message.createdAt).toBe("2026-04-08T07:29:00.000Z");
+  });
+
+  test("updates chat channel state and marks notifications delivered", async () => {
+    const requests: Array<{ path: string; method: string; body: unknown }> = [];
+    const responses = [
+      createResponse({
+        channelId: "everyone",
+        notificationsEnabled: true,
+        lastReadMessageId: "m2",
+        unreadCount: 0,
+      }),
+      createResponse({ delivered: 2 }),
+      createResponse({ onlineCount: 4 }),
+    ];
+    globalThis.fetch = mockFetch(async (input: Request | string | URL, init?: RequestInit) => {
+      requests.push({
+        path: new URL(String(input)).pathname,
+        method: init?.method ?? "GET",
+        body: init?.body ? JSON.parse(String(init.body)) : null,
+      });
+      return responses.shift() as Response;
+    });
+
+    await apiClient.updateChatChannelState("everyone", {
+      notificationsEnabled: true,
+      readThroughMessageId: "m2",
+    });
+    await apiClient.markChatNotificationsDelivered(["n1", "n2"]);
+    const presence = await apiClient.getChatPresence();
+
+    expect(requests).toEqual([
+      {
+        path: "/chat/channels/everyone/state",
+        method: "PATCH",
+        body: { notificationsEnabled: true, readThroughMessageId: "m2" },
+      },
+      {
+        path: "/chat/notifications/delivered",
+        method: "POST",
+        body: { notificationIds: ["n1", "n2"] },
+      },
+      {
+        path: "/chat/presence",
+        method: "GET",
+        body: null,
+      },
+    ]);
+    expect(presence).toEqual({ onlineCount: 4 });
+  });
+
+  test("emits websocket chat presence and notification events", async () => {
+    const seenPresence: number[] = [];
+    const seenNotifications: string[] = [];
+    const unsubscribePresence = apiClient.subscribeChatPresence((onlineCount) => {
+      seenPresence.push(onlineCount);
+    });
+    const unsubscribeNotifications = apiClient.subscribeChatNotifications((notification) => {
+      seenNotifications.push(`${notification.id}:${notification.message.createdAt}`);
+    });
+
+    await (apiClient as any).handleSocketMessage(JSON.stringify({
+      type: "chat.presence",
+      onlineCount: 5,
+    }));
+    await (apiClient as any).handleSocketMessage(JSON.stringify({
+      type: "chat.notification",
+      data: {
+        id: "n1",
+        type: "reply",
+        channelId: "everyone",
+        messageId: "m2",
+        createdAt: "2026-04-08 07:30:00.000",
+        message: {
+          id: "m2",
+          channelId: "everyone",
+          content: "reply",
+          replyToId: "m1",
+          createdAt: "2026-04-08 07:29:00.000",
+          user: { id: "u2", username: "bob", displayName: "Bob" },
+          replyTo: { content: "parent", user: { id: "u1", username: "vince" } },
+        },
+      },
+    }));
+
+    expect(seenPresence).toEqual([5]);
+    expect(seenNotifications).toEqual(["n1:2026-04-08T07:29:00.000Z"]);
+    unsubscribePresence();
+    unsubscribeNotifications();
+  });
 });
 
 describe("apiClient cloud news", () => {