gloomberb 0.2.0 → 0.3.2

package/src/components/ui/toggle.tsx

@@ -0,0 +1,164 @@
+import { TextAttributes } from "@opentui/core";
+import { colors } from "../../theme/colors";
+
+export interface CheckboxProps {
+  label: string;
+  checked: boolean;
+  disabled?: boolean;
+  selected?: boolean;
+  onChange?: (checked: boolean) => void;
+}
+
+export function Checkbox({
+  label,
+  checked,
+  disabled = false,
+  selected = false,
+  onChange,
+}: CheckboxProps) {
+  const fg = disabled ? colors.textMuted : selected ? colors.text : colors.textDim;
+  const marker = checked ? "x" : " ";
+
+  return (
+    <box
+      height={1}
+      onMouseDown={() => {
+        if (!disabled) onChange?.(!checked);
+      }}
+    >
+      <text fg={selected ? colors.selectedText : colors.textDim}>
+        {selected ? "\u25b8 " : "  "}
+      </text>
+      <text fg={fg} attributes={selected ? TextAttributes.BOLD : 0}>
+        {`[${marker}] ${label}`}
+      </text>
+    </box>
+  );
+}
+
+export interface SwitchProps {
+  label: string;
+  checked: boolean;
+  disabled?: boolean;
+  onChange?: (checked: boolean) => void;
+}
+
+export function Switch({
+  label,
+  checked,
+  disabled = false,
+  onChange,
+}: SwitchProps) {
+  const fg = disabled ? colors.textMuted : colors.text;
+  const stateBg = checked ? colors.positive : colors.panel;
+  const stateText = checked ? " ON " : " OFF ";
+
+  return (
+    <box
+      flexDirection="row"
+      height={1}
+      onMouseDown={() => {
+        if (!disabled) onChange?.(!checked);
+      }}
+    >
+      <text fg={fg}>{`${label} `}</text>
+      <box backgroundColor={stateBg}>
+        <text fg={checked ? colors.bg : colors.textDim}>{stateText}</text>
+      </box>
+    </box>
+  );
+}
+
+export interface RadioOption {
+  label: string;
+  value: string;
+  disabled?: boolean;
+}
+
+export interface RadioGroupProps {
+  label?: string;
+  options: RadioOption[];
+  value: string;
+  onChange?: (value: string) => void;
+}
+
+export function RadioGroup({
+  label,
+  options,
+  value,
+  onChange,
+}: RadioGroupProps) {
+  return (
+    <box flexDirection="column">
+      {label && (
+        <box height={1}>
+          <text fg={colors.textDim}>{label}</text>
+        </box>
+      )}
+      {options.map((option) => {
+        const checked = option.value === value;
+        return (
+          <box
+            key={option.value}
+            height={1}
+            onMouseDown={() => {
+              if (!option.disabled) onChange?.(option.value);
+            }}
+          >
+            <text fg={option.disabled ? colors.textMuted : checked ? colors.text : colors.textDim}>
+              {checked ? "(•) " : "( ) "}
+            </text>
+            <text
+              fg={option.disabled ? colors.textMuted : checked ? colors.text : colors.textDim}
+              attributes={checked ? TextAttributes.BOLD : 0}
+            >
+              {option.label}
+            </text>
+          </box>
+        );
+      })}
+    </box>
+  );
+}
+
+export interface SegmentedControlOption {
+  label: string;
+  value: string;
+  disabled?: boolean;
+}
+
+export interface SegmentedControlProps {
+  options: SegmentedControlOption[];
+  value: string;
+  onChange?: (value: string) => void;
+}
+
+export function SegmentedControl({
+  options,
+  value,
+  onChange,
+}: SegmentedControlProps) {
+  return (
+    <box flexDirection="row">
+      {options.map((option) => {
+        const active = option.value === value;
+        return (
+          <box
+            key={option.value}
+            backgroundColor={active ? colors.selected : colors.panel}
+            onMouseDown={() => {
+              if (!option.disabled) onChange?.(option.value);
+            }}
+          >
+            <text
+              fg={option.disabled ? colors.textMuted : active ? colors.selectedText : colors.textDim}
+              attributes={active ? TextAttributes.BOLD : 0}
+            >
+              {` ${option.label} `}
+            </text>
+          </box>
+        );
+      })}
+    </box>
+  );
+}

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

@@ -0,0 +1,134 @@
+import { afterEach, describe, expect, test } from "bun:test";
+import { act, useState } from "react";
+import { testRender } from "@opentui/react/test-utils";
+import { Button } from "./button";
+import { TextField } from "./fields";
+import { ListView } from "./list-view";
+import { ProgressBar } from "./loading";
+import { Notice } from "./status";
+import { Tabs } from "./tabs";
+import { ToggleList } from "../toggle-list";
+
+let testSetup: Awaited<ReturnType<typeof testRender>> | undefined;
+let setListSelection: ((index: number) => void) | null = null;
+
+function ScrollableListHarness() {
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  setListSelection = setSelectedIndex;
+
+  return (
+    <ListView
+      items={Array.from({ length: 12 }, (_, index) => ({
+        id: `row-${index}`,
+        label: `Row ${index + 1}`,
+      }))}
+      selectedIndex={selectedIndex}
+      height={4}
+      scrollable
+    />
+  );
+}
+
+afterEach(() => {
+  if (testSetup) {
+    testSetup.renderer.destroy();
+    testSetup = undefined;
+  }
+  setListSelection = null;
+});
+
+describe("shared UI kit", () => {
+  test("renders navigation and feedback primitives", async () => {
+    testSetup = await testRender(
+      <box flexDirection="column">
+        <Tabs
+          tabs={[
+            { label: "Overview", value: "overview" },
+            { label: "News", value: "news" },
+          ]}
+          activeValue="overview"
+          onSelect={() => {}}
+        />
+        <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 },
+    );
+
+    await testSetup.renderOnce();
+
+    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 () => {
+    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("auto-scrolls a scrollable list to keep the selected row visible", async () => {
+    testSetup = await testRender(
+      <ScrollableListHarness />,
+      { width: 20, height: 6 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+    await act(async () => {
+      setListSelection!(8);
+      await Promise.resolve();
+    });
+    await act(async () => {
+      await testSetup!.renderOnce();
+    });
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Row 9");
+    expect(frame).not.toContain("Row 1");
+  });
+
+  test("masks password text fields", async () => {
+    testSetup = await testRender(
+      <TextField
+        type="password"
+        value="secret"
+        placeholder="Password"
+        focused
+        width={12}
+        onChange={() => {}}
+      />,
+      { width: 16, height: 3 },
+    );
+
+    await testSetup.renderOnce();
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("******");
+    expect(frame).not.toContain("secret");
+  });
+});

package/src/data/app-persistence.ts

@@ -0,0 +1,25 @@
+import { PluginStateStore } from "./plugin-state-store";
+import { ResourceStore } from "./resource-store";
+import { SessionStore } from "./session-store";
+import { SqliteDatabase } from "./sqlite-database";
+import { TickerStore } from "./ticker-store";
+
+export class AppPersistence {
+  readonly database: SqliteDatabase;
+  readonly tickers: TickerStore;
+  readonly resources: ResourceStore;
+  readonly pluginState: PluginStateStore;
+  readonly sessions: SessionStore;
+
+  constructor(dbPath: string) {
+    this.database = new SqliteDatabase(dbPath);
+    this.tickers = new TickerStore(this.database.connection);
+    this.resources = new ResourceStore(this.database.connection);
+    this.pluginState = new PluginStateStore(this.database.connection);
+    this.sessions = new SessionStore(this.database.connection);
+  }
+
+  close(): void {
+    this.database.close();
+  }
+}

package/src/data/config-store.test.ts

@@ -0,0 +1,347 @@
+import { afterEach, describe, expect, test } from "bun:test";
+import { mkdtemp, readFile, rm, writeFile } from "fs/promises";
+import { join } from "path";
+import { tmpdir } from "os";
+import { loadConfig, sanitizeLayout, saveConfig } from "./config-store";
+import {
+  CURRENT_CONFIG_VERSION,
+  DEFAULT_COLUMNS,
+  DEFAULT_LAYOUT,
+  DEFAULT_PORTFOLIO_COLUMN_IDS,
+  findPaneInstance,
+} from "../types/config";
+import { getDockedPaneIds } from "../plugins/pane-manager";
+
+const tempDirs: string[] = [];
+
+afterEach(async () => {
+  await Promise.all(tempDirs.splice(0).map((dir) => rm(dir, { recursive: true, force: true })));
+});
+
+async function createTempConfigDir(): Promise<string> {
+  const dataDir = await mkdtemp(join(tmpdir(), "gloomberb-config-"));
+  tempDirs.push(dataDir);
+  return dataDir;
+}
+
+function createSavedConfig(overrides: Record<string, unknown> = {}): Record<string, unknown> {
+  return {
+    configVersion: CURRENT_CONFIG_VERSION,
+    baseCurrency: "USD",
+    refreshIntervalMinutes: 30,
+    portfolios: [{ id: "main", name: "Main Portfolio", currency: "USD" }],
+    watchlists: [{ id: "watchlist", name: "Watchlist" }],
+    layout: DEFAULT_LAYOUT,
+    layouts: [{ name: "Default", layout: DEFAULT_LAYOUT }],
+    activeLayoutIndex: 0,
+    brokerInstances: [],
+    plugins: [],
+    disabledPlugins: [],
+    theme: "amber",
+    chartPreferences: { defaultRenderMode: "area", renderer: "auto" },
+    recentTickers: [],
+    ...overrides,
+  };
+}
+
+async function writeConfigJson(dataDir: string, config: Record<string, unknown>): Promise<void> {
+  await writeFile(join(dataDir, "config.json"), JSON.stringify(config), "utf-8");
+}
+
+describe("sanitizeLayout", () => {
+  test("rewrites unbound ticker-detail panes to follow the first portfolio pane", () => {
+    const layout = sanitizeLayout({
+      dockRoot: {
+        kind: "split",
+        axis: "horizontal",
+        ratio: 0.5,
+        first: { kind: "pane", instanceId: "portfolio-list:main" },
+        second: { kind: "pane", instanceId: "ticker-detail:main" },
+      },
+      instances: [
+        {
+          instanceId: "portfolio-list:main",
+          paneId: "portfolio-list",
+          binding: { kind: "none" },
+          params: { collectionId: "main" },
+        },
+        {
+          instanceId: "ticker-detail:main",
+          paneId: "ticker-detail",
+          binding: { kind: "none" },
+        },
+      ],
+      floating: [],
+    }, DEFAULT_LAYOUT);
+
+    expect(findPaneInstance(layout, "ticker-detail:main")?.binding).toEqual({
+      kind: "follow",
+      sourceInstanceId: "portfolio-list:main",
+    });
+    expect(getDockedPaneIds(layout)).toEqual(["portfolio-list:main", "ticker-detail:main"]);
+  });
+
+  test("removes follow panes whose source pane is missing", () => {
+    const layout = sanitizeLayout({
+      dockRoot: { kind: "pane", instanceId: "ticker-detail:main" },
+      instances: [
+        {
+          instanceId: "ticker-detail:main",
+          paneId: "ticker-detail",
+          binding: { kind: "follow", sourceInstanceId: "portfolio-list:missing" },
+        },
+      ],
+      floating: [],
+    }, DEFAULT_LAYOUT);
+
+    expect(findPaneInstance(layout, "ticker-detail:main")).toBeUndefined();
+    expect(getDockedPaneIds(layout)).toHaveLength(0);
+    expect(layout.dockRoot).toBeNull();
+  });
+
+  test("clamps floating placement memory and drops invalid docked placement hints", () => {
+    const layout = sanitizeLayout({
+      dockRoot: {
+        kind: "split",
+        axis: "vertical",
+        ratio: 0.55,
+        first: { kind: "pane", instanceId: "portfolio-list:main" },
+        second: { kind: "pane", instanceId: "ticker-detail:main" },
+      },
+      instances: [
+        {
+          instanceId: "portfolio-list:main",
+          paneId: "portfolio-list",
+          binding: { kind: "none" },
+          params: { collectionId: "main" },
+          placementMemory: {
+            docked: {
+              columnIndex: "left",
+              order: 0,
+            },
+          },
+        },
+        {
+          instanceId: "ticker-detail:main",
+          paneId: "ticker-detail",
+          binding: { kind: "follow", sourceInstanceId: "portfolio-list:main" },
+          placementMemory: {
+            docked: {
+              columnIndex: 3,
+              order: 2,
+              height: "120%",
+            },
+            floating: {
+              x: -5,
+              y: 4,
+              width: 0,
+              height: 7,
+            },
+          },
+        },
+      ],
+      floating: [],
+    }, DEFAULT_LAYOUT);
+
+    expect(layout.dockRoot?.kind).toBe("split");
+    expect(layout.dockRoot && layout.dockRoot.kind === "split" ? layout.dockRoot.axis : null).toBe("vertical");
+    expect(findPaneInstance(layout, "portfolio-list:main")?.placementMemory).toBeUndefined();
+    expect(findPaneInstance(layout, "ticker-detail:main")?.placementMemory).toEqual({
+      floating: {
+        x: 0,
+        y: 4,
+        width: 1,
+        height: 7,
+      },
+    });
+  });
+
+  test("falls back to the default layout when given an obsolete column layout", () => {
+    const layout = sanitizeLayout({
+      columns: [{ width: "100%" }],
+      instances: [
+        {
+          instanceId: "portfolio-list:main",
+          paneId: "portfolio-list",
+          binding: { kind: "none" },
+        },
+      ],
+      docked: [{ instanceId: "portfolio-list:main", columnIndex: 0 }],
+      floating: [],
+    }, DEFAULT_LAYOUT);
+
+    expect(layout).toEqual(DEFAULT_LAYOUT);
+  });
+});
+
+describe("loadConfig", () => {
+  test("fills in missing chart preferences for older configs", async () => {
+    const dataDir = await createTempConfigDir();
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 5,
+      recentTickers: [],
+      chartPreferences: undefined,
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.chartPreferences).toEqual({
+      defaultRenderMode: "area",
+      renderer: "auto",
+    });
+  });
+
+  test("sanitizes invalid chart renderer values back to auto", async () => {
+    const dataDir = await createTempConfigDir();
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 7,
+      chartPreferences: {
+        defaultRenderMode: "line",
+        renderer: "nope",
+      },
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.chartPreferences).toEqual({
+      defaultRenderMode: "line",
+      renderer: "auto",
+    });
+    expect(config.pluginConfig).toEqual({});
+  });
+
+  test("preserves plugin config state from disk", async () => {
+    const dataDir = await createTempConfigDir();
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 7,
+      pluginConfig: {
+        news: {
+          displayMode: "expanded",
+        },
+      },
+      chartPreferences: { defaultRenderMode: "line" },
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.pluginConfig).toEqual({
+      news: {
+        displayMode: "expanded",
+      },
+    });
+  });
+
+  test("preserves disabled plugin ids without migration rewrites", async () => {
+    const dataDir = await createTempConfigDir();
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 9,
+      disabledPlugins: ["chat", "news", "chat"],
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.disabledPlugins).toEqual(["chat", "news"]);
+  });
+
+  test("preserves IBKR gateway configs without migration rewrites", async () => {
+    const dataDir = await createTempConfigDir();
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 11,
+      brokerInstances: [{
+        id: "ibkr-interactive-brokers",
+        brokerType: "ibkr",
+        label: "Interactive Brokers",
+        connectionMode: "gateway",
+        config: {
+          connectionMode: "gateway",
+          host: "127.0.0.1",
+          port: 4002,
+          clientId: 1,
+        },
+      }],
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.brokerInstances[0]?.config).toEqual({
+      connectionMode: "gateway",
+      host: "127.0.0.1",
+      port: 4002,
+      clientId: 1,
+    });
+  });
+
+  test("migrates legacy main portfolio panes to the portfolio default columns", async () => {
+    const dataDir = await createTempConfigDir();
+    const legacyColumnIds = DEFAULT_COLUMNS.map((column) => column.id);
+    const legacyLayout = {
+      ...DEFAULT_LAYOUT,
+      instances: DEFAULT_LAYOUT.instances.map((instance) => (
+        instance.instanceId === "portfolio-list:main"
+          ? {
+            ...instance,
+            settings: {
+              ...(instance.settings ?? {}),
+              columnIds: legacyColumnIds,
+            },
+          }
+          : instance
+      )),
+    };
+
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 10,
+      layout: legacyLayout,
+      layouts: [{ name: "Default", layout: legacyLayout }],
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(findPaneInstance(config.layout, "portfolio-list:main")?.settings?.columnIds).toEqual(DEFAULT_PORTFOLIO_COLUMN_IDS);
+    expect(findPaneInstance(config.layouts[0]?.layout ?? DEFAULT_LAYOUT, "portfolio-list:main")?.settings?.columnIds)
+      .toEqual(DEFAULT_PORTFOLIO_COLUMN_IDS);
+  });
+
+  test("falls back to the default layout when persisted layouts use the obsolete column shape", async () => {
+    const dataDir = await createTempConfigDir();
+    const obsoleteLayout = {
+      columns: [{ width: "100%" }],
+      instances: [
+        {
+          instanceId: "portfolio-list:main",
+          paneId: "portfolio-list",
+          binding: { kind: "none" },
+        },
+      ],
+      docked: [{ instanceId: "portfolio-list:main", columnIndex: 0 }],
+      floating: [],
+    };
+
+    await writeConfigJson(dataDir, createSavedConfig({
+      configVersion: 6,
+      layouts: [
+        { name: "Default", layout: DEFAULT_LAYOUT },
+        { name: "Research", layout: obsoleteLayout },
+      ],
+      activeLayoutIndex: 1,
+    }));
+
+    const config = await loadConfig(dataDir);
+
+    expect(config.configVersion).toBe(CURRENT_CONFIG_VERSION);
+    expect(config.activeLayoutIndex).toBe(1);
+    expect(config.layouts.map((layout) => layout.name)).toEqual(["Default", "Research"]);
+    expect(config.layout).toEqual(DEFAULT_LAYOUT);
+
+    await saveConfig(config);
+    const persisted = JSON.parse(await readFile(join(dataDir, "config.json"), "utf-8")) as {
+      configVersion: number;
+      layouts: Array<{ name: string; layout: Record<string, unknown> }>;
+      activeLayoutIndex: number;
+    };
+
+    expect(persisted.configVersion).toBe(CURRENT_CONFIG_VERSION);
+    expect(persisted.activeLayoutIndex).toBe(1);
+    expect(persisted.layouts[1]?.layout).toEqual(DEFAULT_LAYOUT);
+  });
+});