gloomberb 0.9.5 → 0.9.6

package/src/components/ui/list-view.tsx

@@ -2,12 +2,19 @@ import { Box, ScrollBox, Text, useUiHost } from "../../ui";
 import { useEffect, useRef, useState, type ComponentType, type ReactNode } from "react";
 import { TextAttributes, type ScrollBoxRenderable } from "../../ui";
 import { colors, hoverBg } from "../../theme/colors";
+import { useRemoteUiNode } from "../../remote/semantic-tree";
+import { resolveRemoteItemIndex } from "../../remote/semantic-helpers";
 
 export interface ListViewItem {
   id: string;
   label: string;
   description?: string;
   detail?: string;
+  category?: string;
+  kind?: string;
+  right?: string;
+  checked?: boolean;
+  current?: boolean;
   disabled?: boolean;
 }
 
@@ -38,6 +45,13 @@ export interface ListViewProps {
   scrollable?: boolean;
   selectOnHover?: boolean;
   autoScrollToIndex?: boolean;
+  onMouseScroll?: (event: any) => void;
+  remoteRole?: string;
+  remoteLabel?: string;
+  remoteScope?: string;
+  remoteItemKind?: string;
+  remoteItemCategory?: string;
+  remoteMetadata?: Record<string, unknown>;
 }
 
 function DefaultRow({
@@ -88,7 +102,49 @@ export function ListView({
   scrollable = false,
   selectOnHover = false,
   autoScrollToIndex = true,
+  onMouseScroll,
+  remoteRole = "list",
+  remoteLabel,
+  remoteScope,
+  remoteItemKind,
+  remoteItemCategory,
+  remoteMetadata,
 }: ListViewProps) {
+  useRemoteUiNode({
+    role: remoteRole,
+    label: remoteLabel ?? emptyMessage,
+    actions: {
+      select: (input) => {
+        const index = resolveListIndex(input, items);
+        if (index >= 0 && !items[index]?.disabled) onSelect?.(index);
+      },
+      activate: (input) => {
+        const index = resolveListIndex(input, items);
+        const item = index >= 0 ? items[index] : undefined;
+        if (item && !item.disabled) {
+          onSelect?.(index);
+          onActivate?.(item, index);
+        }
+      },
+    },
+    metadata: {
+      ...remoteMetadata,
+      scope: remoteScope,
+      selectedIndex,
+      items: items.map((item, index) => ({
+        index,
+        id: item.id,
+        label: item.label,
+        detail: item.detail,
+        category: item.category ?? remoteItemCategory,
+        kind: item.kind ?? remoteItemKind,
+        right: item.right,
+        checked: item.checked,
+        current: item.current,
+        disabled: item.disabled === true,
+      })),
+    },
+  });
   const HostListView = useUiHost().ListView as ComponentType<ListViewProps> | undefined;
   if (HostListView) {
     return (
@@ -113,6 +169,13 @@ export function ListView({
         scrollable={scrollable}
         selectOnHover={selectOnHover}
         autoScrollToIndex={autoScrollToIndex}
+        onMouseScroll={onMouseScroll}
+        remoteRole={remoteRole}
+        remoteLabel={remoteLabel}
+        remoteScope={remoteScope}
+        remoteItemKind={remoteItemKind}
+        remoteItemCategory={remoteItemCategory}
+        remoteMetadata={remoteMetadata}
       />
     );
   }
@@ -130,7 +193,7 @@ export function ListView({
     const sb = scrollRef.current;
     if (!sb) return;
     const safeIndex = Math.min(activeScrollIndex, items.length - 1);
-    const viewportH = Math.max(sb.viewport.height, 1);
+    const viewportH = Math.max(sb.viewport?.height ?? 1, 1);
     if (safeIndex < sb.scrollTop) {
       sb.scrollTo(safeIndex);
     } else if (safeIndex >= sb.scrollTop + viewportH) {
@@ -142,7 +205,9 @@ export function ListView({
     if (!scrollable) return;
     const sb = scrollRef.current;
     if (!sb) return;
-    sb.verticalScrollBar.visible = items.length > sb.viewport.height;
+    if (sb.verticalScrollBar) {
+      sb.verticalScrollBar.visible = items.length > (sb.viewport?.height ?? 0);
+    }
   }, [items.length, height, flexGrow, scrollable]);
 
   if (items.length === 0) {
@@ -172,6 +237,7 @@ export function ListView({
             if (selectOnHover) onSelect?.(index);
           }
         }}
+        {...(onMouseScroll ? { onMouseScroll } : {})}
         onMouseDown={() => {
           if (disabled) return;
           onSelect?.(index);
@@ -188,7 +254,14 @@ export function ListView({
   return (
     <Box flexDirection="column" height={height} flexGrow={flexGrow}>
       {scrollable ? (
-        <ScrollBox ref={scrollRef} height={height} flexGrow={flexGrow} scrollY focusable={false}>
+        <ScrollBox
+          ref={scrollRef}
+          height={height}
+          flexGrow={flexGrow}
+          scrollY
+          focusable={false}
+          {...(onMouseScroll ? { onMouseScroll } : {})}
+        >
           {rows}
         </ScrollBox>
       ) : rows}
@@ -204,3 +277,10 @@ export function ListView({
     </Box>
   );
 }
+
+function resolveListIndex(input: unknown, items: ListViewItem[]): number {
+  return resolveRemoteItemIndex(input, items, {
+    id: (item) => item.id,
+    label: (item) => item.label,
+  });
+}

package/src/components/ui/message-composer.tsx

@@ -2,6 +2,8 @@ import { Box, Text, Textarea, useUiHost } from "../../ui";
 import { type ComponentType, type RefObject } from "react";
 import { type TextareaRenderable } from "../../ui";
 import { colors } from "../../theme/colors";
+import { useRemoteUiNode } from "../../remote/semantic-tree";
+import { remoteStringValue } from "../../remote/semantic-helpers";
 
 export interface MessageComposerProps {
   inputRef?: RefObject<TextareaRenderable | null>;
@@ -54,6 +56,26 @@ export function MessageComposer({
   keyBindings,
   wrapText = false,
 }: MessageComposerProps) {
+  useRemoteUiNode({
+    role: "message-composer",
+    label: placeholder || "Message composer",
+    actions: {
+      setValue: (input) => {
+        const value = remoteStringValue(input);
+        onFocusRequest?.();
+        onInput?.(value);
+      },
+      submit: () => {
+        onFocusRequest?.();
+        onSubmit?.();
+      },
+      focus: () => {
+        onFocusRequest?.();
+        inputRef?.current?.focus?.();
+      },
+    },
+    metadata: { focused, placeholder, height },
+  });
   const HostMessageComposer = useUiHost().MessageComposer as ComponentType<MessageComposerProps> | undefined;
   if (HostMessageComposer) {
     return (

package/src/components/ui/tabs.tsx

@@ -3,6 +3,7 @@ import { useShortcut } from "../../react/input";
 import { Box, ScrollBox, Text, useUiHost } from "../../ui";
 import { TextAttributes, type ScrollBoxRenderable } from "../../ui";
 import { colors, hoverBg } from "../../theme/colors";
+import { useRemoteUiNode } from "../../remote/semantic-tree";
 
 type TabPointerEvent = {
   button?: number;
@@ -76,6 +77,36 @@ export function Tabs({
     navigationValueRef.current = value;
     onSelect(value);
   }, [onSelect]);
+  useRemoteUiNode({
+    role: "tabs",
+    label: "Tabs",
+    actions: {
+      select: (input) => {
+        const value = resolveTabValue(input, tabs);
+        if (!value) return;
+        const tab = tabs.find((entry) => entry.value === value);
+        if (!tab || tab.disabled) return;
+        handleSelect(value);
+      },
+      add: onAdd ? () => onAdd() : undefined,
+      close: (input) => {
+        const value = resolveTabValue(input, tabs);
+        if (!value) return;
+        const tab = tabs.find((entry) => entry.value === value);
+        if (!tab || tab.disabled) return;
+        tab.onClose?.(value);
+      },
+    },
+    metadata: {
+      activeValue,
+      tabs: tabs.map((tab) => ({
+        label: tab.label,
+        value: tab.value,
+        disabled: tab.disabled === true,
+        closeable: !!tab.onClose,
+      })),
+    },
+  });
 
   const selectAdjacentTab = useCallback((direction: -1 | 1) => {
     const enabledTabs = tabs.filter((tab) => !tab.disabled);
@@ -144,6 +175,20 @@ export function Tabs({
   );
 }
 
+function resolveTabValue(input: unknown, tabs: TabItem[]): string | null {
+  if (typeof input === "string") return input;
+  if (typeof input === "number") return tabs[input]?.value ?? null;
+  if (input && typeof input === "object") {
+    const value = input as { value?: unknown; label?: unknown; index?: unknown };
+    if (typeof value.value === "string") return value.value;
+    if (typeof value.label === "string") {
+      return tabs.find((tab) => tab.label === value.label)?.value ?? null;
+    }
+    if (typeof value.index === "number") return tabs[value.index]?.value ?? null;
+  }
+  return null;
+}
+
 function tabWidth(
   tab: TabItem,
   active: boolean,

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

@@ -64,7 +64,13 @@ export function reduceLayoutAction(state: AppState, action: AppAction): AppState
     }
 
     case "UPDATE_LAYOUT":
-      return withFocusedPane(state, { ...state.config, layout: action.layout });
+      return withFocusedPane(
+        state,
+        { ...state.config, layout: action.layout },
+        Object.prototype.hasOwnProperty.call(action, "focusedPaneId")
+          ? { focusedPaneId: action.focusedPaneId ?? null }
+          : {},
+      );
 
     case "SWITCH_LAYOUT": {
       if (action.index < 0 || action.index >= state.config.layouts.length) return state;

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

@@ -351,6 +351,9 @@ export function focusPaneState(state: AppState, paneId: string): AppState {
     ...state,
     config: syncConfigActiveLayoutState(config, state.paneState, paneId, state.activePanel),
     focusedPaneId: paneId,
+    previousFocusedPaneId: state.focusedPaneId && state.focusedPaneId !== paneId
+      ? state.focusedPaneId
+      : state.previousFocusedPaneId,
     recentTickers,
   };
 }
@@ -386,6 +389,9 @@ export function withFocusedPane(
     paneState: nextPaneState,
     brokerAccounts: reconcileBrokerAccounts(syncedConfig, state.brokerAccounts),
     focusedPaneId,
+    previousFocusedPaneId: state.focusedPaneId && state.focusedPaneId !== focusedPaneId
+      ? state.focusedPaneId
+      : state.previousFocusedPaneId,
     activePanel,
   };
 }

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

@@ -108,7 +108,9 @@ export function appReducer(state: AppState, action: AppAction): AppState {
       return { ...state, recentTickers: nextRecentTickers(state.recentTickers, action.symbol) };
 
     case "SET_ACTIVE_PANEL": {
-      const firstPane = getPanelFocusTarget(state.config.layout, action.panel);
+      const firstPane = action.preserveFocus
+        ? state.focusedPaneId
+        : getPanelFocusTarget(state.config.layout, action.panel);
       return withFocusedPane(state, state.config, {
         activePanel: action.panel,
         focusedPaneId: firstPane ?? state.focusedPaneId,
@@ -260,6 +262,25 @@ export function appReducer(state: AppState, action: AppAction): AppState {
       };
     }
 
+    case "REPLACE_PANE_STATE": {
+      const current = state.paneState[action.paneId] ?? {};
+      const nextState = action.state;
+      if (Object.is(current, nextState)) return state;
+      const paneState = {
+        ...state.paneState,
+        [action.paneId]: nextState,
+      };
+      const recentTickers = current.cursorSymbol !== nextState.cursorSymbol
+        ? nextRecentTickers(state.recentTickers, typeof nextState.cursorSymbol === "string" ? nextState.cursorSymbol : null)
+        : state.recentTickers;
+      return {
+        ...state,
+        config: syncConfigActiveLayoutState(state.config, paneState, state.focusedPaneId, state.activePanel),
+        paneState,
+        recentTickers,
+      };
+    }
+
     case "UPDATE_PLUGIN_PANE_STATE": {
       const current = state.paneState[action.paneId] ?? {};
       const currentPluginState = current.pluginState ?? {};
@@ -319,6 +340,7 @@ export function createInitialState(config: AppConfig, sessionSnapshot: AppSessio
     brokerAccounts: {},
     activePanel,
     focusedPaneId,
+    previousFocusedPaneId: null,
     paneState,
     recentTickers: config.recentTickers,
     commandBarOpen: false,

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

@@ -48,6 +48,7 @@ export interface AppState {
   brokerAccounts: Record<string, BrokerAccount[]>;
   activePanel: "left" | "right";
   focusedPaneId: string | null;
+  previousFocusedPaneId: string | null;
   paneState: Record<string, PaneRuntimeState>;
   recentTickers: string[];
   commandBarOpen: boolean;
@@ -76,7 +77,7 @@ export type AppAction =
   | { type: "MERGE_QUOTE"; symbol: string; quote: Quote }
   | { type: "HYDRATE_FINANCIALS"; financials: Map<string, TickerFinancials> }
   | { type: "TRACK_TICKER"; symbol: string | null }
-  | { type: "SET_ACTIVE_PANEL"; panel: "left" | "right" }
+  | { type: "SET_ACTIVE_PANEL"; panel: "left" | "right"; preserveFocus?: boolean }
   | { type: "TOGGLE_COMMAND_BAR" }
   | {
       type: "SET_COMMAND_BAR";
@@ -104,7 +105,7 @@ export type AppAction =
   | { type: "PUSH_LAYOUT_HISTORY" }
   | { type: "UNDO_LAYOUT" }
   | { type: "REDO_LAYOUT" }
-  | { type: "UPDATE_LAYOUT"; layout: LayoutConfig }
+  | { type: "UPDATE_LAYOUT"; layout: LayoutConfig; focusedPaneId?: string | null }
   | { type: "SWITCH_LAYOUT"; index: number }
   | { type: "NEW_LAYOUT"; name: string }
   | { type: "DELETE_LAYOUT"; index: number }
@@ -121,4 +122,5 @@ export type AppAction =
       key: string;
       value: unknown;
     }
+  | { type: "REPLACE_PANE_STATE"; paneId: string; state: PaneRuntimeState }
   | { type: "UPDATE_PANE_STATE"; paneId: string; patch: Partial<PaneRuntimeState> };

package/src/plugins/builtin/chat/channels.ts

@@ -1,6 +1,6 @@
 import type { CommandResultDef, GloomPluginContext } from "../../../types/plugin";
 import type { ChatChannel, ChatChannelState } from "../../../api-client";
-import type { AppConfig, PaneInstanceConfig } from "../../../types/config";
+import type { AppConfig } from "../../../types/config";
 import { chatController } from "./controller";
 import { formatChannelLabel } from "./channel-labels";
 
@@ -25,14 +25,6 @@ export function getLastVisitedChatChannelId(config: { pluginConfig: Record<strin
   return normalizeChannelId(config.pluginConfig["gloomberb-cloud"]?.[LAST_VISITED_CHAT_CHANNEL_KEY] as string | undefined);
 }
 
-export function findChatPaneInstanceForChannel(config: AppConfig, channelId: string): PaneInstanceConfig | undefined {
-  const normalizedChannelId = normalizeChannelId(channelId);
-  return config.layout.instances.find((instance) => (
-    instance.paneId === "chat"
-    && normalizeChannelId(typeof instance.settings?.channelId === "string" ? instance.settings.channelId : null) === normalizedChannelId
-  ));
-}
-
 export function getPreferredChatOpenChannelId(
   config: AppConfig,
   snapshot?: { channels: ChatChannel[]; channelStates: ChatChannelState[] },
@@ -80,17 +72,12 @@ export function hasOnlyDmUsernameArgs(value: string): boolean {
   return parts.length > 0 && parts.every((part) => CHAT_USERNAME_ARG.test(part));
 }
 
-function openChatChannelFromCommand(ctx: Pick<GloomPluginContext, "createPaneFromTemplate" | "focusPane" | "getConfig">, channelId: string): void {
-  const existingInstance = findChatPaneInstanceForChannel(ctx.getConfig(), channelId);
-  if (existingInstance) {
-    ctx.focusPane(existingInstance.instanceId);
-    return;
-  }
+function openChatChannelFromCommand(ctx: Pick<GloomPluginContext, "createPaneFromTemplate">, channelId: string): void {
   ctx.createPaneFromTemplate("new-chat-pane", { arg: channelId });
 }
 
-export function openDefaultChatFromCommand(
-  ctx: Pick<GloomPluginContext, "createPaneFromTemplate" | "focusPane" | "getConfig">,
+function openDefaultChatPane(
+  ctx: Pick<GloomPluginContext, "createPaneFromTemplate" | "getConfig">,
 ): void {
   const config = ctx.getConfig();
   openChatChannelFromCommand(ctx, getPreferredChatOpenChannelId(config, chatController.getSnapshot()));
@@ -98,7 +85,7 @@ export function openDefaultChatFromCommand(
 
 export async function openDmTargetFromCommand(ctx: GloomPluginContext, usernames: string[]): Promise<void> {
   if (usernames.length === 0) {
-    openDefaultChatFromCommand(ctx);
+    openDefaultChatPane(ctx);
     return;
   }
   const channel = usernames.length === 1

package/src/plugins/builtin/chat/chat.test.tsx

@@ -1178,7 +1178,6 @@ describe("ChatContent", () => {
       user: { id: "u1", username: "vince", emailVerified: true },
     });
     const openedTemplates: Array<{ templateId: string; options?: { arg?: string } }> = [];
-    const focusedPanes: string[] = [];
     const state = createInitialState(createDefaultConfig("/tmp/gloomberb-chat"));
     state.config.disabledPlugins = [];
 
@@ -1186,9 +1185,6 @@ describe("ChatContent", () => {
       createPaneFromTemplate(templateId: string, options?: { arg?: string }) {
         openedTemplates.push({ templateId, options });
       },
-      focusPane(paneId: string) {
-        focusedPanes.push(paneId);
-      },
     });
 
     await act(async () => {
@@ -1230,9 +1226,7 @@ describe("ChatContent", () => {
       await setup().renderOnce();
     });
 
-    expect(openedTemplates).toEqual([]);
-    expect(focusedPanes).toHaveLength(1);
-    expect(focusedPanes[0]?.startsWith("chat:")).toBe(true);
+    expect(openedTemplates).toEqual([{ templateId: "new-chat-pane", options: { arg: "everyone" } }]);
   });
 
   test("opens an unread direct-message channel from the status widget", async () => {

package/src/plugins/builtin/chat/status-widget.tsx

@@ -5,7 +5,6 @@ import { Box, Span, Text, TextAttributes, useUiCapabilities } from "../../../ui"
 import { usePluginAppActions } from "../../runtime";
 import { InlineAuthActions } from "../cloud/auth-actions";
 import {
-  findChatPaneInstanceForChannel,
   getPreferredChatOpenChannelId,
 } from "./channels";
 import { chatController, type ChatController } from "./controller";
@@ -53,7 +52,7 @@ function CloudStatusIcon() {
 }
 
 export function ChatStatusWidget({ controller = chatController }: ChatStatusWidgetProps) {
-  const { createPaneFromTemplate, focusPane } = usePluginAppActions();
+  const { createPaneFromTemplate } = usePluginAppActions();
   const config = useAppSelector((state) => state.config);
   const cloudPluginDisabled = config.disabledPlugins.includes("gloomberb-cloud");
   const initialSnapshot = controller.getSnapshot();
@@ -67,11 +66,6 @@ export function ChatStatusWidget({ controller = chatController }: ChatStatusWidg
     event?.preventDefault?.();
     event?.stopPropagation?.();
     const channelId = getPreferredChatOpenChannelId(config, snapshot);
-    const existingInstance = findChatPaneInstanceForChannel(config, channelId);
-    if (existingInstance) {
-      focusPane(existingInstance.instanceId);
-      return;
-    }
     createPaneFromTemplate("new-chat-pane", { arg: channelId });
   };
 

package/src/plugins/builtin/cloud/plugin.tsx

@@ -14,10 +14,9 @@ import { registerTwitterFeedFeature } from "../cloud-tweets";
 import {
   buildDmCommandResults,
   formatChatPaneTitle,
-  getLastVisitedChatChannelId,
+  getPreferredChatOpenChannelId,
   hasOnlyDmUsernameArgs,
   normalizeShortcutChannelId,
-  openDefaultChatFromCommand,
   openDmTargetFromCommand,
   parseDmUsernames,
 } from "../chat/channels";
@@ -50,7 +49,9 @@ export function createGloomberbCloudPlugin({
         createInstance: async (context, options) => {
           const channelId = options?.arg
             ? await chatController.resolveRequiredChannelId(normalizeShortcutChannelId(options.arg))
-            : await chatController.resolvePreferredChannelId(getLastVisitedChatChannelId(context.config));
+            : await chatController.resolvePreferredChannelId(
+              getPreferredChatOpenChannelId(context.config, chatController.getSnapshot()),
+            );
           const channel = chatController.getChannels().find((entry) => entry.id === channelId);
           return {
             placement: "floating",
@@ -144,16 +145,6 @@ export function createGloomberbCloudPlugin({
 
       registerTwitterFeedFeature(ctx);
 
-      ctx.registerCommand({
-        id: "open-chat",
-        label: "Chat",
-        description: "Open chat",
-        keywords: ["chat", "message", "messages"],
-        category: "navigation",
-        shortcut: "CHAT",
-        execute: () => openDefaultChatFromCommand(ctx),
-      });
-
       ctx.registerCommand({
         id: "direct-message",
         label: "DM",