gloomberb 0.11.0 → 0.11.2

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

@@ -21,6 +21,7 @@ import {
   syncConfigActiveLayoutState,
   useAppDispatch,
   useAppSelector,
+  useAppStateRef,
 } from "../../../state/app/context";
 import {
   selectCommandBarOpen,
@@ -37,6 +38,7 @@ import {
   menuForPane,
   menuItemsForFallback,
 } from "./menu";
+import { tickerLinkMenuItems } from "./ticker-link-menu";
 import {
   makeSnapGuides,
   resolveExternalDockPreview,
@@ -58,6 +60,7 @@ import {
   useShellResolvedPanes,
   useShellVisibleLayout,
 } from "./layout-state";
+import { AuthDialogHost } from "../../../plugins/builtin/cloud/auth-dialog";
 import { DeviceSignInDialogHost } from "../../../plugins/builtin/cloud/device-signin-dialog";
 import { useShellPaneActions } from "./pane/actions";
 import { resolvePaneFocusSourceLayout } from "./fullscreen";
@@ -66,6 +69,9 @@ import {
   resolveShellCursorOcclusionRects,
   useShellCursorOcclusionGuard,
 } from "./cursor-occlusion";
+import { createShare, openLiveShareUrl } from "../../../shares/api";
+import { buildPaneSharePayload } from "../../../shares/pane";
+import type { SharePayload } from "../../../shares/payload";
 
 export { resolveAppHeaderHeightCells } from "./chrome";
 export { buildNativeWindowState } from "./native/window-state";
@@ -99,13 +105,14 @@ export function Shell({
   const previousFocusedPaneId = useAppSelector((state) => state.previousFocusedPaneId);
   const activePanel = useAppSelector((state) => state.activePanel);
   const commandBarOpen = useAppSelector(selectCommandBarOpen);
+  const stateRef = useAppStateRef();
   const inputCaptured = useAppSelector((state) => state.inputCaptured);
   const statusBarVisible = useAppSelector(selectStatusBarVisible);
   const rendererHost = useRendererHost();
   const { setTransientLayout } = useTransientLayout();
   const uiKind = useUiHost().kind;
   const shortcutDisplayMode = getShortcutDisplayMode(uiKind);
-  const { nativePaneChrome = false, nativeContextMenu, precisePointer, titleBarOverlay, cellHeightPx } = useUiCapabilities();
+  const { nativePaneChrome = false, nativeContextMenu, precisePointer, publicSharing, titleBarOverlay, cellHeightPx } = useUiCapabilities();
   const { showContextMenu } = useContextMenu();
   const { width, height } = useViewport();
   const shellRef = useRef<BoxRenderable | null>(null);
@@ -118,8 +125,9 @@ export function Shell({
   const dialogOpen = useDialogState((dialog) => dialog.isOpen);
   const [hoveredPaneId, setHoveredPaneId] = useState<string | null>(null);
   const setHoveredPaneIfChanged = useCallback((paneId: string | null) => {
+    if (commandBarOpen) return;
     setHoveredPaneId((current) => (current === paneId ? current : paneId));
-  }, []);
+  }, [commandBarOpen]);
   const [menuState, setMenuState] = useState<ActionMenuState | null>(null);
   const [transientFocusLayoutState, setTransientFocusLayoutState] = useState<TransientFocusLayoutState | null>(null);
   const transientFocusLayoutStateRef = useRef<TransientFocusLayoutState | null>(null);
@@ -130,6 +138,9 @@ export function Shell({
     setHoveredMenuItemId(null);
   }, []);
   const overlayOpen = commandBarOpen || dialogOpen || !!menuState;
+  useEffect(() => {
+    if (commandBarOpen) setHoveredPaneId(null);
+  }, [commandBarOpen]);
 
   const dragRuntime = useShellDragRuntimeState({
     contentHeight,
@@ -164,13 +175,14 @@ export function Shell({
     dispatch(hasFocusTarget
       ? { type: "UPDATE_LAYOUT", layout: nextLayout, focusedPaneId: options.focusedPaneId ?? null }
       : { type: "UPDATE_LAYOUT", layout: nextLayout });
+    const currentState = stateRef.current;
     scheduleConfigSave(syncConfigActiveLayoutState(
-      { ...config, layout: nextLayout },
-      paneState,
-      hasFocusTarget ? (options.focusedPaneId ?? null) : focusedPaneId,
-      activePanel,
+      { ...currentState.config, layout: nextLayout },
+      currentState.paneState,
+      hasFocusTarget ? (options.focusedPaneId ?? null) : currentState.focusedPaneId,
+      currentState.activePanel,
     ));
-  }, [activePanel, config, dispatch, focusedPaneId, paneState]);
+  }, [dispatch, stateRef]);
 
   const focusPane = useCallback((paneId: string) => {
     dispatch({ type: "FOCUS_PANE", paneId });
@@ -252,7 +264,6 @@ export function Shell({
     gridlockVisiblePanes,
     handleFloatingClose,
     openFocusedPaneSettings,
-    openLayoutMenu,
     openPaneSettings,
     popOutFocusedPane,
     toggleFocusedPaneFloating,
@@ -271,6 +282,9 @@ export function Shell({
     visibleLayout,
     width,
   });
+  const openLayoutGallery = useCallback(() => {
+    pluginRegistry.showPane("layout-marketplace");
+  }, [pluginRegistry]);
   const setTransientFocusLayout = useCallback((next: TransientFocusLayoutState | null) => {
     transientFocusLayoutStateRef.current = next;
     setTransientFocusLayoutState(next);
@@ -368,24 +382,6 @@ export function Shell({
     transientFocusLayoutState,
   ]);
 
-  useShellPaneManagementShortcuts({
-    cancelActiveDrag,
-    closeAllFloatingPanes,
-    closeFocusedPane,
-    copyFocusedPaneScreenshot,
-    focusedPaneId,
-    gridlockVisiblePanes,
-    hasActiveDrag,
-    inputCaptured,
-    openFocusedPaneSettings,
-    openLayoutMenu,
-    overlayOpen,
-    popOutFocusedPane,
-    startWindowMode,
-    toggleFocusedPaneFullscreen,
-    toggleFocusedPaneFloating,
-  });
-
   const dockLeafLayouts = useMemo(() => getDockLeafLayouts(activeLayout, bounds, dockGeometryOptions), [activeLayout, bounds, dockGeometryOptions]);
   const dockDividerLayouts = useMemo(() => getDockDividerLayouts(activeLayout, bounds, dockGeometryOptions), [activeLayout, bounds, dockGeometryOptions]);
   const snapGuides = useMemo(() => makeSnapGuides(width, contentHeight), [contentHeight, width]);
@@ -422,8 +418,8 @@ export function Shell({
     [config, paneState],
   );
   const getPaneTitle = useCallback(
-    (pane: ResolvedPane): string => getPaneDisplayTitle(titleState, pane.instance, pane.def),
-    [titleState],
+    (pane: ResolvedPane): string => getPaneDisplayTitle(titleState, pane.instance, pane.def, pluginRegistry.panes),
+    [pluginRegistry.panes, titleState],
   );
   const handlePaneQuickSetting = useCallback((paneId: string, key: string, event: any) => {
     event?.preventDefault?.();
@@ -446,6 +442,51 @@ export function Shell({
       onMouseDown: (event) => handlePaneQuickSetting(paneId, setting.key, event),
     }))
   ), [config, handlePaneQuickSetting, pluginRegistry]);
+  const sharePane = useCallback(async (payload: Extract<SharePayload, { kind: "pane" }>) => {
+    try {
+      const { id } = await createShare(payload);
+      await rendererHost.copyText(openLiveShareUrl(id));
+      pluginRegistry.notify({ body: "Share link copied to clipboard", type: "success" });
+    } catch (error) {
+      pluginRegistry.notify({
+        body: error instanceof Error ? error.message : "Could not share this pane.",
+        type: "error",
+      });
+    }
+  }, [pluginRegistry, rendererHost]);
+  const shareFocusedPane = useCallback(() => {
+    if (!publicSharing || !focusedPaneId) return false;
+    const pane = paneMap.get(focusedPaneId);
+    if (!pane) return false;
+    const payload = buildPaneSharePayload(
+      pluginRegistry,
+      pane.instance,
+      paneState[focusedPaneId] ?? {},
+      resolveTickerForPane(titleState, focusedPaneId),
+    );
+    if (!payload) return false;
+    void sharePane(payload);
+    return true;
+  }, [focusedPaneId, paneMap, paneState, pluginRegistry, publicSharing, sharePane, titleState]);
+
+  useShellPaneManagementShortcuts({
+    cancelActiveDrag,
+    closeAllFloatingPanes,
+    closeFocusedPane,
+    copyFocusedPaneScreenshot,
+    focusedPaneId,
+    gridlockVisiblePanes,
+    hasActiveDrag,
+    inputCaptured,
+    openFocusedPaneSettings,
+    openLayoutGallery,
+    overlayOpen,
+    popOutFocusedPane,
+    shareFocusedPane,
+    startWindowMode,
+    toggleFocusedPaneFullscreen,
+    toggleFocusedPaneFloating,
+  });
 
   const openPaneMenu = useCallback((paneId: string, rect: LayoutBounds, event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
     const pane = paneMap.get(paneId);
@@ -458,6 +499,14 @@ export function Shell({
       title: getPaneTitle(pane),
       floating: !!pane.floating,
     };
+    const sharePayload = publicSharing
+      ? buildPaneSharePayload(
+          pluginRegistry,
+          pane.instance,
+          paneState[paneId] ?? {},
+          resolveTickerForPane(titleState, paneId),
+        )
+      : null;
     const items = menuForPane(
       pane,
       visibleLayout,
@@ -469,6 +518,14 @@ export function Shell({
       openPaneSettings,
       desktopWindowBridge,
       nativePaneChrome && rendererHost.copyPngImage ? copyPaneScreenshot : undefined,
+      sharePayload ? () => sharePane(sharePayload) : undefined,
+      tickerLinkMenuItems({
+        instance: pane.instance,
+        layout: visibleLayout,
+        panes: pluginRegistry.panes,
+        state: titleState,
+        persistLayout,
+      }),
     );
     void showContextMenu(context, items, event).then((shown) => {
       if (shown) return;
@@ -492,7 +549,7 @@ export function Shell({
         items: fallbackItems,
       });
     });
-  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, persistLayout, pluginRegistry, rendererHost.copyPngImage, shortcutDisplayMode, showContextMenu, visibleLayout, width]);
+  }, [contentHeight, copyPaneScreenshot, desktopWindowBridge, focusPane, getPaneTitle, nativePaneChrome, openPaneSettings, paneMap, paneState, persistLayout, pluginRegistry, publicSharing, rendererHost.copyPngImage, sharePane, shortcutDisplayMode, showContextMenu, titleState, visibleLayout, width]);
 
   const {
     handleFloatingCloseMouseDown,
@@ -510,7 +567,6 @@ export function Shell({
     bounds,
     closePaneMenu,
     contentHeight,
-    dispatch,
     dockGeometryOptions,
     dockDividerLayouts,
     dockLeafLayouts,
@@ -534,6 +590,7 @@ export function Shell({
     visibleLayout,
     width,
     windowMode,
+    commandBarOpen,
   });
   const windowModeDockResizePathKey = windowMode?.focus.kind === "dock-resize"
     ? windowMode.focus.pathKey
@@ -560,8 +617,9 @@ export function Shell({
         }
         : {})}
     >
-      {/* Renders nothing; gives the QR sign-in command an always-mounted component with dialog access. */}
+      {/* Render nothing; give the auth commands always-mounted components with dialog access. */}
       <DeviceSignInDialogHost />
+      <AuthDialogHost />
       <Box
         position="absolute"
         left={0}

package/src/components/layout/shell/menu.test.ts

@@ -1,7 +1,43 @@
 import { describe, expect, test } from "bun:test";
 import { displayWidth } from "../../../utils/format";
 import { getLanguage, setLanguage, t } from "../../../i18n";
-import { actionMenuWidth } from "./menu";
+import { actionMenuWidth, menuForPane } from "./menu";
+
+describe("pane action menu", () => {
+  test("offers the global share action for a portable pane", async () => {
+    let shared = false;
+    const items = menuForPane(
+      {
+        instance: { instanceId: "chart-1", paneId: "chart-composer" },
+        def: { defaultPosition: "right" },
+        floating: false,
+      } as any,
+      {
+        dockRoot: { kind: "pane", instanceId: "chart-1" },
+        instances: [{ instanceId: "chart-1", paneId: "chart-composer" }],
+        floating: [],
+        detached: [],
+      },
+      120,
+      40,
+      {
+        hasPaneSettings: () => false,
+        openWindowMode: () => {},
+      } as any,
+      () => {},
+      () => {},
+      () => {},
+      undefined,
+      undefined,
+      () => { shared = true; },
+    );
+
+    const share = items.find((item) => item.type !== "divider" && item.id === "share-pane");
+    await share?.onSelect?.();
+    expect(shared).toBe(true);
+    expect(share?.accelerator).toBe("CmdOrCtrl+Shift+S");
+  });
+});
 
 describe("action menu sizing", () => {
   test("uses translated terminal display width", () => {

package/src/components/layout/shell/menu.ts

@@ -32,6 +32,8 @@ export function menuForPane(
   openPaneSettings: (paneId: string) => void,
   desktopWindowBridge?: DesktopWindowBridge,
   copyPaneScreenshot?: (paneId: string) => void | Promise<void>,
+  sharePane?: () => void | Promise<void>,
+  linkItems: ContextMenuItem[] = [],
 ): ContextMenuItem[] {
   const baseActions: ContextMenuItem[] = [];
   if (pluginRegistry.hasPaneSettings(pane.instance.instanceId)) {
@@ -42,6 +44,14 @@ export function menuForPane(
       onSelect: () => openPaneSettings(pane.instance.instanceId),
     });
   }
+  if (sharePane) {
+    baseActions.push({
+      id: "share-pane",
+      label: "Share Pane",
+      accelerator: PANE_MANAGEMENT_ACCELERATORS.share,
+      onSelect: sharePane,
+    });
+  }
   if (copyPaneScreenshot) {
     baseActions.push({
       id: "copy-screenshot",
@@ -91,6 +101,10 @@ export function menuForPane(
     onSelect: () => persistLayout(removePane(layout, pane.instance.instanceId)),
   });
 
+  if (linkItems.length > 0) {
+    baseActions.push(contextMenuDivider("pane:link-divider"), ...linkItems);
+  }
+
   baseActions.push(
     contextMenuDivider("pane:layout-divider"),
     {

package/src/components/layout/shell/native/pointer-runtime.ts

@@ -22,6 +22,7 @@ interface UseShellNativePointerRuntimeOptions {
   setMenuState: Dispatch<SetStateAction<ActionMenuState | null>>;
   transientFocusActive: boolean;
   windowMode: WindowEditState | null;
+  commandBarOpen?: boolean;
 }
 
 export function useShellNativePointerRuntime({
@@ -38,6 +39,7 @@ export function useShellNativePointerRuntime({
   setMenuState,
   transientFocusActive,
   windowMode,
+  commandBarOpen = false,
 }: UseShellNativePointerRuntimeOptions) {
   const {
     dragRef,
@@ -59,6 +61,11 @@ export function useShellNativePointerRuntime({
   }, [focusPane, menuState, setHoveredMenuItemId, setMenuState]);
 
   const handleNativePaneMouseDown = useCallback((paneId: string, event: ShellMouseEvent) => {
+    if (commandBarOpen) {
+      event.stopPropagation();
+      event.preventDefault();
+      return;
+    }
     if (windowMode) {
       selectWindowModePane(paneId);
       event.stopPropagation();
@@ -69,10 +76,11 @@ export function useShellNativePointerRuntime({
       if (event.isDefaultPrevented?.()) return;
       focusNativePane(paneId);
     });
-  }, [focusNativePane, selectWindowModePane, windowMode]);
+  }, [commandBarOpen, focusNativePane, selectWindowModePane, windowMode]);
 
   const startNativeFloatingDrag = useCallback((paneId: string, rect: FloatingRect, event: ShellMouseEvent) => {
     if (!nativePaneChrome) return;
+    if (commandBarOpen) return;
     if (windowMode) return;
     if (transientFocusActive) return;
     if (event.button === 2) return;
@@ -89,10 +97,11 @@ export function useShellNativePointerRuntime({
     };
     updateDragFloatingRect({ paneId, rect: { x: rect.x, y: rect.y, width: rect.width, height: rect.height } });
     event.preventDefault();
-  }, [dragRef, focusNativePane, getShellPointer, nativePaneChrome, transientFocusActive, updateDragFloatingRect, windowMode]);
+  }, [commandBarOpen, dragRef, focusNativePane, getShellPointer, nativePaneChrome, transientFocusActive, updateDragFloatingRect, windowMode]);
 
   const startNativeDockedDrag = useCallback((paneId: string, rect: LayoutBounds, event: ShellMouseEvent) => {
     if (!nativePaneChrome) return;
+    if (commandBarOpen) return;
     if (windowMode) return;
     if (transientFocusActive) return;
     if (event.button === 2) return;
@@ -108,10 +117,11 @@ export function useShellNativePointerRuntime({
       origRect: { x: rect.x, y: rect.y, width: rect.width, height: rect.height },
     };
     event.preventDefault();
-  }, [dragRef, focusNativePane, getShellPointer, nativePaneChrome, transientFocusActive, windowMode]);
+  }, [commandBarOpen, dragRef, focusNativePane, getShellPointer, nativePaneChrome, transientFocusActive, windowMode]);
 
   const startNativeFloatResize = useCallback((paneId: string, rect: FloatingRect, event: ShellMouseEvent) => {
     if (!nativePaneChrome) return;
+    if (commandBarOpen) return;
     if (transientFocusActive) return;
 
     const pointer = getShellPointer(event);
@@ -130,10 +140,11 @@ export function useShellNativePointerRuntime({
     updateDragFloatingRect({ paneId, rect: { x: rect.x, y: rect.y, width: rect.width, height: rect.height } });
     event.stopPropagation();
     event.preventDefault();
-  }, [dragRef, focusNativePane, getShellPointer, nativePaneChrome, selectWindowModePane, transientFocusActive, updateDragFloatingRect, windowMode]);
+  }, [commandBarOpen, dragRef, focusNativePane, getShellPointer, nativePaneChrome, selectWindowModePane, transientFocusActive, updateDragFloatingRect, windowMode]);
 
   const startNativeDividerDrag = useCallback((divider: DockDividerLayout, event: ShellMouseEvent) => {
     if (!nativePaneChrome) return;
+    if (commandBarOpen) return;
     if (transientFocusActive) return;
 
     const pointer = getShellPointer(event);
@@ -157,27 +168,30 @@ export function useShellNativePointerRuntime({
     });
     event.stopPropagation();
     event.preventDefault();
-  }, [dragRef, getShellPointer, menuState, nativePaneChrome, setHoveredMenuItemId, setMenuState, transientFocusActive, updateDividerPreview]);
+  }, [commandBarOpen, dragRef, getShellPointer, menuState, nativePaneChrome, setHoveredMenuItemId, setMenuState, transientFocusActive, updateDividerPreview]);
 
   const handlePaneAction = useCallback((paneId: string, rect: LayoutBounds, event: ShellMouseEvent) => {
+    if (commandBarOpen) return;
     if (windowMode) return;
     if (event.button === 2) return;
     event.stopPropagation();
     event.preventDefault();
     openPaneMenu(paneId, rect, event);
-  }, [openPaneMenu, windowMode]);
+  }, [commandBarOpen, openPaneMenu, windowMode]);
 
   const handleNativePaneContextMenu = useCallback((paneId: string, rect: LayoutBounds, event: ShellMouseEvent) => {
+    if (commandBarOpen) return;
     if (windowMode) return;
     openPaneMenu(paneId, rect, event);
-  }, [openPaneMenu, windowMode]);
+  }, [commandBarOpen, openPaneMenu, windowMode]);
 
   const handleFloatingCloseMouseDown = useCallback((paneId: string, event: ShellMouseEvent) => {
+    if (commandBarOpen) return;
     if (windowMode) return;
     event.stopPropagation();
     event.preventDefault();
     handleFloatingClose(paneId);
-  }, [handleFloatingClose, windowMode]);
+  }, [commandBarOpen, handleFloatingClose, windowMode]);
 
   return {
     handleFloatingCloseMouseDown,

package/src/components/layout/shell/pane/actions.ts

@@ -54,10 +54,6 @@ export function useShellPaneActions({
   visibleLayout,
   width,
 }: UseShellPaneActionsOptions) {
-  const openLayoutMenu = useCallback(() => {
-    pluginRegistry.openCommandBar("LAY ");
-  }, [pluginRegistry]);
-
   const openPaneSettings = useCallback((paneId: string) => {
     pluginRegistry.openPaneSettingsFn(paneId);
     closePaneMenu();
@@ -143,7 +139,6 @@ export function useShellPaneActions({
     gridlockVisiblePanes,
     handleFloatingClose,
     openFocusedPaneSettings,
-    openLayoutMenu,
     openPaneSettings,
     popOutFocusedPane,
     toggleFocusedPaneFloating,

package/src/components/layout/shell/pane/management-shortcuts.ts

@@ -21,9 +21,10 @@ interface ShellPaneManagementShortcutOptions {
   hasActiveDrag(): boolean;
   inputCaptured: boolean;
   openFocusedPaneSettings(): boolean;
-  openLayoutMenu(): void;
+  openLayoutGallery(): void;
   overlayOpen: boolean;
   popOutFocusedPane(): boolean;
+  shareFocusedPane(): boolean;
   startWindowMode(paneId?: string, mode?: WindowEditMode): void;
   toggleFocusedPaneFullscreen(): boolean;
   toggleFocusedPaneFloating(): boolean;
@@ -39,9 +40,10 @@ export function useShellPaneManagementShortcuts({
   hasActiveDrag,
   inputCaptured,
   openFocusedPaneSettings,
-  openLayoutMenu,
+  openLayoutGallery,
   overlayOpen,
   popOutFocusedPane,
+  shareFocusedPane,
   startWindowMode,
   toggleFocusedPaneFullscreen,
   toggleFocusedPaneFloating,
@@ -119,8 +121,11 @@ export function useShellPaneManagementShortcuts({
       case "copy-screenshot":
         handled = copyFocusedPaneScreenshot();
         break;
-      case "layout-actions":
-        openLayoutMenu();
+      case "share":
+        handled = shareFocusedPane();
+        break;
+      case "layout-gallery":
+        openLayoutGallery();
         handled = true;
         break;
       case "gridlock-all":

package/src/components/layout/shell/shortcuts.ts

@@ -6,9 +6,10 @@ export const PANE_MANAGEMENT_ACCELERATORS = {
   toggleFloating: "CmdOrCtrl+Shift+D",
   popOut: "CmdOrCtrl+Shift+O",
   copyScreenshot: "CmdOrCtrl+Shift+C",
+  share: "CmdOrCtrl+Shift+S",
   close: "CmdOrCtrl+W",
   closeAllFloating: "CmdOrCtrl+Alt+W",
-  layoutActions: "CmdOrCtrl+Shift+L",
+  layoutGallery: "CmdOrCtrl+Shift+L",
   gridlockAll: "CmdOrCtrl+Shift+G",
   windowMode: "CmdOrCtrl+Shift+M",
   windowResizeMode: "CmdOrCtrl+Shift+R",
@@ -20,9 +21,10 @@ export type PaneManagementShortcut =
   | "toggle-floating"
   | "pop-out"
   | "copy-screenshot"
+  | "share"
   | "close"
   | "close-all-floating"
-  | "layout-actions"
+  | "layout-gallery"
   | "gridlock-all"
   | "window-mode"
   | "window-resize-mode";
@@ -39,10 +41,11 @@ export function resolvePaneManagementShortcut(
   if (!shifted && name === ",") return "settings";
   if (!shifted || event.alt) return null;
   if (name === "c") return "copy-screenshot";
+  if (name === "s") return "share";
   if (name === "d") return "toggle-floating";
   if (name === "f") return "toggle-fullscreen";
   if (name === "o") return "pop-out";
-  if (name === "l") return "layout-actions";
+  if (name === "l") return "layout-gallery";
   if (name === "g") return "gridlock-all";
   if (name === "m") return "window-mode";
   if (name === "r") return "window-resize-mode";

package/src/components/layout/shell/ticker-link-menu.test.ts

@@ -0,0 +1,82 @@
+import { describe, expect, test } from "bun:test";
+import { createInitialState } from "../../../state/app/context";
+import {
+  createDefaultConfig,
+  createPaneInstance,
+  findPaneInstance,
+  TICKER_RESEARCH_PANE_ID,
+  type LayoutConfig,
+} from "../../../types/config";
+import type { PaneDef } from "../../../types/plugin";
+import { getPaneDisplayTitle } from "../pane/title";
+import { tickerLinkMenuItems } from "./ticker-link-menu";
+
+const panes = new Map<string, PaneDef>([
+  ["portfolio-list", {
+    id: "portfolio-list",
+    name: "Portfolio",
+    component: () => null,
+    defaultPosition: "left",
+    tickerSource: true,
+  }],
+  [TICKER_RESEARCH_PANE_ID, {
+    id: TICKER_RESEARCH_PANE_ID,
+    name: "Ticker Research",
+    component: () => null,
+    defaultPosition: "right",
+  }],
+]);
+
+describe("tickerLinkMenuItems", () => {
+  test("pins the current ticker when unlinking and can link back to the source", () => {
+    const state = createInitialState(createDefaultConfig("/tmp/gloomberb-link-menu-test"));
+    state.paneState["portfolio-list:main"] = { collectionId: "main", cursorSymbol: "AAPL" };
+    const target = findPaneInstance(state.config.layout, "ticker-detail:main")!;
+    let layout: LayoutConfig = state.config.layout;
+
+    expect(getPaneDisplayTitle(state, target, panes.get(TICKER_RESEARCH_PANE_ID)!, panes)).toBe(
+      "AAPL  ⧉ Linked to Main Portfolio",
+    );
+
+    tickerLinkMenuItems({
+      instance: target,
+      layout,
+      panes,
+      state,
+      persistLayout: (nextLayout) => { layout = nextLayout; },
+    }).find((item) => item.id === "unlink:portfolio-list:main")?.onSelect?.();
+
+    const pinned = findPaneInstance(layout, target.instanceId)!;
+    expect(pinned.binding).toEqual({ kind: "fixed", symbol: "AAPL" });
+
+    const previousFollower = createPaneInstance(TICKER_RESEARCH_PANE_ID, {
+      instanceId: "ticker-detail:previous",
+      binding: { kind: "follow", sourceInstanceId: "portfolio-list:main" },
+    });
+    layout = {
+      ...layout,
+      instances: [...layout.instances, previousFollower],
+      floating: [
+        ...layout.floating,
+        { instanceId: previousFollower.instanceId, x: 1, y: 1, width: 40, height: 12 },
+      ],
+    };
+    const pinnedState = { ...state, config: { ...state.config, layout } };
+    tickerLinkMenuItems({
+      instance: pinned,
+      layout,
+      panes,
+      state: pinnedState,
+      persistLayout: (nextLayout) => { layout = nextLayout; },
+    }).find((item) => item.id === "link:portfolio-list:main")?.onSelect?.();
+
+    expect(findPaneInstance(layout, target.instanceId)?.binding).toEqual({
+      kind: "follow",
+      sourceInstanceId: "portfolio-list:main",
+    });
+    expect(findPaneInstance(layout, previousFollower.instanceId)?.binding).toEqual({
+      kind: "fixed",
+      symbol: "AAPL",
+    });
+  });
+});