gloomberb 0.3.7 → 0.4.1

package/src/components/layout/header.tsx

@@ -31,7 +31,7 @@ function UpdateStatus() {
         <box flexDirection="row" gap={1}>
           <spinner name="dots" color={colors.headerText} />
           <text fg={colors.headerText}>
-            Downloading v{updateAvailable?.version}... {updateProgress.percent ?? 0}%
+            Downloading v{updateAvailable?.version}: {updateProgress.percent ?? 0}%
           </text>
         </box>
       );
@@ -45,7 +45,7 @@ function UpdateStatus() {
       );
     }
     if (updateProgress.phase === "done") {
-      return <text fg={colors.headerText}>Update installed — restart to apply</text>;
+      return <text fg={colors.headerText}>Update installed, restart to apply</text>;
     }
     if (updateProgress.phase === "error") {
       return <text fg={colors.headerText}>Update failed: {updateProgress.error}</text>;
@@ -71,7 +71,7 @@ function UpdateStatus() {
     }
     return (
       <text fg={colors.headerText}>
-        v{updateAvailable.version} available — press <span fg={colors.headerText}>u</span> to update
+        v{updateAvailable.version} available — starting download...
       </text>
     );
   }

package/src/components/layout/pane-header.tsx

@@ -1,4 +1,4 @@
-import { floatingPaneTitleBg, paneTitleBg, paneTitleText } from "../../theme/colors";
+import { colors, floatingPaneTitleBg, paneTitleBg, paneTitleText } from "../../theme/colors";
 
 export const PANE_HEADER_HEIGHT = 1;
 export const PANE_HEADER_GRIP = ":: ";
@@ -30,13 +30,37 @@ export function PaneHeader({
   const backgroundColor = floating ? floatingPaneTitleBg(focused) : paneTitleBg(focused);
   const actionText = showActions ? PANE_HEADER_ACTION : "     ";
   const closeText = floating ? PANE_HEADER_CLOSE : "";
+  const bc = colors.borderFocused;
+  const textColor = paneTitleText(focused, floating);
+
+  if (focused) {
+    // Build: ┌─:: Title ─────────── ... x─┐
+    // Reserve 2 for corners, 1 for ─ after ┌, 1 for ─ before ┐
+    const innerWidth = Math.max(0, width - 4);
+    const contentWidth = PANE_HEADER_GRIP.length + closeText.length + actionText.length;
+    const titleWidth = Math.max(0, innerWidth - contentWidth);
+    const clippedTitle = truncateTitle(title, titleWidth);
+    const fillLen = Math.max(0, innerWidth - PANE_HEADER_GRIP.length - clippedTitle.length - actionText.length - closeText.length);
+    const fill = "─".repeat(fillLen);
+
+    return (
+      <box height={PANE_HEADER_HEIGHT} width={width} backgroundColor={backgroundColor} flexDirection="row">
+        <text fg={bc} selectable={false}>{"┌─"}</text>
+        <text fg={textColor} selectable={false}>{`${PANE_HEADER_GRIP}${clippedTitle}`}</text>
+        <text fg={bc} selectable={false}>{fill}</text>
+        <text fg={textColor} selectable={false}>{`${actionText}${closeText}`}</text>
+        <text fg={bc} selectable={false}>{"─┐"}</text>
+      </box>
+    );
+  }
+
   const titleWidth = Math.max(0, width - PANE_HEADER_GRIP.length - actionText.length - closeText.length);
   const clippedTitle = truncateTitle(title, titleWidth);
   const padding = " ".repeat(Math.max(0, titleWidth - clippedTitle.length));
 
   return (
     <box height={PANE_HEADER_HEIGHT} width={width} backgroundColor={backgroundColor} flexDirection="row">
-      <text fg={paneTitleText(focused, floating)} selectable={false}>
+      <text fg={textColor} selectable={false}>
         {`${PANE_HEADER_GRIP}${clippedTitle}${padding}${actionText}${closeText}`}
       </text>
     </box>

package/src/components/layout/pane-sizing.ts

@@ -0,0 +1,6 @@
+const RESERVED_PANE_CHROME_ROWS = 2;
+
+export function getPaneBodyHeight(height: number): number {
+  // Reserve the header row plus the bottom border/resize row.
+  return Math.max(1, height - RESERVED_PANE_CHROME_ROWS);
+}

package/src/components/layout/pane.tsx

@@ -1,6 +1,7 @@
 import type { ReactNode } from "react";
 import { paneBg } from "../../theme/colors";
 import { PaneHeader } from "./pane-header";
+import { getPaneBodyHeight } from "./pane-sizing";
 
 interface PaneWrapperProps {
   title?: string;
@@ -26,6 +27,9 @@ export function PaneWrapper({
   children,
 }: PaneWrapperProps) {
   const bg = paneBg(focused);
+  const bodyHeight = typeof height === "number"
+    ? title ? getPaneBodyHeight(height) : height
+    : undefined;
 
   return (
     <box
@@ -41,7 +45,7 @@ export function PaneWrapper({
       {title && (
         <PaneHeader title={title} width={width} focused={focused} showActions={showActions} />
       )}
-      <box flexGrow={1} overflow="hidden">
+      <box height={bodyHeight} flexGrow={bodyHeight == null ? 1 : 0} overflow="hidden">
         {children}
       </box>
     </box>

package/src/components/layout/shell.test.tsx

@@ -1,12 +1,14 @@
 import { afterEach, describe, expect, test } from "bun:test";
 import { testRender } from "@opentui/react/test-utils";
 import { DialogProvider } from "@opentui-ui/dialog/react";
+import type { ReactNode } from "react";
 import { act, useReducer } from "react";
 import { AppContext, appReducer, createInitialState } from "../../state/app-context";
 import { cloneLayout, createDefaultConfig } from "../../types/config";
 import type { PluginRegistry } from "../../plugins/registry";
 import { setSharedRegistryForTests } from "../../plugins/registry";
 import { portfolioListPlugin } from "../../plugins/builtin/portfolio-list";
+import type { PaneProps } from "../../types/plugin";
 import { StatusBar } from "./status-bar";
 import { Header } from "./header";
 import { buildNativeWindowState, finalizePaneDragRelease, resolveNativeDockDividers, Shell } from "./shell";
@@ -26,7 +28,9 @@ afterEach(() => {
   setSharedRegistryForTests(undefined);
 });
 
-function createShellPluginRegistry(): PluginRegistry {
+function createShellPluginRegistry(options?: {
+  tickerDetailComponent?: (props: PaneProps) => ReactNode;
+}): PluginRegistry {
   return {
     panes: new Map([
       ["portfolio-list", {
@@ -38,7 +42,7 @@ function createShellPluginRegistry(): PluginRegistry {
       ["ticker-detail", {
         id: "ticker-detail",
         name: "Ticker Detail",
-        component: () => <text>Ticker Detail Body</text>,
+        component: options?.tickerDetailComponent ?? (() => <text>Ticker Detail Body</text>),
         defaultPosition: "right",
         defaultMode: "floating",
       }],
@@ -160,15 +164,18 @@ function createHeaderDataProvider(): DataProvider {
 
 function HeaderHarness({
   updateAvailable = null,
+  updateProgress = null,
   updateCheckInProgress = false,
   updateNotice = null,
 }: {
   updateAvailable?: ReturnType<typeof createInitialState>["updateAvailable"];
+  updateProgress?: ReturnType<typeof createInitialState>["updateProgress"];
   updateCheckInProgress?: boolean;
   updateNotice?: string | null;
 }) {
   const initialState = createInitialState(createDefaultConfig("/tmp/gloomberb-header-test"));
   initialState.updateAvailable = updateAvailable;
+  initialState.updateProgress = updateProgress;
   initialState.updateCheckInProgress = updateCheckInProgress;
   initialState.updateNotice = updateNotice;
   const [state, dispatch] = useReducer(appReducer, initialState);
@@ -258,7 +265,7 @@ function BrokerShellHarness({ pluginRegistry }: { pluginRegistry: PluginRegistry
 }
 
 describe("Header", () => {
-  test("shows the self-update shortcut for standalone binaries", async () => {
+  test("shows automatic self-update status for standalone binaries", async () => {
     testSetup = await testRender(
       <HeaderHarness updateAvailable={{
         version: "0.3.0",
@@ -274,7 +281,8 @@ describe("Header", () => {
     const frame = testSetup.captureCharFrame();
 
     expect(frame).toContain("v0.3.0 available");
-    expect(frame).toContain("press u to update");
+    expect(frame).toContain("starting download");
+    expect(frame).not.toContain("press u to update");
   });
 
   test("shows the manual npm command when self-update is disabled", async () => {
@@ -297,7 +305,26 @@ describe("Header", () => {
     expect(frame).not.toContain("press u to update");
   });
 
-  test("shows update check progress and notices", async () => {
+  test("shows update download progress and notices", async () => {
+    testSetup = await testRender(
+      <HeaderHarness
+        updateAvailable={{
+          version: "0.3.0",
+          tagName: "v0.3.0",
+          downloadUrl: "https://example.com/gloomberb",
+          publishedAt: "2026-04-01T00:00:00.000Z",
+          updateAction: { kind: "self" },
+        }}
+        updateProgress={{ phase: "downloading", percent: 42 }}
+      />,
+      { width: 120, height: 2 },
+    );
+
+    await testSetup.renderOnce();
+    expect(testSetup.captureCharFrame()).toContain("Downloading v0.3.0: 42%");
+
+    testSetup.renderer.destroy();
+
     testSetup = await testRender(
       <HeaderHarness updateCheckInProgress />,
       { width: 120, height: 2 },
@@ -648,4 +675,49 @@ describe("Shell", () => {
     expect(updateLayout?.layout.floating).toEqual([]);
     expect(updateLayout?.layout.dockRoot).toEqual({ kind: "pane", instanceId: "portfolio-list:main" });
   });
+
+  test("keeps the last floating pane body row visible above the border", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-shell-footer-test");
+    const detailPane = config.layout.instances.find((instance) => instance.instanceId === "ticker-detail:main");
+    if (!detailPane) throw new Error("missing detail pane");
+
+    const floatingOnlyLayout = {
+      dockRoot: null,
+      instances: [{ ...detailPane }],
+      floating: [{ instanceId: "ticker-detail:main", x: 4, y: 2, width: 30, height: 8, zIndex: 75 }],
+    };
+    const state = {
+      ...createInitialState({
+        ...config,
+        layout: cloneLayout(floatingOnlyLayout),
+        layouts: [{ name: "Default", layout: cloneLayout(floatingOnlyLayout) }],
+      }),
+      focusedPaneId: "ticker-detail:main",
+    };
+
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <DialogProvider dialogOptions={{ style: { backgroundColor: "#000000", borderColor: "#ffffff", borderStyle: "single" } }}>
+          <Shell pluginRegistry={createShellPluginRegistry({
+            tickerDetailComponent: ({ width, height }) => (
+              <box flexDirection="column" width={width} height={height}>
+                <box flexGrow={1} />
+                <box paddingLeft={1}>
+                  <text>Footer Probe</text>
+                </box>
+              </box>
+            ),
+          })} />
+        </DialogProvider>
+      </AppContext>,
+      { width: 40, height: 12 },
+    );
+
+    await act(async () => {
+      await testSetup!.renderOnce();
+      await testSetup!.renderOnce();
+    });
+
+    expect(testSetup.captureCharFrame()).toContain("Footer Probe");
+  });
 });

package/src/components/layout/shell.tsx

@@ -5,10 +5,7 @@ import { saveConfig } from "../../data/config-store";
 import {
   MIN_FLOAT_HEIGHT,
   MIN_FLOAT_WIDTH,
-  addPaneFloating,
-  addPaneToLayout,
   applyDrop,
-  bringToFront,
   findDockLeaf,
   floatAtRect,
   floatPane,
@@ -29,7 +26,7 @@ import {
   type ResolvedPane,
 } from "../../plugins/pane-manager";
 import type { PluginRegistry } from "../../plugins/registry";
-import { removePaneInstances, createPaneInstance, type LayoutConfig } from "../../types/config";
+import { removePaneInstances, type LayoutConfig } from "../../types/config";
 import {
   PaneInstanceProvider,
   resolveCollectionForPane,
@@ -41,6 +38,7 @@ import { PANE_HEADER_ACTION, PANE_HEADER_CLOSE } from "./pane-header";
 import { getNativeSurfaceManager, type NativeOccluder, type NativePaneLayer } from "../chart/native/surface-manager";
 import { FloatingPaneWrapper } from "./floating-pane";
 import { PaneWrapper } from "./pane";
+import { getPaneBodyHeight } from "./pane-sizing";
 
 interface ShellProps {
   pluginRegistry: PluginRegistry;
@@ -435,12 +433,13 @@ function resolveSnapGuide(x: number, y: number, guides: SnapGuide[]): SnapGuide
 
 function resolveHeaderHitAreas(
   width: number,
-  options: { floating: boolean },
+  options: { floating: boolean; focused: boolean },
 ): {
   actionStart: number | null;
   closeStart: number | null;
 } {
-  let rightEdge = width;
+  // When focused, the header renders ┌─...─┐ adding 2 chars on each side
+  let rightEdge = options.focused ? width - 2 : width;
   let closeStart: number | null = null;
   let actionStart: number | null = null;
 
@@ -463,7 +462,6 @@ function menuForPane(
   persistLayout: (nextLayout: LayoutConfig, options?: { pushHistory?: boolean }) => void,
   focusPane: (paneId: string) => void,
   openPaneSettings: (paneId: string) => void,
-  openLayoutMenu: () => void,
 ) {
   const baseActions: Array<{ id: string; label: string; action: () => void }> = [];
   if (pluginRegistry.hasPaneSettings(pane.instance.instanceId)) {
@@ -483,11 +481,6 @@ function menuForPane(
         focusPane(pane.instance.instanceId);
       },
     });
-    baseActions.push({
-      id: "front",
-      label: "Bring To Front",
-      action: () => persistLayout(bringToFront(layout, pane.instance.instanceId), { pushHistory: false }),
-    });
   } else {
     baseActions.push({
       id: "float",
@@ -499,37 +492,6 @@ function menuForPane(
     });
   }
 
-  baseActions.push({
-    id: "duplicate",
-    label: "Duplicate",
-    action: () => {
-      const duplicate = createPaneInstance(pane.instance.paneId, {
-        title: pane.instance.title,
-        binding: pane.instance.binding,
-        params: pane.instance.params,
-        settings: pane.instance.settings,
-      });
-      const nextLayout = pane.floating
-        ? floatAtRect(addPaneFloating(layout, duplicate, width, contentHeight, pane.def), duplicate.instanceId, {
-          x: Math.max(0, pane.floating.x + 2),
-          y: Math.max(0, pane.floating.y + 1),
-          width: pane.floating.width,
-          height: pane.floating.height,
-        })
-        : addPaneToLayout(layout, duplicate, { relativeTo: pane.instance.instanceId, position: "right" });
-      persistLayout(nextLayout);
-      focusPane(duplicate.instanceId);
-    },
-  });
-  baseActions.push({ id: "swap", label: "Swap With...", action: openLayoutMenu });
-  baseActions.push({
-    id: "close",
-    label: "Close",
-    action: () => {
-      persistLayout(removePane(layout, pane.instance.instanceId));
-    },
-  });
-
   return baseActions;
 }
 
@@ -739,10 +701,9 @@ export function Shell({ pluginRegistry }: ShellProps) {
         persistLayout,
         focusPane,
         openPaneSettings,
-        openLayoutMenu,
       ),
     });
-  }, [contentHeight, focusPane, openLayoutMenu, openPaneSettings, paneMap, persistLayout, pluginRegistry, visibleLayout, width]);
+  }, [contentHeight, focusPane, openPaneSettings, paneMap, persistLayout, pluginRegistry, visibleLayout, width]);
 
   const handleFloatingClose = useCallback((paneId: string) => {
     persistLayout(removePane(visibleLayout, paneId));
@@ -768,13 +729,12 @@ export function Shell({ pluginRegistry }: ShellProps) {
         if (!pointInRect({ x: rect.x, y: rect.y, width: rect.width, height: rect.height }, event.x, shellY)) continue;
         const relativeX = event.x - rect.x;
         const relativeY = shellY - rect.y;
+        const isFocused = state.focusedPaneId === pane.instance.instanceId;
         const headerAreas = resolveHeaderHitAreas(rect.width, {
           floating: true,
+          focused: isFocused,
         });
         focusPane(pane.instance.instanceId);
-        if ((pane.floating?.zIndex ?? 50) < 999) {
-          persistLayout(bringToFront(visibleLayout, pane.instance.instanceId), { pushHistory: false });
-        }
         if (relativeY === 0 && headerAreas.closeStart != null && relativeX >= headerAreas.closeStart && relativeX < rect.width) {
           handleFloatingClose(pane.instance.instanceId);
           event.stopPropagation();
@@ -850,8 +810,10 @@ export function Shell({ pluginRegistry }: ShellProps) {
         if (!pane) continue;
         const relativeX = event.x - leaf.rect.x;
         const relativeY = shellY - leaf.rect.y;
+        const isFocused = state.focusedPaneId === leaf.instanceId;
         const headerAreas = resolveHeaderHitAreas(leaf.rect.width, {
           floating: false,
+          focused: isFocused,
         });
         focusPane(leaf.instanceId);
         if (relativeY === 0
@@ -1021,8 +983,9 @@ export function Shell({ pluginRegistry }: ShellProps) {
       {dockLeafLayouts.map((leaf) => {
         const pane = paneMap.get(leaf.instanceId);
         if (!pane) return null;
-        const focused = state.focusedPaneId === leaf.instanceId && !overlayOpen;
+        const focused = state.focusedPaneId === leaf.instanceId && (!overlayOpen || menuState?.paneId === leaf.instanceId);
         const showActions = focused || hoveredPaneId === leaf.instanceId || menuState?.paneId === leaf.instanceId;
+        const bodyHeight = getPaneBodyHeight(leaf.rect.height);
         return (
           <box
             key={`dock:${leaf.instanceId}`}
@@ -1046,7 +1009,7 @@ export function Shell({ pluginRegistry }: ShellProps) {
                   paneType={pane.instance.paneId}
                   focused={focused}
                   width={leaf.rect.width}
-                  height={leaf.rect.height - 1}
+                  height={bodyHeight}
                 />
               </PaneInstanceProvider>
             </PaneWrapper>
@@ -1056,8 +1019,9 @@ export function Shell({ pluginRegistry }: ShellProps) {
 
       {floatingPanes.map((pane) => {
         const preview = dragFloatingRect?.paneId === pane.instance.instanceId ? dragFloatingRect.rect : pane.floating!;
-        const focused = state.focusedPaneId === pane.instance.instanceId && !overlayOpen;
+        const focused = state.focusedPaneId === pane.instance.instanceId && (!overlayOpen || menuState?.paneId === pane.instance.instanceId);
         const showActions = focused || hoveredPaneId === pane.instance.instanceId || menuState?.paneId === pane.instance.instanceId;
+        const bodyHeight = getPaneBodyHeight(preview.height);
         return (
           <FloatingPaneWrapper
             key={`float:${pane.instance.instanceId}`}
@@ -1077,7 +1041,7 @@ export function Shell({ pluginRegistry }: ShellProps) {
                 paneType={pane.instance.paneId}
                 focused={focused}
                 width={preview.width}
-                height={preview.height - 1}
+                height={bodyHeight}
                 close={() => handleFloatingClose(pane.instance.instanceId)}
               />
             </PaneInstanceProvider>
@@ -1108,6 +1072,57 @@ export function Shell({ pluginRegistry }: ShellProps) {
         );
       })}
 
+      {/* Focus border overlay — rendered on top of the focused pane */}
+      {(() => {
+        if (!state.focusedPaneId) return null;
+        // Hide border when command bar or dialog is open, but keep it when just the pane menu is open
+        if (overlayOpen && !menuState) return null;
+        let rect: { x: number; y: number; width: number; height: number } | null = null;
+        let z = 3;
+        // Check floating panes first (they render on top of docked panes)
+        const floatingPane = floatingPanes.find((p) => p.instance.instanceId === state.focusedPaneId);
+        if (floatingPane) {
+          rect = dragFloatingRect?.paneId === floatingPane.instance.instanceId
+            ? dragFloatingRect.rect
+            : floatingPane.floating!;
+          z = (floatingPane.floating?.zIndex ?? 50) + 1;
+        } else {
+          // Check docked panes
+          const dockedLeaf = dockLeafLayouts.find((l) => l.instanceId === state.focusedPaneId);
+          if (dockedLeaf) {
+            rect = dockedLeaf.rect;
+          }
+        }
+        if (!rect || rect.height < 2) return null;
+        const bc = colors.borderFocused;
+        const isFloating = !!floatingPane;
+        const bodyTop = rect.y + 1; // below header (header renders its own border edges)
+        const bodyH = rect.height - 2; // rows between header and bottom edge
+        return (
+          <>
+            {/* Left edge — body only */}
+            {bodyH > 0 && (
+              <box key="focus-l" position="absolute" left={rect.x} top={bodyTop} width={1} height={bodyH} zIndex={z}>
+                <text fg={bc} selectable={false}>{"│".repeat(bodyH)}</text>
+              </box>
+            )}
+            {/* Right edge — body only */}
+            {bodyH > 0 && (
+              <box key="focus-r" position="absolute" left={rect.x + rect.width - 1} top={bodyTop} width={1} height={bodyH} zIndex={z}>
+                <text fg={bc} selectable={false}>{"│".repeat(bodyH)}</text>
+              </box>
+            )}
+            {/* Bottom edge — for floating, leave last 2 chars for resize handle (rendered by FloatingPaneWrapper) */}
+            <box key="focus-b" position="absolute" left={rect.x} top={rect.y + rect.height - 1} width={isFloating ? Math.max(0, rect.width - 2) : rect.width} height={1} zIndex={z}>
+              <text fg={bc} selectable={false}>{isFloating
+                ? `└${"─".repeat(Math.max(0, rect.width - 4))}─`
+                : `└${"─".repeat(Math.max(0, rect.width - 2))}┘`
+              }</text>
+            </box>
+          </>
+        );
+      })()}
+
       {activeHoverOverlay && activeHoverOverlay.cells.map((cell) => {
         const active = dockPreview?.kind === "dock"
           && dockPreview.target.kind === "leaf"

package/src/components/layout/status-bar.test.tsx

@@ -170,4 +170,70 @@ describe("StatusBar", () => {
       globalThis.clearTimeout = originalClearTimeout;
     }
   });
+
+  test("separates listing venue, session, and source labels", async () => {
+    const config = createDefaultConfig("/tmp/gloomberb-test");
+    config.layout.instances = config.layout.instances.map((instance) => (
+      instance.instanceId === "ticker-detail:main"
+        ? { ...instance, binding: { kind: "fixed" as const, symbol: "AMD" } }
+        : instance
+    ));
+    const state = createInitialState(config);
+    state.statusBarVisible = true;
+    state.focusedPaneId = "ticker-detail:main";
+    state.tickers = new Map([["AMD", {
+      metadata: {
+        ticker: "AMD",
+        exchange: "NASDAQ",
+        currency: "USD",
+        name: "Advanced Micro Devices",
+        portfolios: [],
+        watchlists: [],
+        positions: [],
+        custom: {},
+        tags: [],
+      },
+    }]]);
+    state.financials = new Map([["AMD", {
+      annualStatements: [],
+      quarterlyStatements: [],
+      priceHistory: [],
+      quote: {
+        symbol: "AMD",
+        providerId: "ibkr",
+        dataSource: "live",
+        price: 100,
+        currency: "USD",
+        change: 1,
+        changePercent: 1,
+        lastUpdated: Date.now(),
+        listingExchangeName: "NASDAQ",
+        routingExchangeName: "SMART",
+        marketState: "PRE",
+        sessionConfidence: "derived",
+        preMarketPrice: 101,
+        preMarketChange: 2,
+        preMarketChangePercent: 2,
+        provenance: {
+          price: { providerId: "ibkr", dataSource: "live" },
+          session: { providerId: "yahoo", dataSource: "yahoo" },
+        },
+      },
+    }]]);
+
+    testSetup = await testRender(
+      <AppContext value={{ state, dispatch: () => {} }}>
+        <StatusBar />
+      </AppContext>,
+      { width: 120, height: 1 },
+    );
+
+    await testSetup.renderOnce();
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("NASDAQ PRE-MKT");
+    expect(frame).toContain("px IBKR live");
+    expect(frame).toContain("ses Yahoo");
+    expect(frame).not.toContain("SMART OPEN");
+  });
 });

package/src/components/layout/status-bar.tsx

@@ -1,7 +1,13 @@
 import { useEffect, useState } from "react";
 import { colors, hoverBg } from "../../theme/colors";
 import { useAppState, useFocusedTicker } from "../../state/app-context";
-import { marketStateLabel, marketStateColor, exchangeShortName, getExtendedHoursInfo } from "../../utils/market-status";
+import {
+  marketStateLabel,
+  marketStateColor,
+  exchangeShortName,
+  getExtendedHoursInfo,
+  quoteSourceLabel,
+} from "../../utils/market-status";
 import { getSharedRegistry } from "../../plugins/registry";
 import { gridlockAllPanes } from "../../plugins/pane-manager";
 
@@ -23,7 +29,12 @@ export function StatusBar() {
 
   const q = focusedFinancials?.quote;
   const mktState = q?.marketState;
-  const exchName = q ? exchangeShortName(q.exchangeName, q.fullExchangeName) : "";
+  const exchName = q
+    ? exchangeShortName(q.listingExchangeName ?? q.exchangeName, q.listingExchangeFullName ?? q.fullExchangeName)
+    : "";
+  const sessionLabel = mktState ? marketStateLabel(mktState) : "?";
+  const priceSourceLabel = q?.provenance?.price ? quoteSourceLabel(q.provenance.price, "price") : "";
+  const sessionSourceLabel = q?.provenance?.session ? quoteSourceLabel(q.provenance.session, "session") : "";
 
   // Extended hours info for selected ticker
   const extInfo = getExtendedHoursInfo(focusedFinancials?.quote);
@@ -124,13 +135,23 @@ export function StatusBar() {
           <text fg={extColor}>{symbol} {extText}</text>
         </box>
       )}
-      {mktState && (
+      {(exchName || mktState || q?.provenance?.session) && (
         <box paddingRight={1}>
-          <text fg={marketStateColor(mktState)}>
-            {exchName ? `${exchName} ` : ""}{marketStateLabel(mktState)}
+          <text fg={mktState ? marketStateColor(mktState) : colors.textDim}>
+            {exchName ? `${exchName} ` : ""}{sessionLabel}
           </text>
         </box>
       )}
+      {priceSourceLabel && (
+        <box paddingRight={1}>
+          <text fg={colors.textDim}>px {priceSourceLabel}</text>
+        </box>
+      )}
+      {sessionSourceLabel && sessionSourceLabel !== priceSourceLabel && (
+        <box paddingRight={1}>
+          <text fg={colors.textDim}>ses {sessionSourceLabel}</text>
+        </box>
+      )}
       {/* Plugin status widgets */}
       {registry && <registry.Slot name="status:widget" />}
     </box>