gloomberb 0.14.0 → 0.15.0

package/src/plugins/builtin/cloud/team/pane.tsx

@@ -9,15 +9,25 @@ import {
   type TeamSummary,
 } from "../../../../api-client";
 import { ApiRequestError } from "../../../../api-client/errors";
-import { Button, Tabs, usePaneFooter, type PaneHint } from "../../../../components";
+import { QueryBar, Tabs, loadingText, usePaneFooter, usePaneHeaderTabs, usePaneMenuItems, type PaneFooterSegment, type PaneHint } from "../../../../components";
 import { useShortcut } from "../../../../react/input";
 import { colors } from "../../../../theme/colors";
 import type { PaneProps } from "../../../../types/plugin";
-import { Box, ScrollBox, Span, Text, TextAttributes, useRendererHost } from "../../../../ui";
+import {
+  Box,
+  ScrollBox,
+  Text,
+  TextAttributes,
+  useRendererHost,
+  useUiCapabilities,
+  type BoxRenderable,
+  type ScrollBoxRenderable,
+} from "../../../../ui";
 import { isPlainKey } from "../../../../utils/keyboard";
-import { usePluginAppActions } from "../../../runtime";
+import { usePluginAppActions, usePluginPaneState } from "../../../runtime";
 import { chatController } from "../../chat/controller";
 import { SignInWall } from "../auth-actions";
+import { afterLayout, revealInScrollBox } from "../reveal-in-scroll-box";
 import { useCloudUpgradeAction } from "../../shared/cloud-upgrade";
 import { usePlanAccess } from "../../shared/plan-access";
 import {
@@ -38,8 +48,12 @@ import {
   describeMemberCount,
   draftChanges,
   draftFromTeam,
+  draftProblem,
   emptyTeamDraft,
+  isTextFieldId,
   nextFieldId,
+  nextNonTextFieldId,
+  restingFieldId,
   sectionFieldIds,
   type TeamDraft,
 } from "./pane-model";
@@ -57,7 +71,7 @@ import {
   MembersSection,
   SettingsSection,
 } from "./pane-sections";
-import { Muted, StatusLine, TeamPaneFocusContext, type TeamPaneFocus } from "./pane-ui";
+import { Muted, PaneButton, TeamPaneFocusContext, type TeamPaneFocus } from "./pane-ui";
 import { teamStore } from "./store";
 
 type Message = { tone: "info" | "success" | "error"; text: string } | null;
@@ -160,8 +174,9 @@ function InvitationBanner({
         {`${userHandle(invitation.inviter)} invited you · ${describeMemberCount(invitation.team.memberCount)} · ${describeExpiry(invitation.expiresAt)}`}
       </Text>
       <Box flexGrow={1} />
-      <Button label={busy ? "Joining…" : "Accept"} variant="primary" compact disabled={busy} stopPropagation onPress={onAccept} />
-      <Button label="Decline" variant="ghost" compact disabled={busy} stopPropagation onPress={onDecline} />
+      {/* In the keyboard ring, ahead of the section below. */}
+      <PaneButton id={`accept:${invitation.id}`} label={busy ? "Joining…" : "Accept"} variant="primary" compact disabled={busy} onPress={onAccept} />
+      <PaneButton id={`decline:${invitation.id}`} label="Decline" variant="ghost" compact disabled={busy} onPress={onDecline} />
     </Box>
   );
 }
@@ -171,6 +186,7 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
   const rendererHost = useRendererHost();
   const openUpgrade = useCloudUpgradeAction();
   const plan = usePlanAccess();
+  const { nativePaneChrome } = useUiCapabilities();
   const snapshot = useSyncExternalStore(
     (onChange) => teamStore.subscribe(onChange),
     () => teamStore.getSnapshot(),
@@ -182,7 +198,7 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
   const selfUserId = apiClient.getCurrentUser()?.id ?? null;
 
   const [teamId, setTeamId] = useState<string | null>(null);
-  const [section, setSection] = useState<TeamPaneSection>("members");
+  const [section, setSection] = usePluginPaneState<TeamPaneSection>("section", "members");
   const [creating, setCreating] = useState(false);
   const [draft, setDraft] = useState<TeamDraft>(() => emptyTeamDraft());
   const [createDraft, setCreateDraft] = useState<TeamDraft>(() => emptyTeamDraft());
@@ -270,11 +286,13 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
     linkTokens: details.links.map((entry) => entry.token),
     channelIds: channels.map((entry) => entry.id),
     selfUserId,
-  }), [channels, details.invitations, details.links, details.members, section, selfUserId, showCreate, team]);
+    receivedInvitationIds: snapshot.invitations.map((entry) => entry.id),
+  }), [channels, details.invitations, details.links, details.members, section, selfUserId, showCreate, snapshot.invitations, team]);
   useEffect(() => {
-    if (activeField && !fieldIds.includes(activeField)) setActiveFieldState(fieldIds[0] ?? null);
-    if (!activeField && fieldIds.length > 0) setActiveFieldState(fieldIds[0]!);
-  }, [activeField, fieldIds]);
+    if (activeField && fieldIds.includes(activeField)) return;
+    const resting = restingFieldId(fieldIds, showCreate);
+    if (resting !== activeField) setActiveFieldState(resting);
+  }, [activeField, fieldIds, showCreate]);
   const setActiveField = useCallback((id: string) => setActiveFieldState(id), []);
   const register = useCallback((id: string, action: (() => void) | null) => {
     if (action) actions.current.set(id, action);
@@ -283,23 +301,42 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
       if (actions.current.get(id) === action) actions.current.delete(id);
     };
   }, []);
+  const nodes = useRef(new Map<string, BoxRenderable>());
+  const registerNode = useCallback((id: string, node: BoxRenderable | null) => {
+    if (node) nodes.current.set(id, node);
+    else nodes.current.delete(id);
+  }, []);
   const focus = useMemo<TeamPaneFocus>(
-    () => ({ activeField, setActiveField, focused, register }),
-    [activeField, focused, register, setActiveField],
+    () => ({ activeField, setActiveField, focused, register, registerNode }),
+    [activeField, focused, register, registerNode, setActiveField],
   );
+  // The ring can walk past the rows on screen in a larger team. The invitation
+  // banners sit above the scrolling body, so they never move it.
+  const bodyScrollRef = useRef<ScrollBoxRenderable | null>(null);
+  useEffect(() => {
+    if (!activeField || activeField.startsWith("accept:") || activeField.startsWith("decline:")) return;
+    return afterLayout(() => revealInScrollBox(bodyScrollRef.current, nodes.current.get(activeField) ?? null));
+  }, [activeField]);
+
+  // Each result is a toast, and the last one stays in the footer until the
+  // next action or view change.
+  const report = useCallback((result: Message) => {
+    setMessage(result);
+    if (result) notify({ body: result.text, type: result.tone });
+  }, [notify]);
 
   const run = useCallback(async (key: string, work: () => Promise<Message>) => {
     if (busy) return;
     setBusy(key);
     setMessage(null);
     try {
-      setMessage(await work());
+      report(await work());
     } catch (error) {
-      setMessage({ tone: "error", text: errorText(error, "That did not work.") });
+      report({ tone: "error", text: errorText(error, "That did not work.") });
     } finally {
       setBusy(null);
     }
-  }, [busy]);
+  }, [busy, report]);
 
   const openChannel = useCallback((channel: ChatChannel | string) => {
     createPaneFromTemplate("new-chat-pane", { arg: typeof channel === "string" ? channel : channel.id });
@@ -318,9 +355,8 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
     setTeamId(created.id);
     setSection("invites");
     setCreateDraft(emptyTeamDraft());
-    notify({ body: `${created.name} is ready. Invite people, then find its #general in chat.`, type: "success" });
-    return { tone: "success", text: `Created ${teamPrefix(created)} ${created.name}. Now invite a few people.` };
-  }), [createDraft, notify, run]);
+    return { tone: "success", text: `${teamPrefix(created)} ${created.name} is ready. Invite people, then find its #general in chat.` };
+  }), [createDraft, run]);
 
   const saveSettings = useCallback(() => {
     if (!team) return;
@@ -363,11 +399,11 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
   const copyLink = useCallback(async (link: TeamInviteLink) => {
     try {
       await rendererHost.copyText(link.url);
-      setMessage({ tone: "success", text: "Invite link copied." });
+      report({ tone: "success", text: "Invite link copied." });
     } catch {
-      setMessage({ tone: "info", text: link.url });
+      report({ tone: "info", text: link.url });
     }
-  }, [rendererHost]);
+  }, [rendererHost, report]);
 
   const newLink = useCallback(() => {
     if (!team) return;
@@ -413,29 +449,66 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
     return { tone: "info", text: `Declined ${invitation.team.name}.` };
   }), [run]);
 
+  // The team strip is a row of tabs no key reaches (1-4 pick the section), so
+  // [ and ] step through teams, from the create form too.
+  const cycleTeam = useCallback((delta: number) => {
+    const teams = snapshot.teams;
+    if (teams.length === 0) return;
+    const index = showCreate ? -1 : teams.findIndex((entry) => entry.id === team?.id);
+    const next = index < 0
+      ? teams[delta > 0 ? 0 : teams.length - 1]
+      : teams[(index + delta + teams.length) % teams.length];
+    if (!next || (next.id === team?.id && !showCreate)) return;
+    setCreating(false);
+    setTeamId(next.id);
+    setMessage(null);
+  }, [showCreate, snapshot.teams, team?.id]);
+  const canCycleTeams = snapshot.teams.length > (showCreate ? 0 : 1);
+
   useShortcut((event) => {
-    if (!focused) return;
-    if (event.ctrl && event.name === "s" && !showCreate && section === "settings") {
+    const consume = () => {
       event.preventDefault?.();
       event.stopPropagation?.();
+    };
+    if (event.ctrl && event.name === "s" && !showCreate && section === "settings") {
+      consume();
       saveSettings();
       return;
     }
-    if (isPlainKey(event, "tab") || (!event.targetEditable && isPlainKey(event, "down", "j"))) {
-      event.preventDefault?.();
-      event.stopPropagation?.();
+    if (isPlainKey(event, "escape")) {
+      if (showCreate && snapshot.teams.length > 0) {
+        consume();
+        setCreating(false);
+      } else if (isTextFieldId(activeField)) {
+        // Leaves the field for the control after it, so letters are keys again.
+        consume();
+        setActiveFieldState(nextNonTextFieldId(fieldIds, activeField));
+      }
+      return;
+    }
+    const tab = event.name === "tab" && !event.ctrl && !event.meta && !event.alt;
+    if (tab) {
+      // Tab walks the ring and, past either end, moves on to the next pane as
+      // it does everywhere else, so the pane never traps the keyboard.
+      const index = activeField ? fieldIds.indexOf(activeField) : -1;
+      const next = event.shift ? (index > 0 ? fieldIds[index - 1] : undefined) : fieldIds[index + 1];
+      if (!next) return;
+      consume();
+      setActiveFieldState(next);
+      return;
+    }
+    if (!event.targetEditable && isPlainKey(event, "down", "j")) {
+      consume();
       setActiveFieldState((current) => nextFieldId(fieldIds, current, 1));
       return;
     }
-    if ((event.shift && event.name === "tab") || (!event.targetEditable && isPlainKey(event, "up", "k"))) {
-      event.preventDefault?.();
-      event.stopPropagation?.();
+    if (!event.targetEditable && isPlainKey(event, "up", "k")) {
+      consume();
       setActiveFieldState((current) => nextFieldId(fieldIds, current, -1));
       return;
     }
     if (activeField === "accent" && isPlainKey(event, "left", "right", "h", "l")) {
-      event.preventDefault?.();
-      event.stopPropagation?.();
+      consume();
       const delta = event.name === "left" || event.name === "h" ? -1 : 1;
       if (showCreate) setCreateDraft((current) => ({ ...current, accentColor: cycleAccent(current.accentColor, delta) }));
       else setDraft((current) => ({ ...current, accentColor: cycleAccent(current.accentColor, delta) }));
@@ -444,23 +517,30 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
     if (!event.targetEditable && activeField && isPlainKey(event, "enter", "return", "space")) {
       const action = actions.current.get(activeField);
       if (action) {
-        event.preventDefault?.();
-        event.stopPropagation?.();
+        consume();
         action();
       }
       return;
     }
+    if (!event.targetEditable && canCycleTeams && isPlainKey(event, "[", "]")) {
+      consume();
+      cycleTeam(event.name === "[" ? -1 : 1);
+      return;
+    }
     if (!event.targetEditable && !showCreate && isPlainKey(event, "1", "2", "3", "4")) {
       const target = TEAM_PANE_SECTIONS[Number(event.name) - 1];
       if (target) {
-        event.preventDefault?.();
-        event.stopPropagation?.();
+        consume();
         setSection(target.value);
       }
     }
-    // "before": the app cycles panes on Tab in the normal phase; inside this
-    // pane Tab walks the ring instead, like the composer and quick-add do.
-  }, { allowEditable: true, phase: "before" });
+    // Scoped in "before", so the ring sees Tab ahead of the app's pane cycling.
+  }, { allowEditable: true, phase: "before", scope: "team-pane:ring", enabled: focused });
+
+  usePaneMenuItems("team-pane:teams", () => (canCycleTeams ? [
+    { id: "team-previous", label: "Previous Team", accelerator: "[", onSelect: () => cycleTeam(-1) },
+    { id: "team-next", label: "Next Team", accelerator: "]", onSelect: () => cycleTeam(1) },
+  ] : null), [canCycleTeams, cycleTeam]);
 
   const hints = useMemo<PaneHint[]>(() => {
     if (!signedIn) return [];
@@ -475,24 +555,59 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
     if (team) {
       list.push({ id: "chat", key: "c", label: "hat", onPress: () => openChannel(teamChannelId(team.id)) });
       if (canInviteToTeam(team)) list.push({ id: "invite", key: "i", label: "nvite", onPress: () => setSection("invites") });
+      if (section === "settings" && canManageTeam(team.role)) {
+        // Disabled exactly when the Save button is.
+        list.push({ id: "save", key: "Ctrl+S", label: "save", onPress: saveSettings, disabled: !dirty || !!draftProblem(draft) });
+      }
     }
     return list;
-  }, [openChannel, showCreate, signedIn, snapshot.teams.length, team]);
+  }, [dirty, draft, openChannel, saveSettings, section, showCreate, signedIn, snapshot.teams.length, team]);
+  const result = message ?? (details.error ? { tone: "error" as const, text: details.error } : null);
   usePaneFooter(TEAM_PANE_ID, () => ({
     info: [
       ...(busy ? [{ id: "busy", parts: [{ text: "working", tone: "muted" as const }] }] : []),
       ...(details.loading && !busy ? [{ id: "loading", parts: [{ text: "syncing", tone: "muted" as const }] }] : []),
+      ...(result && !busy ? [{
+        id: "result",
+        parts: [{
+          text: result.text,
+          tone: result.tone === "error" ? "negative" as const : result.tone === "success" ? "positive" as const : "muted" as const,
+        }],
+      } satisfies PaneFooterSegment] : []),
     ],
     hints,
-  }), [busy, details.loading, hints]);
-
-  useShortcut((event) => {
-    if (!focused || !showCreate || snapshot.teams.length === 0) return;
-    if (isPlainKey(event, "escape")) {
-      event.preventDefault?.();
+  }), [busy, details.loading, hints, result]);
+
+  const teamTabs = useMemo(() => [
+    ...snapshot.teams.map((entry) => ({
+      label: `${teamPrefix(entry)} ${entry.name}`,
+      value: entry.id,
+      fg: teamAccentHex(entry.accentColor),
+    })),
+    ...(showCreate ? [{ label: "New team", value: "__create" }] : []),
+  ], [showCreate, snapshot.teams]);
+  const selectTeam = useCallback((value: string) => {
+    if (value === "__create") {
+      setCreating(true);
+    } else {
       setCreating(false);
+      setTeamId(value);
     }
-  }, { allowEditable: true });
+    setMessage(null);
+  }, []);
+  const startCreate = useCallback(() => {
+    setCreating(true);
+    setMessage(null);
+  }, []);
+  const tabsInHeader = usePaneHeaderTabs(signedIn ? {
+    tabs: teamTabs,
+    activeValue: showCreate ? "__create" : team?.id ?? null,
+    onSelect: selectTeam,
+    focused,
+    keyboardNavigation: false,
+    addLabel: showCreate ? undefined : "+",
+    onAdd: showCreate ? undefined : startCreate,
+  } : null);
 
   if (!signedIn) {
     return <SignInWall action="use teams" />;
@@ -500,17 +615,20 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
 
   const contentWidth = Math.max(24, width - 2);
   const banners = snapshot.invitations;
-  const headerRows = 2 + (banners.length > 0 ? banners.length + 1 : 0) + (message ? 1 : 0);
-  const bodyHeight = Math.max(3, height - headerRows - 1);
+  const tabRows = tabsInHeader ? 0 : 1;
+  // The section bar or the teams status line; the create form has neither.
+  const sectionRows = showCreate ? 0 : 1;
+  const headerRows = sectionRows + tabRows + (banners.length > 0 ? banners.length + 1 : 0);
+  const bodyHeight = Math.max(3, height - headerRows);
 
   return (
     <TeamPaneFocusContext value={focus}>
-      <Box flexDirection="column" width={width} height={height} paddingX={1}>
+      <Box flexDirection="column" width={width} height={height}>
         {banners.map((invitation) => (
           <InvitationBanner
             key={invitation.id}
             invitation={invitation}
-            width={contentWidth}
+            width={width}
             busy={busy === `accept:${invitation.id}` || busy === `decline:${invitation.id}`}
             onAccept={() => { void acceptInvitation(invitation); }}
             onDecline={() => { void declineInvitation(invitation); }}
@@ -519,69 +637,49 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
         {banners.length > 0 ? <Box height={1} /> : null}
 
         {/* Team switcher: one pill per team in its accent, plus the form. */}
-        <Box height={1} flexDirection="row" alignItems="center">
-          <Tabs
-            tabs={[
-              ...snapshot.teams.map((entry) => ({
-                label: `${teamPrefix(entry)} ${entry.name}`,
-                value: entry.id,
-                fg: teamAccentHex(entry.accentColor),
-              })),
-              ...(showCreate ? [{ label: "New team", value: "__create" }] : []),
-            ]}
-            activeValue={showCreate ? "__create" : team?.id ?? null}
-            onSelect={(value) => {
-              if (value === "__create") {
-                setCreating(true);
-              } else {
-                setCreating(false);
-                setTeamId(value);
-              }
-              setMessage(null);
-            }}
-            focused={focused}
-            variant="pill"
-            compact
-            keyboardNavigation={false}
-            addLabel={showCreate ? undefined : "+"}
-            onAdd={showCreate ? undefined : () => { setCreating(true); setMessage(null); }}
-          />
-        </Box>
-
-        {showCreate ? (
-          <Box height={1} />
-        ) : team ? (
-          <Box height={1} flexDirection="row" alignItems="center" gap={2}>
+        {!tabsInHeader && (
+          <Box height={1} flexDirection="row" alignItems="center" paddingX={1}>
             <Tabs
-              tabs={TEAM_PANE_SECTIONS.map((entry) => ({
-                label: entry.label,
-                value: entry.value,
-                ...(entry.value === "invites" && details.invitations.length > 0 ? { label: `Invites (${details.invitations.length})` } : {}),
-                ...(entry.value === "members" ? { label: `Members (${team.memberCount})` } : {}),
-              }))}
-              activeValue={section}
-              onSelect={(value) => { setSection(value as TeamPaneSection); setMessage(null); }}
+              tabs={teamTabs}
+              activeValue={showCreate ? "__create" : team?.id ?? null}
+              onSelect={selectTeam}
               focused={focused}
-              variant="underline"
+              variant="pill"
               compact
               keyboardNavigation={false}
+              addLabel={showCreate ? undefined : "+"}
+              onAdd={showCreate ? undefined : startCreate}
             />
-            <Box flexGrow={1} />
-            <Text fg={colors.textMuted}>
-              <Span fg={teamAccentHex(team.accentColor)}>●</Span>
-              {` ${team.role} · ${describeMemberCount(team.memberCount)}`}
-            </Text>
           </Box>
+        )}
+
+        {showCreate ? null : team ? (
+          <QueryBar
+            width={width}
+            filters={[{
+              id: "section",
+              label: "Section",
+              inline: true,
+              value: section,
+              options: TEAM_PANE_SECTIONS,
+              onChange: (value: TeamPaneSection) => { setSection(value); setMessage(null); },
+            }]}
+            meta={team.role}
+          />
         ) : (
-          <Box height={1}>
-            <Muted>{snapshot.loading ? "Loading teams…" : snapshot.error ?? ""}</Muted>
+          <Box height={1} paddingX={1}>
+            <Muted>{snapshot.loading ? loadingText("teams") : snapshot.error ?? ""}</Muted>
           </Box>
         )}
 
-        <StatusLine message={message ?? (details.error ? { tone: "error", text: details.error } : null)} />
-
-        <ScrollBox height={bodyHeight} scrollY focusable={false}>
-          <Box flexDirection="column" width={contentWidth} paddingTop={1}>
+        {/* The desktop section bar is taller than a cell, so the body takes what is left. */}
+        <ScrollBox
+          ref={bodyScrollRef}
+          {...(nativePaneChrome ? { flexGrow: 1, flexBasis: 0, minHeight: 0 } : { height: bodyHeight })}
+          scrollY
+          focusable={false}
+        >
+          <Box flexDirection="column" width={contentWidth + 2} paddingX={1} paddingTop={1}>
             {showCreate ? (
               <CreateTeamForm
                 draft={createDraft}
@@ -678,7 +776,6 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
                     void teamStore.refresh();
                     void chatController.refreshChatState();
                     setTeamId(null);
-                    notify({ body: `You left ${team.name}.`, type: "info" });
                     if (teamStore.getSnapshot().teams.length <= 1) close?.();
                     return { tone: "info", text: `You left ${team.name}.` };
                   });
@@ -690,7 +787,6 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
                     void teamStore.refresh();
                     void chatController.refreshChatState();
                     setTeamId(null);
-                    notify({ body: `Deleted ${team.name}.`, type: "info" });
                     if (teamStore.getSnapshot().teams.length <= 1) close?.();
                     return { tone: "info", text: `Deleted ${team.name}.` };
                   });
@@ -698,7 +794,7 @@ export function TeamPane({ focused, width, height, close }: PaneProps) {
               />
             ) : null}
             {!showCreate && team && details.loading && details.members.length === 0 ? (
-              <Muted>Loading…</Muted>
+              <Muted>{loadingText()}</Muted>
             ) : null}
             {!showCreate && !team && !snapshot.loading && snapshot.loaded ? (
               <Muted>You are not in a team yet.</Muted>

package/src/plugins/builtin/cloud/team/status-widget.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState, useSyncExternalStore } from "react";
 import { Button } from "../../../../components/ui/button";
 import { colors } from "../../../../theme/colors";
-import { Box, Span, Text, TextAttributes } from "../../../../ui";
+import { Box, Span, Text, TextAttributes, useCommandBarShortcut } from "../../../../ui";
 import { usePluginAppActions } from "../../../runtime";
 import { chatController } from "../../chat/controller";
 import { countTeamUpdates, teamAccentHex, teamIdFromChannelId } from "./model";
@@ -16,6 +16,8 @@ import { teamStore } from "./store";
  */
 export function TeamStatusWidget() {
   const { createPaneFromTemplate } = usePluginAppActions();
+  // The status bar takes no keyboard focus; each chip names the command instead.
+  const commandBarKey = useCommandBarShortcut();
   const snapshot = useSyncExternalStore(
     (onChange) => teamStore.subscribe(onChange),
     () => teamStore.getSnapshot(),
@@ -54,6 +56,7 @@ export function TeamStatusWidget() {
           <Button
             key={team.id}
             label={`${team.name}: open team`}
+            title={`Open ${team.name} (${commandBarKey}, then TEAM ${team.shortName})`}
             variant="plain"
             compact
             stopPropagation

package/src/plugins/builtin/cloud/thesis/board-pane.test.tsx

@@ -188,7 +188,9 @@ describe("ThesisBoardPane", () => {
     expect(frame).toContain("Positions without a thesis");
     expect(frame).toContain("AAPL");
     expect(frame).toContain("[n]ew");
-    expect(frame).toContain("[w]eights");
+    // Scope and view sit in the query bar, not the footer.
+    expect(frame).toContain("Portfolio");
+    expect(frame).toContain("Weights");
   });
 
   test("enter opens the thesis: pillars, kill conditions, catalysts, and the open signal with its source", async () => {
@@ -210,14 +212,15 @@ describe("ThesisBoardPane", () => {
     expect(frame).toContain("Horizon 3y");
     expect(frame).toContain("Listening to MSFT");
     expect(frame).toContain("Signals (1 open)");
-    expect(frame).toContain("challenges · Gross margin holds");
+    expect(frame).toMatch(/challenges\s+Gross margin holds/);
     expect(frame).toContain("10-Q: Q3 gross margin guide 72-73%");
     expect(frame).toContain("Data center revenue grows over 50% YoY");
     expect(frame).toContain("≥ 70%  weakening");
     expect(frame).toContain("Hyperscaler capex cut over 20%");
     expect(frame).toContain("not fired");
     expect(frame).toContain("Q3 earnings");
-        expect(frame).toContain("[r]eview");
+    // r is the app-wide refresh, so the review has its own key.
+    expect(frame).toContain("[v] review");
   });
 
   test("w switches to conviction against weight", async () => {
@@ -233,7 +236,6 @@ describe("ThesisBoardPane", () => {
     await flush();
     const frame = setup!.captureCharFrame();
     if (process.env.PRINT_FRAMES) console.log(frame);
-    expect(frame).toContain("Gap");
-    expect(frame).toContain("[w] board");
+    expect(frame).toContain("GAP");
   });
 });