gloomberb 0.13.2 → 0.14.0

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

@@ -0,0 +1,75 @@
+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 { usePluginAppActions } from "../../../runtime";
+import { chatController } from "../../chat/controller";
+import { countTeamUpdates, teamAccentHex, teamIdFromChannelId } from "./model";
+import { openTeamPane } from "./pane-request";
+import { teamStore } from "./store";
+
+/**
+ * One chip per team in the status bar, in the team's accent, with the unread
+ * chat count and the number of pending cards (invites, layout updates). Hidden
+ * teams under FOCUS keep their chip so the lens is visible, dimmed. A click
+ * opens the team pane on that team.
+ */
+export function TeamStatusWidget() {
+  const { createPaneFromTemplate } = usePluginAppActions();
+  const snapshot = useSyncExternalStore(
+    (onChange) => teamStore.subscribe(onChange),
+    () => teamStore.getSnapshot(),
+  );
+  // The chat controller builds a fresh snapshot per call, so it cannot back
+  // useSyncExternalStore; subscribe and keep only what the chips show.
+  const [unreadByChannel, setUnreadByChannel] = useState<ReadonlyMap<string, number>>(() => new Map());
+  useEffect(() => chatController.subscribe((chat) => {
+    setUnreadByChannel((previous) => {
+      const next = new Map<string, number>();
+      for (const state of chat.channelStates) {
+        if (state.channelId.startsWith("team:") && state.unreadCount > 0) next.set(state.channelId, state.unreadCount);
+      }
+      if (next.size === previous.size && [...next].every(([id, count]) => previous.get(id) === count)) return previous;
+      return next;
+    });
+  }), []);
+  if (snapshot.teams.length === 0) return null;
+
+  const updates = countTeamUpdates(snapshot.notifications);
+
+  return (
+    <Box flexDirection="row" paddingRight={1}>
+      {snapshot.teams.map((team) => {
+        const accent = teamAccentHex(team.accentColor);
+        let unread = 0;
+        for (const [channelId, count] of unreadByChannel) {
+          if (teamIdFromChannelId(channelId) === team.id) unread += count;
+        }
+        const cards = updates.get(team.id) ?? 0;
+        const muted =
+          snapshot.focus === "personal" ||
+          (typeof snapshot.focus === "object" && snapshot.focus.teamId !== team.id);
+        const count = unread + cards;
+        return (
+          <Button
+            key={team.id}
+            label={`${team.name}: open team`}
+            variant="plain"
+            compact
+            stopPropagation
+            onPress={() => openTeamPane(createPaneFromTemplate, { teamId: team.id })}
+          >
+            <Text fg={muted ? colors.textMuted : accent} attributes={count > 0 && !muted ? TextAttributes.BOLD : 0}>
+              <Span fg={muted ? colors.textMuted : accent}>●</Span>
+              {` ${team.shortName}`}
+            </Text>
+            {count > 0 ? (
+              <Text fg={muted ? colors.textMuted : accent} attributes={TextAttributes.BOLD}>{`[${count}]`}</Text>
+            ) : null}
+            <Text> </Text>
+          </Button>
+        );
+      })}
+    </Box>
+  );
+}

package/src/plugins/builtin/cloud/team/store.test.ts

@@ -0,0 +1,231 @@
+import { describe, expect, test } from "bun:test";
+import type { TeamNotification, TeamReceivedInvitation, TeamSummary, TeamUpdatedEvent } from "../../../../api-client";
+import { MemoryPluginPersistence } from "../../../../test-support/plugin-persistence";
+import { TeamStore, type TeamStoreClient } from "./store";
+
+function team(overrides: Partial<TeamSummary>): TeamSummary {
+  return {
+    id: "org-1",
+    name: "Macro Desk",
+    slug: "macro-desk",
+    accentColor: "magenta",
+    shortName: "MD",
+    allowMemberInvites: false,
+    channelId: "team:org-1",
+    createdAt: "2026-09-14T12:00:00.000Z",
+    role: "member",
+    memberCount: 2,
+    ...overrides,
+  };
+}
+
+const teamCard = { id: "org-1", name: "Macro Desk", accentColor: "magenta" as const, shortName: "MD" };
+
+function notification(id: string, kind: "team-invite" | "team-joined" | "layout-updated", createdAt = "2026-09-14T12:00:00.000Z"): TeamNotification {
+  const actor = { id: "u2", username: "alice", displayName: "Alice" };
+  const data: TeamNotification["data"] =
+    kind === "team-invite"
+      ? { kind, team: teamCard, invitationId: "inv-1", expiresAt: "2026-09-21T12:00:00.000Z", inviter: actor }
+      : kind === "team-joined"
+        ? { kind, team: teamCard, member: actor }
+        : { kind, team: teamCard, layoutId: "l1", layoutName: "Morning", revision: 2, author: actor };
+  return { id, type: kind, channelId: "team:org-1", createdAt, data };
+}
+
+function fakeClient(overrides: Partial<TeamStoreClient> = {}) {
+  let verified = true;
+  const userListeners = new Set<() => void>();
+  const teamListeners = new Set<(n: TeamNotification) => void>();
+  const delivered: string[][] = [];
+  let teams: TeamSummary[] = [team({ name: "Rates", id: "org-2", shortName: "RT" }), team({})];
+  let invitations: TeamReceivedInvitation[] = [];
+  const updateListeners = new Set<(event: TeamUpdatedEvent) => void>();
+  let listCalls = 0;
+  const client: TeamStoreClient = {
+    isVerified: () => verified,
+    subscribeCurrentUser: (listener) => {
+      userListeners.add(listener);
+      return () => userListeners.delete(listener);
+    },
+    subscribeTeamNotifications: (listener) => {
+      teamListeners.add(listener);
+      return () => teamListeners.delete(listener);
+    },
+    subscribeTeamUpdates: (listener) => {
+      updateListeners.add(listener);
+      return () => updateListeners.delete(listener);
+    },
+    listTeams: async () => {
+      listCalls += 1;
+      return teams;
+    },
+    listMyTeamInvitations: async () => invitations,
+    getTeamNotifications: async () => [],
+    markChatNotificationsDelivered: async (ids) => {
+      delivered.push(ids);
+      return { delivered: ids.length };
+    },
+    ...overrides,
+  };
+  return {
+    client,
+    delivered,
+    get listCalls() {
+      return listCalls;
+    },
+    setVerified(value: boolean) {
+      verified = value;
+      for (const listener of userListeners) listener();
+    },
+    setTeams(next: TeamSummary[]) {
+      teams = next;
+    },
+    setInvitations(next: TeamReceivedInvitation[]) {
+      invitations = next;
+    },
+    push(n: TeamNotification) {
+      for (const listener of teamListeners) listener(n);
+    },
+    pushUpdate(event: TeamUpdatedEvent) {
+      for (const listener of updateListeners) listener(event);
+    },
+  };
+}
+
+async function flush() {
+  await new Promise((resolve) => setTimeout(resolve, 0));
+  await new Promise((resolve) => setTimeout(resolve, 0));
+}
+
+describe("TeamStore", () => {
+  test("loads teams sorted by name once verified and empties on sign-out", async () => {
+    const fake = fakeClient();
+    const store = new TeamStore(fake.client);
+    const seen: number[] = [];
+    store.subscribe((snapshot) => seen.push(snapshot.teams.length));
+    store.start();
+    await flush();
+    expect(store.getSnapshot().teams.map((entry) => entry.name)).toEqual(["Macro Desk", "Rates"]);
+    expect(store.getSnapshot().loaded).toBe(true);
+    expect(store.getTeam("org-2")?.shortName).toBe("RT");
+    expect(store.getTeamForChannel("team:org-1")?.name).toBe("Macro Desk");
+    expect(store.findTeam("rt")?.id).toBe("org-2");
+
+    fake.setVerified(false);
+    expect(store.getSnapshot().teams).toEqual([]);
+    expect(store.getSnapshot().loaded).toBe(false);
+    expect(seen.at(-1)).toBe(0);
+    store.dispose();
+  });
+
+  test("keeps focus and cards in persistence and derives the default team", () => {
+    const persistence = new MemoryPluginPersistence();
+    persistence.setState("team-focus", { teamId: "org-1" });
+    persistence.setState("team-notifications", [notification("n1", "team-joined")]);
+    const store = new TeamStore(fakeClient().client);
+    store.attach(persistence);
+    expect(store.getSnapshot().focus).toEqual({ teamId: "org-1" });
+    expect(store.getSnapshot().notifications.map((entry) => entry.id)).toEqual(["n1"]);
+    // Not loaded yet, so the focused team does not resolve to a default.
+    expect(store.getDefaultTeamId()).toBeNull();
+
+    store.setFocus("personal");
+    expect(persistence.getState("team-focus")).toBe("personal");
+  });
+
+  test("receives cards, notifies with an action, refreshes on joins, and dismisses", async () => {
+    const fake = fakeClient();
+    const store = new TeamStore(fake.client);
+    const persistence = new MemoryPluginPersistence();
+    store.attach(persistence);
+    const toasts: Array<{ title?: string; body: string; action?: { label: string } }> = [];
+    const opened: string[] = [];
+    store.setNotifier((request) => {
+      toasts.push({ title: request.title, body: request.body, action: request.action });
+      return { toastVisible: true, desktopRequested: false };
+    }, { openTeamChannel: (teamId) => opened.push(teamId) });
+    store.start();
+    await flush();
+    const before = fake.listCalls;
+
+    fake.push(notification("n1", "team-joined"));
+    await flush();
+    expect(toasts).toEqual([
+      { title: "MD· Macro Desk", body: "@alice joined Macro Desk.", action: { label: "Open chat", onClick: expect.any(Function) } },
+    ]);
+    expect(fake.listCalls).toBe(before + 1);
+    toasts[0]?.action && (toasts[0].action as { onClick: () => void }).onClick();
+    expect(opened).toEqual(["org-1"]);
+    expect(persistence.getState<TeamNotification[]>("team-notifications")?.map((entry) => entry.id)).toEqual(["n1"]);
+
+    fake.push(notification("n2", "layout-updated", "2026-09-14T12:01:00.000Z"));
+    fake.push(notification("n2", "layout-updated", "2026-09-14T12:01:00.000Z"));
+    await flush();
+    expect(store.getSnapshot().notifications.map((entry) => entry.id)).toEqual(["n1", "n2"]);
+    // No layout action registered, so no button on that toast.
+    expect(toasts[1]?.action).toBeUndefined();
+
+    await store.dismissNotificationsForTeam("org-1", ["layout-updated"]);
+    expect(store.getSnapshot().notifications.map((entry) => entry.id)).toEqual(["n1"]);
+    expect(fake.delivered).toEqual([["n2"]]);
+    await store.dismissNotifications([]);
+    expect(fake.delivered).toHaveLength(1);
+    store.dispose();
+  });
+
+  test("team.updated refreshes, tells listeners, and folded channel sections persist", async () => {
+    const fake = fakeClient();
+    const store = new TeamStore(fake.client);
+    const persistence = new MemoryPluginPersistence();
+    store.attach(persistence);
+    store.start();
+    await flush();
+    const before = fake.listCalls;
+    const seen: TeamUpdatedEvent[] = [];
+    const stop = store.onTeamUpdated((event) => seen.push(event));
+    fake.pushUpdate({ teamId: "org-1", change: "channels" });
+    await flush();
+    expect(fake.listCalls).toBe(before + 1);
+    expect(seen).toEqual([{ teamId: "org-1", change: "channels" }]);
+    stop();
+
+    store.toggleTeamCollapsed("org-1");
+    expect(store.isTeamCollapsed("org-1")).toBe(true);
+    expect(persistence.getState("team-collapsed-channels")).toEqual(["org-1"]);
+    store.toggleTeamCollapsed("org-1");
+    expect(store.isTeamCollapsed("org-1")).toBe(false);
+
+    // Applying a server response is immediate; a later refresh confirms it.
+    store.upsertTeam(team({ id: "org-3", name: "Alpha", shortName: "AL" }));
+    expect(store.getSnapshot().teams.map((entry) => entry.name)).toEqual(["Alpha", "Macro Desk", "Rates"]);
+    store.setFocus({ teamId: "org-3" });
+    store.removeTeam("org-3");
+    expect(store.getSnapshot().teams).toHaveLength(2);
+    expect(store.getSnapshot().focus).toBe("all");
+    store.dispose();
+  });
+
+  test("refresh is shared while in flight and reports errors without dropping teams", async () => {
+    let resolveList: ((teams: TeamSummary[]) => void) | null = null;
+    let calls = 0;
+    const fake = fakeClient({
+      listTeams: () => new Promise((resolve) => {
+        calls += 1;
+        resolveList = resolve;
+      }),
+    });
+    const store = new TeamStore(fake.client);
+    const first = store.refresh();
+    const second = store.refresh();
+    expect(calls).toBe(1);
+    expect(store.getSnapshot().loading).toBe(true);
+    resolveList?.([team({})]);
+    await Promise.all([first, second]);
+    expect(store.getSnapshot().teams).toHaveLength(1);
+    expect(calls).toBe(1);
+
+    const failing = new TeamStore(fakeClient({ listTeams: async () => { throw new Error("offline"); } }).client);
+    await failing.refresh();
+    expect(failing.getSnapshot()).toMatchObject({ loaded: true, loading: false, error: "offline" });
+  });
+});

package/src/plugins/builtin/cloud/team/store.ts

@@ -0,0 +1,318 @@
+import {
+  apiClient,
+  type TeamNotification,
+  type TeamReceivedInvitation,
+  type TeamSummary,
+  type TeamUpdatedEvent,
+} from "../../../../api-client";
+import type { AppNotificationDelivery, AppNotificationRequest, PluginPersistence } from "../../../../types/plugin";
+import { describeTeamNotification, findTeam, teamIdFromChannelId } from "./model";
+
+export interface TeamStoreSnapshot {
+  /** Teams the signed-in person belongs to, sorted by name. */
+  teams: TeamSummary[];
+  /** Invitations waiting on this person. */
+  invitations: TeamReceivedInvitation[];
+  /** Undelivered team cards: invites, joins, layout updates. */
+  notifications: TeamNotification[];
+  loaded: boolean;
+  loading: boolean;
+  error: string | null;
+  /** The FOCUS lens: everything, one team, or personal only. Per device. */
+  focus: "all" | "personal" | { teamId: string };
+  /** Tab groups the person folded or unfolded by hand since the last FOCUS change. */
+  toggledGroups: ReadonlySet<string>;
+  /** Teams whose channel section in the chat sidebar is folded. Per device. */
+  collapsedTeams: ReadonlySet<string>;
+}
+
+type Listener = (snapshot: TeamStoreSnapshot) => void
+type Notifier = (request: AppNotificationRequest) => AppNotificationDelivery | void
+
+const FOCUS_STATE_KEY = "team-focus";
+const NOTIFICATION_STATE_KEY = "team-notifications";
+const COLLAPSED_STATE_KEY = "team-collapsed-channels";
+
+interface TeamNotificationActions {
+  openTeamChannel?: (teamId: string) => void;
+  openTeamInvites?: () => void;
+  openTeamLayout?: (teamId: string, layoutId: string) => void;
+}
+
+const EMPTY: TeamStoreSnapshot = {
+  teams: [],
+  invitations: [],
+  notifications: [],
+  loaded: false,
+  loading: false,
+  error: null,
+  focus: "all",
+  toggledGroups: new Set(),
+  collapsedTeams: new Set(),
+};
+
+/**
+ * One place that knows which teams the account is in. Other plugins read it
+ * through the `cloud.team` capability, the chat sidebar and status bar read it
+ * directly. Refreshes on sign-in, empties on sign-out, and folds the
+ * `team.notification` frames into cards the person can act on.
+ */
+/** The slice of the API client the store uses, so tests can hand in a fake. */
+export type TeamStoreClient = Pick<
+  typeof apiClient,
+  | "isVerified"
+  | "subscribeCurrentUser"
+  | "subscribeTeamNotifications"
+  | "subscribeTeamUpdates"
+  | "listTeams"
+  | "listMyTeamInvitations"
+  | "getTeamNotifications"
+  | "markChatNotificationsDelivered"
+>;
+
+export class TeamStore {
+  constructor(private readonly client: TeamStoreClient = apiClient) {}
+
+  private snapshot: TeamStoreSnapshot = EMPTY;
+  private readonly listeners = new Set<Listener>();
+  private persistence: PluginPersistence | null = null;
+  private notifier: Notifier | null = null;
+  private actions: TeamNotificationActions = {};
+  private disposers: Array<() => void> = [];
+  private refreshPromise: Promise<void> | null = null;
+  private started = false;
+
+  getSnapshot(): TeamStoreSnapshot {
+    return this.snapshot;
+  }
+
+  subscribe(listener: Listener): () => void {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  }
+
+  attach(persistence: PluginPersistence): void {
+    this.persistence = persistence;
+    const focus = persistence.getState<TeamStoreSnapshot["focus"]>(FOCUS_STATE_KEY);
+    const notifications = persistence.getState<TeamNotification[]>(NOTIFICATION_STATE_KEY);
+    const collapsed = persistence.getState<string[]>(COLLAPSED_STATE_KEY);
+    this.update({
+      focus: focus ?? "all",
+      notifications: Array.isArray(notifications) ? notifications : [],
+      collapsedTeams: new Set(Array.isArray(collapsed) ? collapsed : []),
+    });
+  }
+
+  setNotifier(notifier: Notifier | null, actions: TeamNotificationActions = {}): void {
+    this.notifier = notifier;
+    this.actions = actions;
+  }
+
+  /** Begins following auth state and the realtime feed. Idempotent. */
+  start(): void {
+    if (this.started) return;
+    this.started = true;
+    const syncAuth = () => {
+      if (this.client.isVerified()) {
+        void this.refresh();
+      } else if (this.snapshot.loaded || this.snapshot.teams.length > 0) {
+        this.update({ ...EMPTY, focus: this.snapshot.focus, collapsedTeams: this.snapshot.collapsedTeams });
+      }
+    };
+    this.disposers.push(this.client.subscribeCurrentUser(syncAuth));
+    this.disposers.push(
+      this.client.subscribeTeamNotifications((notification) => this.receive(notification)),
+    );
+    this.disposers.push(this.client.subscribeTeamUpdates((event) => this.receiveUpdate(event)));
+    syncAuth();
+  }
+
+  /** Listeners for `team.updated`, so panes showing a team refetch its details. */
+  private readonly updateListeners = new Set<(event: TeamUpdatedEvent) => void>();
+
+  onTeamUpdated(listener: (event: TeamUpdatedEvent) => void): () => void {
+    this.updateListeners.add(listener);
+    return () => {
+      this.updateListeners.delete(listener);
+    };
+  }
+
+  private receiveUpdate(event: TeamUpdatedEvent): void {
+    void this.refresh();
+    for (const listener of this.updateListeners) listener(event);
+  }
+
+  /** Applies a team the server just returned without waiting for a refresh. */
+  upsertTeam(team: TeamSummary): void {
+    const others = this.snapshot.teams.filter((entry) => entry.id !== team.id);
+    this.update({ teams: [...others, team].sort((a, b) => a.name.localeCompare(b.name)) });
+  }
+
+  removeTeam(teamId: string): void {
+    const focus = this.snapshot.focus;
+    this.update({
+      teams: this.snapshot.teams.filter((entry) => entry.id !== teamId),
+      ...(typeof focus === "object" && focus.teamId === teamId ? { focus: "all" as const } : {}),
+    });
+  }
+
+  removeInvitation(invitationId: string): void {
+    this.update({ invitations: this.snapshot.invitations.filter((entry) => entry.id !== invitationId) });
+  }
+
+  isTeamCollapsed(teamId: string): boolean {
+    return this.snapshot.collapsedTeams.has(teamId);
+  }
+
+  toggleTeamCollapsed(teamId: string): void {
+    const next = new Set(this.snapshot.collapsedTeams);
+    if (next.has(teamId)) next.delete(teamId);
+    else next.add(teamId);
+    this.update({ collapsedTeams: next });
+    this.persistence?.setState(COLLAPSED_STATE_KEY, [...next]);
+  }
+
+  dispose(): void {
+    for (const dispose of this.disposers.splice(0)) dispose();
+    this.started = false;
+    this.refreshPromise = null;
+  }
+
+  getTeam(teamId: string | null | undefined): TeamSummary | null {
+    if (!teamId) return null;
+    return this.snapshot.teams.find((team) => team.id === teamId) ?? null;
+  }
+
+  getTeamForChannel(channelId: string): TeamSummary | null {
+    return this.getTeam(teamIdFromChannelId(channelId));
+  }
+
+  findTeam(query: string): TeamSummary | null {
+    return findTeam(this.snapshot.teams, query);
+  }
+
+  /** The team owner pickers default to: the focused team, else none. */
+  getDefaultTeamId(): string | null {
+    const focus = this.snapshot.focus;
+    return typeof focus === "object" && this.getTeam(focus.teamId) ? focus.teamId : null;
+  }
+
+  setFocus(focus: TeamStoreSnapshot["focus"]): void {
+    // A new lens resets hand-folded groups so the lens is what you see.
+    this.update({ focus, toggledGroups: new Set() });
+    this.persistence?.setState(FOCUS_STATE_KEY, focus);
+  }
+
+  /** Folds or unfolds one tab group by hand until FOCUS changes. */
+  toggleGroup(groupId: string): void {
+    const next = new Set(this.snapshot.toggledGroups);
+    if (next.has(groupId)) next.delete(groupId);
+    else next.add(groupId);
+    this.update({ toggledGroups: next });
+  }
+
+  async refresh(): Promise<void> {
+    if (this.refreshPromise) return this.refreshPromise;
+    this.update({ loading: true, error: null });
+    this.refreshPromise = (async () => {
+      try {
+        const [teams, invitations, notifications] = await Promise.all([
+          this.client.listTeams(),
+          this.client.listMyTeamInvitations().catch(() => [] as TeamReceivedInvitation[]),
+          this.client.getTeamNotifications().catch(() => null),
+        ]);
+        this.update({
+          teams: [...teams].sort((a, b) => a.name.localeCompare(b.name)),
+          invitations,
+          ...(notifications ? { notifications: this.mergeNotifications(notifications) } : {}),
+          loaded: true,
+          loading: false,
+          error: null,
+        });
+        this.persistNotifications();
+      } catch (error) {
+        this.update({
+          loading: false,
+          loaded: true,
+          error: error instanceof Error ? error.message : "Could not load teams.",
+        });
+      } finally {
+        this.refreshPromise = null;
+      }
+    })();
+    return this.refreshPromise;
+  }
+
+  /** Marks cards handled and tells the server so they stop coming back. */
+  async dismissNotifications(ids: readonly string[]): Promise<void> {
+    if (ids.length === 0) return;
+    const remaining = this.snapshot.notifications.filter((entry) => !ids.includes(entry.id));
+    this.update({ notifications: remaining });
+    this.persistNotifications();
+    try {
+      await this.client.markChatNotificationsDelivered([...ids]);
+    } catch {
+      /* The next refresh brings them back if the server never heard. */
+    }
+  }
+
+  dismissNotificationsForTeam(teamId: string, kinds?: readonly TeamNotification["type"][]): Promise<void> {
+    const ids = this.snapshot.notifications
+      .filter((entry) => entry.data.team.id === teamId && (!kinds || kinds.includes(entry.type)))
+      .map((entry) => entry.id);
+    return this.dismissNotifications(ids);
+  }
+
+  private receive(notification: TeamNotification): void {
+    this.update({ notifications: this.mergeNotifications([notification]) });
+    this.persistNotifications();
+    if (notification.type === "team-joined" || notification.type === "team-invite") {
+      void this.refresh();
+    }
+    const { title, body } = describeTeamNotification(notification);
+    const action = this.actionFor(notification);
+    this.notifier?.({
+      title,
+      body,
+      type: "info",
+      desktop: "when-inactive",
+      ...(action ? { action } : {}),
+    });
+  }
+
+  private actionFor(notification: TeamNotification): AppNotificationRequest["action"] | null {
+    const data = notification.data;
+    if (data.kind === "team-invite" && this.actions.openTeamInvites) {
+      return { label: "Review", onClick: () => this.actions.openTeamInvites?.() };
+    }
+    if (data.kind === "team-joined" && this.actions.openTeamChannel) {
+      return { label: "Open chat", onClick: () => this.actions.openTeamChannel?.(data.team.id) };
+    }
+    if (data.kind === "layout-updated" && this.actions.openTeamLayout) {
+      return {
+        label: "Open layout",
+        onClick: () => this.actions.openTeamLayout?.(data.team.id, data.layoutId),
+      };
+    }
+    return null;
+  }
+
+  private mergeNotifications(incoming: readonly TeamNotification[]): TeamNotification[] {
+    const byId = new Map(this.snapshot.notifications.map((entry) => [entry.id, entry]));
+    for (const entry of incoming) byId.set(entry.id, entry);
+    return [...byId.values()].sort((a, b) => a.createdAt.localeCompare(b.createdAt)).slice(-100);
+  }
+
+  private persistNotifications(): void {
+    this.persistence?.setState(NOTIFICATION_STATE_KEY, this.snapshot.notifications);
+  }
+
+  private update(patch: Partial<TeamStoreSnapshot>): void {
+    this.snapshot = { ...this.snapshot, ...patch };
+    for (const listener of this.listeners) listener(this.snapshot);
+  }
+}
+
+export const teamStore = new TeamStore();

package/src/plugins/builtin/cloud/team/team-state-host.ts

@@ -0,0 +1,70 @@
+import { apiClient, type TeamPluginStateEntry, type TeamPluginStateEvent } from "../../../../api-client";
+import { setTeamStateHost, type TeamStateHost } from "../../../team-state";
+import { teamStore } from "./store";
+
+type Listener = (entry: { value: unknown; revision: number; updatedBy: string; updatedAt: string } | null) => void
+
+function key(teamId: string, pluginId: string, key: string): string {
+  return `${teamId}\u0000${pluginId}\u0000${key}`;
+}
+
+function publicEntry(entry: TeamPluginStateEntry) {
+  return { value: entry.value, revision: entry.revision, updatedBy: entry.updatedBy, updatedAt: entry.updatedAt };
+}
+
+/**
+ * Backs `ctx.teamState` with the team_plugin_state routes. Subscriptions ride
+ * the plugin-state.updated frame, which carries the new value, so a change by
+ * a teammate reaches every listener without a refetch.
+ */
+export function installTeamStateHost(): () => void {
+  const listeners = new Map<string, Set<Listener>>();
+  const unsubscribe = apiClient.subscribeCloudEvent("plugin-state.updated", (data) => {
+    const event = data as TeamPluginStateEvent;
+    if ("state" in event) {
+      const targets = listeners.get(key(event.teamId, event.state.pluginId, event.state.key));
+      if (targets) for (const listener of targets) listener(publicEntry(event.state));
+      return;
+    }
+    const targets = listeners.get(key(event.teamId, event.pluginId, event.key));
+    if (targets) for (const listener of targets) listener(null);
+  });
+
+  const host: TeamStateHost = {
+    activeTeamId: () => {
+      const focused = teamStore.getDefaultTeamId();
+      if (focused) return focused;
+      const teams = teamStore.getSnapshot().teams;
+      return teams.length === 1 ? teams[0]!.id : null;
+    },
+    async get(teamId, pluginId, stateKey) {
+      const entry = await apiClient.getTeamPluginState(teamId, pluginId, stateKey);
+      return entry ? publicEntry(entry) : null;
+    },
+    async list(teamId, pluginId) {
+      const entries = await apiClient.listTeamPluginState(teamId, pluginId);
+      return entries.map((entry) => ({ key: entry.key, ...publicEntry(entry) }));
+    },
+    async set(teamId, pluginId, stateKey, value, expectRevision) {
+      return publicEntry(await apiClient.putTeamPluginState(teamId, pluginId, stateKey, value, expectRevision));
+    },
+    async delete(teamId, pluginId, stateKey) {
+      await apiClient.deleteTeamPluginState(teamId, pluginId, stateKey);
+    },
+    subscribe(teamId, pluginId, stateKey, listener) {
+      const id = key(teamId, pluginId, stateKey);
+      const set = listeners.get(id) ?? new Set<Listener>();
+      set.add(listener);
+      listeners.set(id, set);
+      return () => {
+        set.delete(listener);
+        if (set.size === 0) listeners.delete(id);
+      };
+    },
+  };
+  setTeamStateHost(host);
+  return () => {
+    unsubscribe();
+    setTeamStateHost(null);
+  };
+}