gloomberb 0.16.1 → 0.16.2

package/src/components/onboarding/use-onboarding-broker-form.ts

@@ -0,0 +1,263 @@
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+  useSyncExternalStore,
+  type Dispatch,
+  type SetStateAction,
+} from "react";
+import { buildBrokerDirectory } from "../../brokers/directory";
+import { getSignedInBrokers, refreshSignedInBrokers, subscribeSignedInBrokers } from "../../brokers/signed-in/catalog";
+import { SIGNED_IN_BROKER_TYPE } from "../../brokers/signed-in/profile";
+import { resolveBrokerConfigFields, type BrokerConfigField } from "../../types/broker";
+import type { useRendererHost } from "../../ui";
+import { tf } from "../../i18n";
+import type { useAppLanguage } from "../../i18n/react";
+import type { PluginRegistry } from "../../plugins/registry";
+import type { ListViewItem } from "../ui";
+import type { PortfolioSub } from "./onboarding-steps";
+import { brokerSetupGuideUrl } from "./portfolio-step/broker-setup-panel";
+import type { useOnboardingBrokerSync } from "./wizard-broker-sync";
+import { getConnectableBrokerOptions, type BrokerOption } from "./wizard-model";
+
+export function useOnboardingBrokerFields({
+  pluginRegistry, language,
+}: {
+  pluginRegistry: PluginRegistry;
+  language: ReturnType<typeof useAppLanguage>;
+}) {
+  const [portfolioSub, setPortfolioSub] = useState<PortfolioSub>("positions");
+  const [portfolioOptionIdx, setPortfolioOptionIdx] = useState(0);
+  const [brokerValues, setBrokerValues] = useState<Record<string, Record<string, string>>>({});
+  const [selectedBrokerId, setSelectedBrokerId] = useState<string | null>(null);
+  const [brokerFieldIdx, setBrokerFieldIdx] = useState(0);
+  const [brokerSelectIdx, setBrokerSelectIdx] = useState(0);
+
+  useEffect(() => {
+    if (pluginRegistry.brokers.has(SIGNED_IN_BROKER_TYPE)) void refreshSignedInBrokers();
+  }, [pluginRegistry.brokers]);
+  const signedInBrokers = useSyncExternalStore(subscribeSignedInBrokers, getSignedInBrokers, getSignedInBrokers);
+  const brokerOptions = useMemo(
+    (): BrokerOption[] => getConnectableBrokerOptions(buildBrokerDirectory({
+      signedIn: signedInBrokers,
+      adapters: pluginRegistry.brokers.values(),
+    })),
+    [pluginRegistry.brokers, signedInBrokers],
+  );
+  const brokerChoices = useMemo<ListViewItem[]>(() => brokerOptions.map((broker) => ({
+    id: broker.id,
+    label: tf("Connect {broker}", { broker: broker.name }),
+    // A broker offered two ways shows which way each choice connects.
+    description: broker.methodLabel ?? tf("Import positions from {broker}", { broker: broker.name }),
+  })), [brokerOptions, language]);
+  const activeBrokerFields = useMemo((): BrokerConfigField[] => {
+    if (!selectedBrokerId) return [];
+    const adapter = brokerOptions.find((option) => option.id === selectedBrokerId)?.adapter;
+    return adapter
+      ? resolveBrokerConfigFields(adapter, brokerValues[selectedBrokerId] ?? {}).filter((field) => field.required)
+      : [];
+  }, [brokerOptions, brokerValues, selectedBrokerId]);
+
+  return {
+    portfolioSub, setPortfolioSub, portfolioOptionIdx, setPortfolioOptionIdx, brokerValues, setBrokerValues,
+    selectedBrokerId, setSelectedBrokerId, brokerFieldIdx, setBrokerFieldIdx, brokerSelectIdx,
+    setBrokerSelectIdx, brokerOptions, brokerChoices, activeBrokerFields,
+  };
+}
+
+export function useOnboardingBrokerForm({
+  selectedBrokerId, activeBrokerFields, brokerFieldIdx, brokerValues, setBrokerSelectIdx, resetBrokerSync,
+  setBrokerValues, setSelectedBrokerId, setBrokerFieldIdx, brokerOptions, setEditingField,
+  connectSignedInBroker, setPortfolioSub, portfolioOptionIdx, brokerChoices, setPortfolioOptionIdx,
+  isBrokerSyncing, syncSelectedBroker, brokerSelectIdx, portfolioSub, continueFromPositions, brokerSyncError,
+  rendererHost,
+}: {
+  selectedBrokerId: string | null;
+  activeBrokerFields: BrokerConfigField[];
+  brokerFieldIdx: number;
+  brokerValues: Record<string, Record<string, string>>;
+  setBrokerSelectIdx: Dispatch<SetStateAction<number>>;
+  resetBrokerSync: () => boolean;
+  setBrokerValues: Dispatch<SetStateAction<Record<string, Record<string, string>>>>;
+  setSelectedBrokerId: Dispatch<SetStateAction<string | null>>;
+  setBrokerFieldIdx: Dispatch<SetStateAction<number>>;
+  brokerOptions: BrokerOption[];
+  setEditingField: Dispatch<SetStateAction<boolean>>;
+  connectSignedInBroker: ReturnType<typeof useOnboardingBrokerSync>["connectSignedInBroker"];
+  setPortfolioSub: Dispatch<SetStateAction<PortfolioSub>>;
+  portfolioOptionIdx: number;
+  brokerChoices: ListViewItem[];
+  setPortfolioOptionIdx: Dispatch<SetStateAction<number>>;
+  isBrokerSyncing: boolean;
+  syncSelectedBroker: (brokerValueOverrides?: Record<string, string> | undefined) => Promise<void>;
+  brokerSelectIdx: number;
+  portfolioSub: PortfolioSub;
+  continueFromPositions: () => void;
+  brokerSyncError: string | null;
+  rendererHost: ReturnType<typeof useRendererHost>;
+}) {
+  useEffect(() => {
+    if (!selectedBrokerId) return;
+    const field = activeBrokerFields[brokerFieldIdx];
+    if (!field || field.type !== "select") return;
+    const currentValue = brokerValues[selectedBrokerId]?.[field.key] ?? field.options?.[0]?.value ?? "";
+    const index = Math.max(0, field.options?.findIndex((option) => option.value === currentValue) ?? 0);
+    setBrokerSelectIdx(index);
+  }, [activeBrokerFields, brokerFieldIdx, brokerValues, selectedBrokerId]);
+
+  const setBrokerFieldValue = useCallback((brokerId: string, key: string, value: string) => {
+    resetBrokerSync();
+    setBrokerValues((previous) => ({
+      ...previous,
+      [brokerId]: { ...previous[brokerId], [key]: value },
+    }));
+  }, [resetBrokerSync]);
+
+  const selectBroker = useCallback((brokerId: string) => {
+    resetBrokerSync();
+    setSelectedBrokerId(brokerId);
+    setBrokerFieldIdx(0);
+    const broker = brokerOptions.find((option) => option.id === brokerId);
+    if (broker?.signedIn) {
+      // Nothing to fill in: the connect dialog opens over this step.
+      setEditingField(false);
+      void connectSignedInBroker(broker.signedIn);
+      return;
+    }
+    setPortfolioSub("broker-fields");
+    const firstField = broker?.adapter
+      ? resolveBrokerConfigFields(broker.adapter, brokerValues[brokerId] ?? {}).filter((field) => field.required)[0]
+      : null;
+    setEditingField(firstField?.type !== "select");
+  }, [brokerOptions, brokerValues, connectSignedInBroker, resetBrokerSync]);
+
+  const chooseBroker = useCallback((choiceIndex = portfolioOptionIdx) => {
+    const choice = brokerChoices[choiceIndex];
+    if (choice) selectBroker(choice.id);
+  }, [brokerChoices, portfolioOptionIdx, selectBroker]);
+
+  /** Broker import is the secondary path: one broker goes straight to its fields. */
+  const openBrokerConnect = useCallback(() => {
+    if (brokerOptions.length === 0) return;
+    setEditingField(false);
+    if (brokerOptions.length === 1) {
+      selectBroker(brokerOptions[0]!.id);
+      return;
+    }
+    setPortfolioOptionIdx(0);
+    setPortfolioSub("choose");
+  }, [brokerOptions, selectBroker]);
+
+  const submitBrokerField = useCallback(() => {
+    if (!selectedBrokerId || isBrokerSyncing) return;
+    const field = activeBrokerFields[brokerFieldIdx];
+    if (!field) {
+      void syncSelectedBroker();
+      return;
+    }
+
+    const currentValues = brokerValues[selectedBrokerId] ?? {};
+    if (field.type === "select") {
+      const option = field.options?.[brokerSelectIdx];
+      if (!option) return;
+      const nextValues = { ...currentValues, [field.key]: option.value };
+      setBrokerFieldValue(selectedBrokerId, field.key, option.value);
+      const adapter = brokerOptions.find((entry) => entry.id === selectedBrokerId)?.adapter;
+      const nextFields = adapter
+        ? resolveBrokerConfigFields(adapter, nextValues).filter((entry) => entry.required)
+        : activeBrokerFields;
+      if (brokerFieldIdx < nextFields.length - 1) {
+        const nextIndex = brokerFieldIdx + 1;
+        setBrokerFieldIdx(nextIndex);
+        if (field.key === "connectionMode") {
+          setPortfolioSub("broker-setup");
+        } else {
+          setEditingField(nextFields[nextIndex]?.type !== "select");
+        }
+        return;
+      }
+      void syncSelectedBroker(nextValues);
+      return;
+    }
+
+    const rawValue = currentValues[field.key]?.trim() ?? "";
+    const value = rawValue || field.defaultValue || "";
+    if (!value) {
+      setEditingField(true);
+      return;
+    }
+    const nextValues = { ...currentValues, [field.key]: value };
+    if (!rawValue && field.defaultValue) {
+      setBrokerFieldValue(selectedBrokerId, field.key, field.defaultValue);
+    }
+    setEditingField(false);
+    if (brokerFieldIdx < activeBrokerFields.length - 1) {
+      const nextIndex = brokerFieldIdx + 1;
+      setBrokerFieldIdx(nextIndex);
+      setEditingField(activeBrokerFields[nextIndex]?.type !== "select");
+      return;
+    }
+    void syncSelectedBroker(nextValues);
+  }, [
+    activeBrokerFields,
+    brokerFieldIdx,
+    brokerOptions,
+    brokerSelectIdx,
+    brokerValues,
+    isBrokerSyncing,
+    selectedBrokerId,
+    setBrokerFieldValue,
+    syncSelectedBroker,
+  ]);
+
+  const continuePortfolio = useCallback(() => {
+    if (portfolioSub === "positions") {
+      continueFromPositions();
+      return;
+    }
+    if (portfolioSub === "choose") {
+      chooseBroker();
+      return;
+    }
+    if (portfolioSub === "broker-setup") {
+      setPortfolioSub("broker-fields");
+      setEditingField(activeBrokerFields[brokerFieldIdx]?.type !== "select");
+      return;
+    }
+    if (portfolioSub === "broker-sync") {
+      if (!isBrokerSyncing && brokerSyncError) void syncSelectedBroker();
+      return;
+    }
+    submitBrokerField();
+  }, [
+    activeBrokerFields,
+    brokerFieldIdx,
+    brokerSyncError,
+    chooseBroker,
+    continueFromPositions,
+    isBrokerSyncing,
+    portfolioSub,
+    submitBrokerField,
+    syncSelectedBroker,
+  ]);
+
+  const backPortfolio = useCallback(() => {
+    if (portfolioSub === "positions") return;
+    if (portfolioSub === "broker-sync" && !resetBrokerSync()) return;
+    setPortfolioSub("positions");
+    setSelectedBrokerId(null);
+    setBrokerFieldIdx(0);
+    setEditingField(false);
+  }, [portfolioSub, resetBrokerSync]);
+
+  const openBrokerGuide = useCallback(() => {
+    const url = selectedBrokerId ? brokerSetupGuideUrl(selectedBrokerId, brokerValues) : null;
+    if (url) void rendererHost.openExternal(url).catch(() => {});
+  }, [brokerValues, rendererHost, selectedBrokerId]);
+
+  return {
+    setBrokerFieldValue, chooseBroker, openBrokerConnect, submitBrokerField, continuePortfolio,
+    backPortfolio, openBrokerGuide,
+  };
+}

package/src/components/onboarding/use-onboarding-progress.ts

@@ -0,0 +1,298 @@
+import { useCallback, useRef, useState, type Dispatch, type SetStateAction, type RefObject } from "react";
+import { recordResearchActivity } from "../../api-client/research-activity";
+import { apiClient } from "../../api-client";
+import type { SyncBrokerInstanceResult } from "../../brokers/sync-broker-instance";
+import { saveConfigImmediately } from "../../state/config-save-scheduler";
+import type { AppConfig, OnboardingProgress } from "../../types/config";
+import type { useAppDispatch, useAppStateRef } from "../../state/app/context";
+import { t } from "../../i18n";
+import type { PluginRegistry } from "../../plugins/registry";
+import { resolvePlanAccess } from "../../api-client/plan-access";
+import type { PortfolioSub } from "./onboarding-steps";
+import type { useOnboardingPositions } from "./wizard-positions";
+import { applyFirstRunLayout, buildFirstRunLayout, planFirstRunWatchlist } from "./first-run-workspace";
+import { buildDesk, getDesk, isDeskKey, isDeskStock, pickDeskCompany, type DeskKey } from "../../layout/desks";
+import { debugLog } from "../../utils/debug-log";
+import {
+  getOnboardingProgress,
+  pickLargestBrokerPosition,
+  pickLargestPosition,
+  withOnboardingProgress,
+  type BrokerOption,
+} from "./wizard-model";
+
+const onboardingLog = debugLog.createLogger("onboarding");
+
+export function useOnboardingProgress({
+  stateRef, dispatch,
+}: {
+  stateRef: ReturnType<typeof useAppStateRef>;
+  dispatch: ReturnType<typeof useAppDispatch>;
+}) {
+  const [persistenceError, setPersistenceError] = useState<string | null>(null);
+  const [isFinishing, setIsFinishing] = useState(false);
+  const progressSaveQueueRef = useRef<Promise<void>>(Promise.resolve());
+  const finishingRef = useRef(false);
+
+  const persistProgress = useCallback(async (
+    patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">,
+    baseConfig?: AppConfig,
+  ): Promise<AppConfig> => {
+    if (finishingRef.current) return stateRef.current.config;
+    setPersistenceError(null);
+    const operation = progressSaveQueueRef.current
+      .catch(() => {})
+      .then(async () => {
+        if (finishingRef.current) return stateRef.current.config;
+        const nextConfig = withOnboardingProgress(baseConfig ?? stateRef.current.config, patch);
+        try {
+          await saveConfigImmediately(nextConfig);
+          dispatch({
+            type: "SET_ONBOARDING_STATE",
+            complete: false,
+            progress: nextConfig.onboardingProgress,
+          });
+          return nextConfig;
+        } catch (error) {
+          const message = error instanceof Error ? error.message : String(error);
+          setPersistenceError(message || t("Unable to save onboarding progress."));
+          throw error;
+        }
+      });
+    progressSaveQueueRef.current = operation.then(() => {}, () => {});
+    return operation;
+  }, [dispatch, stateRef]);
+
+  const saveProgressInBackground = useCallback((
+    patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">,
+    baseConfig?: AppConfig,
+  ) => {
+    void persistProgress(patch, baseConfig).catch(() => {});
+  }, [persistProgress]);
+
+  return {
+    persistenceError, setPersistenceError, isFinishing, setIsFinishing, progressSaveQueueRef, finishingRef,
+    persistProgress, saveProgressInBackground,
+  };
+}
+
+export function useOnboardingWorkspace({
+  stateRef, pluginRegistry, dispatch, positions, setEditingField, saveProgressInBackground,
+  setPersistenceError, finishingRef, brokerOptions, selectedBrokerId, setPortfolioSub,
+}: {
+  stateRef: ReturnType<typeof useAppStateRef>;
+  pluginRegistry: PluginRegistry;
+  dispatch: ReturnType<typeof useAppDispatch>;
+  positions: ReturnType<typeof useOnboardingPositions>;
+  setEditingField: Dispatch<SetStateAction<boolean>>;
+  saveProgressInBackground: (patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">, baseConfig?: AppConfig | undefined) => void;
+  setPersistenceError: Dispatch<SetStateAction<string | null>>;
+  finishingRef: RefObject<boolean>;
+  brokerOptions: BrokerOption[];
+  selectedBrokerId: string | null;
+  setPortfolioSub: Dispatch<SetStateAction<PortfolioSub>>;
+}) {
+  const [chosenDesks, setChosenDesks] = useState<DeskKey[]>([]);
+  const [deskCursor, setDeskCursor] = useState(0);
+  const [buildingDesks, setBuildingDesks] = useState(false);
+  const buildingDesksRef = useRef(false);
+
+  /**
+   * Seeds the watchlist and swaps Home for the first-run workspace built
+   * around `symbol`, with the picked desks as tabs right after it. The config
+   * comes back for the caller to persist with its own progress patch.
+   */
+  const buildFirstRunWorkspace = useCallback(async (
+    baseConfig: AppConfig,
+    symbol: string,
+    portfolioId: string,
+    desks: readonly DeskKey[],
+  ): Promise<AppConfig> => {
+    let config = baseConfig;
+    let watchlistId = config.watchlists[0]?.id;
+    if (!watchlistId) {
+      watchlistId = "watchlist";
+      config = { ...config, watchlists: [{ id: watchlistId, name: "Watchlist" }] };
+    }
+    const plan = planFirstRunWatchlist(stateRef.current.tickers, watchlistId, portfolioId);
+    for (const metadata of plan.create) {
+      try {
+        const ticker = await pluginRegistry.tickerRepository.createTicker(metadata);
+        dispatch({ type: "UPDATE_TICKER", ticker });
+        pluginRegistry.events.emit("ticker:added", { symbol: ticker.metadata.ticker, ticker });
+      } catch (error) {
+        onboardingLog.error("First-run watchlist seed failed", { symbol: metadata.ticker, error: String(error) });
+      }
+    }
+    for (const ticker of plan.update) {
+      try {
+        await pluginRegistry.tickerRepository.saveTicker(ticker);
+        dispatch({ type: "UPDATE_TICKER", ticker });
+      } catch (error) {
+        onboardingLog.error("First-run watchlist update failed", { symbol: ticker.metadata.ticker, error: String(error) });
+      }
+    }
+    const home = buildFirstRunLayout({
+      symbol,
+      portfolioId,
+      watchlistId,
+      hasPane: (paneId) => pluginRegistry.panes?.has(paneId) ?? false,
+    });
+    const workspace = applyFirstRunLayout(config, home);
+    if (desks.length === 0) return workspace;
+    const { tickers, financials } = stateRef.current;
+    const held = [...tickers.values()]
+      .filter((ticker) => ticker.metadata.portfolios.includes(portfolioId))
+      .map((ticker) => ticker.metadata.ticker);
+    const company = pickDeskCompany([symbol, ...held], (candidate) => (
+      isDeskStock(tickers.get(candidate), financials.get(candidate))
+    ));
+    const pro = resolvePlanAccess(apiClient.getCurrentUser()).hasProAccess;
+    // A desk that fails to build is left out; it never holds up the first run.
+    const deskTabs = await Promise.all(desks.map((key) => (
+      buildDesk(getDesk(key), { catalog: pluginRegistry, config: workspace, company, pro }).catch((error) => {
+        onboardingLog.error("Desk build failed", { desk: key, error: String(error) });
+        return null;
+      })
+    )));
+    const tabs = deskTabs.filter((tab) => tab !== null);
+    return { ...workspace, layouts: [workspace.layouts[0]!, ...tabs, ...workspace.layouts.slice(1)] };
+  }, [dispatch, pluginRegistry, stateRef]);
+
+  const commitWorkspaceProgress = useCallback(async (
+    nextConfig: AppConfig,
+    patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">,
+  ) => {
+    const withProgress = withOnboardingProgress(nextConfig, patch);
+    await saveConfigImmediately(withProgress);
+    dispatch({ type: "SET_CONFIG", config: withProgress });
+    pluginRegistry.events.emit("config:changed", { config: withProgress });
+  }, [dispatch, pluginRegistry.events]);
+
+  const continueFromPositions = useCallback(() => {
+    const largest = pickLargestPosition(positions.positions);
+    if (!largest) {
+      positions.focusField(0);
+      return;
+    }
+    setEditingField(false);
+    saveProgressInBackground({
+      stage: "desks",
+      path: "manual",
+      portfolioId: positions.portfolioId,
+      tickerSymbol: largest.symbol,
+      positionsImported: positions.positions.length,
+      brokerName: undefined,
+    });
+  }, [positions, saveProgressInBackground]);
+
+  /**
+   * Leaves "What do you trade?": builds the workspace with the picked desks as
+   * tabs (none when skipped, which is today's workspace) and moves on.
+   */
+  const finishDesks = useCallback((desks: readonly DeskKey[]) => {
+    if (buildingDesksRef.current) return;
+    const { tickerSymbol, portfolioId } = getOnboardingProgress(stateRef.current.config);
+    if (!tickerSymbol) {
+      saveProgressInBackground({ stage: "portfolio" });
+      return;
+    }
+    buildingDesksRef.current = true;
+    setBuildingDesks(true);
+    setPersistenceError(null);
+    void (async () => {
+      try {
+        const nextConfig = await buildFirstRunWorkspace(
+          stateRef.current.config,
+          tickerSymbol,
+          portfolioId ?? positions.portfolioId,
+          desks,
+        );
+        if (finishingRef.current) return;
+        await commitWorkspaceProgress(nextConfig, { stage: "research", desks: [...desks] });
+      } catch (error) {
+        setPersistenceError(error instanceof Error ? error.message : String(error));
+      } finally {
+        buildingDesksRef.current = false;
+        setBuildingDesks(false);
+      }
+    })();
+  }, [buildFirstRunWorkspace, commitWorkspaceProgress, positions.portfolioId, saveProgressInBackground, stateRef]);
+
+  const handleBrokerSynced = useCallback(async (
+    result: SyncBrokerInstanceResult,
+    syncedConfig: AppConfig,
+  ) => {
+    if (finishingRef.current) return;
+    const tickerSymbol = pickLargestBrokerPosition(result.positions)?.ticker
+      ?? result.addedTickers[0]?.metadata.ticker
+      ?? result.updatedTickers[0]?.metadata.ticker;
+    const brokerName = brokerOptions.find((option) => option.id === selectedBrokerId)?.name;
+    const portfolioId = tickerSymbol ? (result.portfolioIds[0] ?? "main") : "main";
+    dispatch({ type: "SET_TICKERS", tickers: result.tickers });
+    // The workspace is built once the desks are picked.
+    await commitWorkspaceProgress(syncedConfig, {
+      stage: tickerSymbol ? "desks" : "portfolio",
+      path: "broker",
+      portfolioId,
+      tickerSymbol,
+      brokerName,
+      positionsImported: result.positions.length,
+    });
+    setEditingField(false);
+    setPortfolioSub("positions");
+  }, [brokerOptions, commitWorkspaceProgress, dispatch, selectedBrokerId]);
+
+  return {
+    chosenDesks, setChosenDesks, deskCursor, setDeskCursor, buildingDesks, continueFromPositions,
+    finishDesks, handleBrokerSynced,
+  };
+}
+
+export function useOnboardingCompletion({
+  finishingRef, resetBrokerSync, setIsFinishing, setPersistenceError, progressSaveQueueRef, stateRef,
+  dispatch, onComplete,
+}: {
+  finishingRef: RefObject<boolean>;
+  resetBrokerSync: () => boolean;
+  setIsFinishing: Dispatch<SetStateAction<boolean>>;
+  setPersistenceError: Dispatch<SetStateAction<string | null>>;
+  progressSaveQueueRef: RefObject<Promise<void>>;
+  stateRef: ReturnType<typeof useAppStateRef>;
+  dispatch: ReturnType<typeof useAppDispatch>;
+  onComplete: (config: AppConfig) => void | Promise<void>;
+}) {
+  const finish = useCallback(async (skipped = false) => {
+    if (finishingRef.current) return;
+    if (!resetBrokerSync()) return;
+    finishingRef.current = true;
+    setIsFinishing(true);
+    setPersistenceError(null);
+    try {
+      await progressSaveQueueRef.current.catch(() => {});
+      const desks = getOnboardingProgress(stateRef.current.config).desks?.filter(isDeskKey);
+      const nextConfig: AppConfig = {
+        ...stateRef.current.config,
+        onboardingComplete: true,
+        onboardingProgress: undefined,
+      };
+      await saveConfigImmediately(nextConfig);
+      dispatch({
+        type: "SET_ONBOARDING_STATE",
+        complete: true,
+        progress: undefined,
+      });
+      recordResearchActivity(skipped ? "onboarding_skipped" : "onboarding_completed", undefined, undefined, { desks });
+      await Promise.resolve(onComplete(nextConfig));
+    } catch (error) {
+      setPersistenceError(error instanceof Error ? error.message : String(error));
+      finishingRef.current = false;
+      setIsFinishing(false);
+    }
+  }, [dispatch, onComplete, resetBrokerSync, stateRef]);
+  const skipSetup = useCallback(() => { void finish(true); }, [finish]);
+
+  return {
+    finish, skipSetup,
+  };
+}

package/src/components/onboarding/use-onboarding-upgrade.ts

@@ -0,0 +1,83 @@
+import { useCallback, useEffect, useState } from "react";
+import { apiClient } from "../../api-client";
+import type { AppConfig, OnboardingProgress, OnboardingStage } from "../../types/config";
+import { useAppActive } from "../../state/app/activity";
+import { chatController } from "../../plugins/builtin/chat/controller";
+import type { CloudBillingInterval } from "../../plugins/builtin/account-management/model";
+import { loadUpgradeOffer, type UpgradeOffer } from "../../plugins/builtin/cloud/upgrade-dialog";
+import { useCloudUpgradeAction } from "../../plugins/builtin/shared/cloud-upgrade";
+import { usePlanAccess } from "../../api-client/plan-access";
+
+export function useOnboardingUpgrade({
+  stage, progress, saveProgressInBackground, persistProgress,
+}: {
+  stage: OnboardingStage;
+  progress: OnboardingProgress;
+  saveProgressInBackground: (patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">, baseConfig?: AppConfig | undefined) => void;
+  persistProgress: (patch: Partial<OnboardingProgress> & Pick<OnboardingProgress, "stage">, baseConfig?: AppConfig | undefined) => Promise<AppConfig>;
+}) {
+  const [offer, setOffer] = useState<UpgradeOffer | null>(null);
+  const pricing = offer?.pricing ?? null;
+  const [billingInterval, setBillingInterval] = useState<CloudBillingInterval>("month");
+
+  const appActive = useAppActive();
+  const planAccess = usePlanAccess();
+  const openUpgrade = useCloudUpgradeAction("onboarding-pro");
+  // The price and whether this account still has its trial, asked again for
+  // whichever account reaches the step.
+  const accountId = planAccess.signedIn ? apiClient.getCurrentUser()?.id ?? null : null;
+  useEffect(() => {
+    if (stage !== "upgrade") return;
+    let live = true;
+    void loadUpgradeOffer().then((loaded) => {
+      if (live) setOffer(loaded);
+    });
+    return () => {
+      live = false;
+    };
+  }, [accountId, stage]);
+  useEffect(() => {
+    if (stage !== "upgrade" || !progress.checkoutOpenedAt || !appActive) return;
+    void apiClient.getSession()
+      .then(() => chatController.refreshSession())
+      .catch(() => {});
+  }, [appActive, progress.checkoutOpenedAt, stage]);
+
+  useEffect(() => {
+    if (stage === "upgrade" && planAccess.hasProAccess) {
+      saveProgressInBackground({ stage: "ready", accountStatus: "signed-in" });
+    }
+  }, [planAccess.hasProAccess, saveProgressInBackground, stage]);
+
+  const startUpgrade = useCallback(() => {
+    void openUpgrade({
+      interval: billingInterval,
+      sheet: false,
+      // Stamped once per checkout that opens, not per keypress: the repeats
+      // of a held Enter are ignored.
+      onOpening: () => {
+        void persistProgress({
+          stage: "upgrade",
+          accountStatus: progress.accountStatus,
+          checkoutOpenedAt: new Date().toISOString(),
+        }).catch(() => {});
+      },
+    });
+  }, [billingInterval, openUpgrade, persistProgress, progress.accountStatus]);
+
+  const primaryUpgradeAction = useCallback(() => {
+    if (planAccess.hasProAccess) {
+      saveProgressInBackground({ stage: "ready", accountStatus: "signed-in" });
+      return;
+    }
+    startUpgrade();
+  }, [planAccess.hasProAccess, saveProgressInBackground, startUpgrade]);
+
+  const continueFree = useCallback(() => {
+    saveProgressInBackground({ stage: "ready", accountStatus: progress.accountStatus });
+  }, [progress.accountStatus, saveProgressInBackground]);
+
+  return {
+    offer, pricing, billingInterval, setBillingInterval, planAccess, primaryUpgradeAction, continueFree,
+  };
+}

package/src/components/ticker/list-table-view.tsx

@@ -27,6 +27,7 @@ import { PRICE_SPARKLINE_COLUMN_ID, PriceSparkline } from "../price-sparkline/vi
 import { DataTableView, type DataTableKeyEvent, type DataTableSelection } from "../data-table/view";
 import type { QuoteFlashDirection } from "../quote-flash";
 import { objectVersion } from "../../utils/object-version";
+import { getCompletedRegularSessionDisplay } from "../../market-data/market/status";
 import { usePaneFooter } from "../layout/pane/footer";
 
 export interface TickerTableCell {
@@ -107,8 +108,19 @@ const FLASHABLE_QUOTE_COLUMN_IDS = new Set([
   "mark_delta",
 ]);
 
+// After the regular close, and in the pre-market with the last session's close
+// and move, these three hold that close and its move while only the extended
+// print ticks (see the portfolio column values), so a tick does not flash them.
+const STEADY_AFTER_CLOSE_QUOTE_COLUMN_IDS = new Set(["price", "change", "change_pct"]);
+
 const EMPTY_FLASH_SYMBOLS = new Map<string, QuoteFlashDirection>();
 
+/** Whether a tick on this row dims the cell: the quote columns it can move. */
+export function flashesOnQuoteTick(columnId: string, quote: TickerFinancials["quote"]): boolean {
+  if (!FLASHABLE_QUOTE_COLUMN_IDS.has(columnId)) return false;
+  return !STEADY_AFTER_CLOSE_QUOTE_COLUMN_IDS.has(columnId) || !getCompletedRegularSessionDisplay(quote);
+}
+
 type TableMouseEvent = {
   button?: number;
   detail?: number;
@@ -247,7 +259,7 @@ export function TickerListTableView({
 
     const { text, color } = resolveCellRef.current.resolve(column, ticker, financials);
     const shouldFlash = flashSymbolsRef.current.has(ticker.metadata.ticker)
-      && FLASHABLE_QUOTE_COLUMN_IDS.has(column.id);
+      && flashesOnQuoteTick(column.id, financials?.quote);
     return {
       text,
       color: color || (rowState.selected ? colors.selectedText : undefined),