@stigmer/react 3.3.0 → 3.4.0

package/src/cursor-accounts/MemberKeysPanel.tsx

@@ -0,0 +1,278 @@
+"use client";
+
+import { useState } from "react";
+import { cn } from "@stigmer/theme";
+import { getUserMessage } from "@stigmer/sdk";
+import type { CursorAccountView } from "@stigmer/protos/ai/stigmer/platform/cursoraccount/v1/io_pb";
+import { Button } from "../button/index.js";
+import { INPUT_CLASSES } from "../internal/form-primitives.js";
+import { toError } from "../internal/toError.js";
+import type { CursorAccountCoverage } from "./cursor-account-coverage.js";
+import { MemberCoverageTable } from "./MemberCoverageTable.js";
+import type { useCursorMemberKeyActions } from "./useCursorMemberKeyActions.js";
+
+/** One line's outcome from a bulk key import. */
+interface ImportLineResult {
+  /** Masked identification of the key (never the full material). */
+  readonly keyPreview: string;
+  readonly ok: boolean;
+  /** Bound email on success; the server/Cursor error on failure. */
+  readonly message: string;
+}
+
+/** Parse bulk-import text: one key per line, trimmed, deduped. */
+function parseImportKeys(text: string): string[] {
+  return [...new Set(text.split(/\r?\n/).map((s) => s.trim()).filter((s) => s !== ""))];
+}
+
+function maskKey(key: string, index: number): string {
+  return key.length >= 8 ? `key ${index + 1} (…${key.slice(-4)})` : `key ${index + 1}`;
+}
+
+/**
+ * The team-coverage panel of one Cursor account: the roster-coverage
+ * table (every member and key in three explicit categories) plus the
+ * add-key and bulk-import forms.
+ *
+ * Bulk import is sequential on purpose: each key is validated live
+ * against Cursor's /v1/me, and per-key errors (wrong key class, revoked,
+ * duplicate) must be attributable to their line. Keys whose owner turns
+ * out not to be on the team are still added — the post-import sync lands
+ * them in the table's "not on the team" category with invite guidance.
+ */
+export function MemberKeysPanel({
+  accountId,
+  view,
+  coverage,
+  actions,
+  onChanged,
+  onImported,
+}: {
+  readonly accountId: string;
+  readonly view: CursorAccountView;
+  /** Derived once by the parent (also feeds its header member count). */
+  readonly coverage: CursorAccountCoverage;
+  readonly actions: ReturnType<typeof useCursorMemberKeyActions>;
+  readonly onChanged: () => void;
+  /** Called after a bulk import added at least one key (triggers sync). */
+  readonly onImported: () => void;
+}) {
+  const [newKey, setNewKey] = useState("");
+  const [newLabel, setNewLabel] = useState("");
+  const [showImport, setShowImport] = useState(false);
+  const [importText, setImportText] = useState("");
+  const [isImporting, setIsImporting] = useState(false);
+  const [importProgress, setImportProgress] = useState<
+    { readonly done: number; readonly total: number } | null
+  >(null);
+  const [importResults, setImportResults] = useState<readonly ImportLineResult[] | null>(
+    null,
+  );
+
+  const keyViews = view.keyViews;
+  const hasRows =
+    coverage.unclassified.length > 0 ||
+    coverage.onTeamWithKey.length > 0 ||
+    coverage.onTeamWithoutKey.length > 0 ||
+    coverage.offTeamWithKey.length > 0;
+
+  const submitNewKey = (e: React.FormEvent) => {
+    e.preventDefault();
+    if (newKey.trim() === "" || actions.isSubmitting) return;
+    void actions
+      .addKey({ accountId, apiKey: newKey.trim(), label: newLabel.trim() || undefined })
+      .then(() => {
+        setNewKey("");
+        setNewLabel("");
+        onChanged();
+      }, () => {
+        // Surfaced via actions.error (incl. Cursor's own key-class 401 text).
+      });
+  };
+
+  const importKeyCount = parseImportKeys(importText).length;
+
+  const submitImport = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const keys = parseImportKeys(importText);
+    if (keys.length === 0 || isImporting) return;
+
+    setIsImporting(true);
+    setImportResults(null);
+
+    // Sequential on purpose: each key is validated live against Cursor's
+    // /v1/me, and per-key errors (wrong key class, revoked, duplicate)
+    // must be attributable to their line.
+    const knownKeyIds = new Set(
+      keyViews.map((kv) => kv.key?.keyId).filter((id): id is string => !!id),
+    );
+    const results: ImportLineResult[] = [];
+    const failedKeys: string[] = [];
+    for (const [i, key] of keys.entries()) {
+      setImportProgress({ done: i, total: keys.length });
+      try {
+        const account = await actions.addKey({ accountId, apiKey: key });
+        const addedKey = account.memberKeys.find((mk) => !knownKeyIds.has(mk.keyId));
+        if (addedKey) knownKeyIds.add(addedKey.keyId);
+        results.push({
+          keyPreview: maskKey(key, i),
+          ok: true,
+          message: addedKey?.boundEmail
+            ? `added — bound to ${addedKey.boundEmail}`
+            : "added",
+        });
+      } catch (err) {
+        actions.clearError();
+        failedKeys.push(key);
+        results.push({
+          keyPreview: maskKey(key, i),
+          ok: false,
+          message: getUserMessage(toError(err)),
+        });
+      }
+    }
+
+    setImportProgress(null);
+    setImportResults(results);
+    // Failed lines stay in the box so the operator can fix and retry.
+    setImportText(failedKeys.join("\n"));
+    setIsImporting(false);
+    if (failedKeys.length < keys.length) onImported();
+  };
+
+  return (
+    <section className="space-y-2">
+      <h4 className="text-xs font-semibold text-foreground">Team coverage</h4>
+
+      {keyViews.length === 0 && (
+        <p className="text-xs text-muted-foreground" role="status">
+          No execution keys — this account is <strong>not routable</strong>.
+          Add a member's user-scoped API key below.
+        </p>
+      )}
+
+      {hasRows && (
+        <MemberCoverageTable
+          accountId={accountId}
+          coverage={coverage}
+          inviteLink={view.account?.teamInviteLink ?? ""}
+          actions={actions}
+          onChanged={onChanged}
+        />
+      )}
+
+      {actions.error && (
+        <p className="text-destructive text-xs" role="alert">
+          {getUserMessage(actions.error)}
+        </p>
+      )}
+
+      <form className="flex flex-wrap items-end gap-2" onSubmit={submitNewKey}>
+        <label className="block min-w-56 flex-1 space-y-1">
+          <span className="text-[11px] font-medium text-muted-foreground">
+            User-scoped API key
+          </span>
+          <input
+            className={INPUT_CLASSES}
+            type="password"
+            value={newKey}
+            onChange={(e) => setNewKey(e.target.value)}
+            placeholder="the member's personal Cursor API key"
+            disabled={actions.isSubmitting}
+            autoComplete="off"
+          />
+        </label>
+        <label className="block min-w-40 space-y-1">
+          <span className="text-[11px] font-medium text-muted-foreground">
+            Label (optional)
+          </span>
+          <input
+            className={INPUT_CLASSES}
+            value={newLabel}
+            onChange={(e) => setNewLabel(e.target.value)}
+            placeholder="e.g. zane — prod"
+            disabled={actions.isSubmitting}
+          />
+        </label>
+        <Button type="submit" size="sm" disabled={newKey.trim() === "" || actions.isSubmitting}>
+          {actions.isSubmitting ? "Verifying…" : "Add key"}
+        </Button>
+        <Button
+          type="button"
+          size="sm"
+          variant="outline"
+          disabled={isImporting}
+          onClick={() => {
+            setShowImport((v) => !v);
+            setImportResults(null);
+          }}
+        >
+          {showImport ? "Hide import" : "Import keys"}
+        </Button>
+      </form>
+
+      {showImport && (
+        <form className="space-y-2 rounded-md border border-border bg-card p-3" onSubmit={submitImport}>
+          <label className="block space-y-1">
+            <span className="text-[11px] font-medium text-muted-foreground">
+              Bulk import — one user-scoped API key per line
+            </span>
+            <textarea
+              className={cn(INPUT_CLASSES, "min-h-24 font-mono")}
+              value={importText}
+              onChange={(e) => setImportText(e.target.value)}
+              placeholder={"key_...\nkey_...\nkey_..."}
+              disabled={isImporting}
+              autoComplete="off"
+              spellCheck={false}
+            />
+          </label>
+          <p className="text-[11px] text-muted-foreground">
+            Each key is verified against Cursor and bound to its owning team
+            member, one at a time. Lines that fail stay in the box so you can
+            fix and retry them. A roster sync runs automatically afterwards,
+            so the coverage table reflects current team membership.
+          </p>
+          <div className="flex items-center gap-2">
+            <Button type="submit" size="sm" disabled={importKeyCount === 0 || isImporting}>
+              {isImporting && importProgress
+                ? `Importing ${importProgress.done + 1} of ${importProgress.total}…`
+                : importKeyCount > 0
+                  ? `Import ${importKeyCount} ${importKeyCount === 1 ? "key" : "keys"}`
+                  : "Import keys"}
+            </Button>
+            <Button
+              type="button"
+              size="sm"
+              variant="outline"
+              disabled={isImporting}
+              onClick={() => {
+                setShowImport(false);
+                setImportText("");
+                setImportResults(null);
+              }}
+            >
+              Close
+            </Button>
+          </div>
+          {importResults && (
+            <ul
+              role="list"
+              aria-label="Import results"
+              className="m-0 list-none space-y-0.5 p-0 text-[11px]"
+            >
+              {importResults.map((result) => (
+                <li
+                  key={result.keyPreview}
+                  className={result.ok ? "text-muted-foreground" : "text-destructive"}
+                >
+                  {result.keyPreview}: {result.message}
+                </li>
+              ))}
+            </ul>
+          )}
+        </form>
+      )}
+    </section>
+  );
+}

package/src/cursor-accounts/__tests__/CursorAccountsConsole.test.tsx

@@ -17,6 +17,7 @@ import {
   CursorAccountViewSchema,
   CursorMemberKeyViewSchema,
   CursorMemberKeyState,
+  CursorTeamMemberViewSchema,
 } from "@stigmer/protos/ai/stigmer/platform/cursoraccount/v1/io_pb";
 import { StigmerContext } from "../../context";
 import { FetchCacheContext } from "../../internal/FetchCacheProvider";
@@ -108,6 +109,14 @@ function scenarView() {
           name: "Uncovered U",
           role: "member",
         }),
+        // Cursor marks departed seats role:"removed" in place; they stay
+        // in the roster snapshot but never in the coverage categories.
+        create(CursorTeamMemberSchema, {
+          userId: "u3",
+          email: "departed@scenar.ai",
+          name: "Departed D",
+          role: "removed",
+        }),
       ],
       spend: [
         create(CursorMemberSpendSchema, {
@@ -128,6 +137,8 @@ function scenarView() {
         }),
       }),
     ],
+    // The server populates both the deprecated flat list and the
+    // spend-joined views; the console reads only the views.
     membersWithoutKeys: [
       create(CursorTeamMemberSchema, {
         userId: "u2",
@@ -136,6 +147,21 @@ function scenarView() {
         role: "member",
       }),
     ],
+    membersWithoutKeysViews: [
+      create(CursorTeamMemberViewSchema, {
+        member: create(CursorTeamMemberSchema, {
+          userId: "u2",
+          email: "uncovered@scenar.ai",
+          name: "Uncovered U",
+          role: "member",
+        }),
+        spend: create(CursorMemberSpendSchema, {
+          userId: "u2",
+          email: "uncovered@scenar.ai",
+          includedSpendUsdMicros: 42000n,
+        }),
+      }),
+    ],
   });
 }
 
@@ -153,14 +179,15 @@ describe("CursorAccountsConsole", () => {
     );
   });
 
-  it("lists accounts with routability at a glance", async () => {
+  it("lists accounts with routability and the derived pool class at a glance", async () => {
     const notRoutable = create(CursorAccountSummarySchema, {
       account: scenarAccount({
         accountId: "acc-2",
         displayName: "empty team",
         memberKeys: [],
+        // No org assignment = shared-pool account (DD-008): the class is
+        // derived from org_ids, never from the deprecated default flag.
         orgIds: [],
-        isPlatformDefault: true,
       }),
       enabledKeyCount: 0,
     });
@@ -174,7 +201,7 @@ describe("CursorAccountsConsole", () => {
     await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
     expect(screen.getByText("empty team")).toBeTruthy();
     expect(screen.getByText("Not routable")).toBeTruthy();
-    expect(screen.getByText("platform default")).toBeTruthy();
+    expect(screen.getByText("shared pool")).toBeTruthy();
   });
 
   it("shows the designed access notice on PERMISSION_DENIED", async () => {
@@ -193,7 +220,7 @@ describe("CursorAccountsConsole", () => {
     expect(screen.queryByText(/only platform operators/)).toBeNull();
   });
 
-  it("opens the detail view with key coverage, spend, and gap list", async () => {
+  it("opens the detail view with the coverage table: covered and gap rows in their groups", async () => {
     const client = createMockStigmer({
       listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
       getAccountView: vi.fn().mockResolvedValue(scenarView()),
@@ -203,12 +230,198 @@ describe("CursorAccountsConsole", () => {
     await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
     await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
 
-    await waitFor(() => expect(screen.getByText(/zane@scenar\.ai/)).toBeTruthy());
-    // Spend joined to the key row: 169342 micro-USD = $0.17.
-    expect(screen.getByText(/\$0\.17 this cycle/)).toBeTruthy();
-    // Coverage gap: the active member with no key, by name and email.
-    expect(screen.getByText(/uncovered@scenar\.ai/)).toBeTruthy();
+    await waitFor(() =>
+      expect(screen.getByRole("table", { name: "Team coverage" })).toBeTruthy(),
+    );
+    // Category 1: on the team, key held — email, key name, spend, status.
+    expect(screen.getByText(/On the team — key held/)).toBeTruthy();
+    expect(screen.getByText("zane@scenar.ai")).toBeTruthy();
+    expect(screen.getByText("stigmer-prod")).toBeTruthy();
+    // The email is the row's identity: full value always hoverable on
+    // both row kinds (the cell wraps rather than truncates).
+    expect(screen.getByTitle("zane@scenar.ai")).toBeTruthy();
+    expect(screen.getByTitle("uncovered@scenar.ai")).toBeTruthy();
+    expect(screen.getByText("$0.17")).toBeTruthy(); // included, 169342 micro-USD
     expect(screen.getByText("Active")).toBeTruthy();
+    // Category 2: on the team, no key — server-joined spend on the gap row.
+    expect(screen.getByText(/On the team — no execution key/)).toBeTruthy();
+    expect(screen.getByText("uncovered@scenar.ai")).toBeTruthy();
+    expect(screen.getByText("$0.04")).toBeTruthy(); // included, 42000 micro-USD
+    expect(screen.getByText("No key")).toBeTruthy();
+    // Both rows carry all four numeric columns: zero on-demand renders as
+    // a real dollar amount and zero pool percents as "0%" (matching
+    // Cursor's dashboard), never as em-dashes — those mean "no spend row".
+    expect(screen.getAllByText("$0.00")).toHaveLength(2); // on-demand × 2 rows
+    expect(screen.getAllByText("0%")).toHaveLength(4); // first-party + API × 2 rows
+    // Removed roster entries never render as coverage rows.
+    expect(screen.queryByText("departed@scenar.ai")).toBeNull();
+    // Header sync line: active members from server facts, removed seats
+    // by list arithmetic (roster entries minus active members).
+    expect(screen.getByText(/2 members · 1 removed seat/)).toBeTruthy();
+  });
+
+  it("affirms full coverage instead of hiding the gap group when every active member holds a key", async () => {
+    const coveredView = create(CursorAccountViewSchema, {
+      account: scenarAccount(),
+      snapshot: create(CursorAccountSyncSnapshotSchema, {
+        accountId: "acc-1",
+        syncedAt: timestampFromDate(new Date("2026-07-22T12:00:00Z")),
+        members: [
+          create(CursorTeamMemberSchema, {
+            userId: "u1",
+            email: "zane@scenar.ai",
+            name: "Zane S",
+            role: "owner",
+          }),
+        ],
+      }),
+      keyViews: [
+        create(CursorMemberKeyViewSchema, {
+          key: scenarAccount().memberKeys[0],
+          state: CursorMemberKeyState.member_key_active,
+        }),
+      ],
+      // A fully covered roster: the server sends no gap views.
+    });
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
+      getAccountView: vi.fn().mockResolvedValue(coveredView),
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
+    await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
+
+    // The gap group renders with an affirmative answer, so "fully
+    // covered" is distinguishable from "the sync never classified".
+    await waitFor(() =>
+      expect(screen.getByText(/On the team — no execution key/)).toBeTruthy(),
+    );
+    expect(screen.getByText(/roster is fully covered/)).toBeTruthy();
+    // A member with no spend row at all renders em-dash cells.
+    expect(screen.getAllByText("—").length).toBeGreaterThan(0);
+  });
+
+  it("classifies off-team keys with invite guidance; copy button only with a configured link", async () => {
+    const writeText = vi.fn().mockResolvedValue(undefined);
+    Object.defineProperty(window.navigator, "clipboard", {
+      value: { writeText },
+      configurable: true,
+    });
+    const offTeamView = create(CursorAccountViewSchema, {
+      account: scenarAccount({
+        teamInviteLink: "https://cursor.com/team-invite/abc",
+      }),
+      snapshot: create(CursorAccountSyncSnapshotSchema, {
+        accountId: "acc-1",
+        syncedAt: timestampFromDate(new Date("2026-07-22T12:00:00Z")),
+      }),
+      keyViews: [
+        create(CursorMemberKeyViewSchema, {
+          key: create(CursorMemberKeySchema, {
+            keyId: "k-stranger",
+            apiKey: "***REDACTED***",
+            boundEmail: "stranger@else.where",
+            enabled: true,
+          }),
+          state: CursorMemberKeyState.member_key_owner_unknown,
+        }),
+        create(CursorMemberKeyViewSchema, {
+          key: create(CursorMemberKeySchema, {
+            keyId: "k-gone",
+            apiKey: "***REDACTED***",
+            boundEmail: "gone@scenar.ai",
+            enabled: true,
+          }),
+          state: CursorMemberKeyState.member_key_owner_removed,
+        }),
+      ],
+    });
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
+      getAccountView: vi.fn().mockResolvedValue(offTeamView),
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
+    await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
+
+    await waitFor(() =>
+      expect(screen.getByText(/Key held — not on the team/)).toBeTruthy(),
+    );
+    // The two off-team causes carry distinct labels.
+    expect(screen.getByText("Not on team")).toBeTruthy();
+    expect(screen.getByText("Left team")).toBeTruthy();
+
+    // One "Copy invite" per off-team row — a copy, never a navigation.
+    const copyButtons = screen.getAllByRole("button", { name: "Copy invite" });
+    expect(copyButtons).toHaveLength(2);
+    await userEvent.click(copyButtons[0]);
+    await waitFor(() =>
+      expect(writeText).toHaveBeenCalledWith("https://cursor.com/team-invite/abc"),
+    );
+    expect(screen.getByRole("button", { name: "Copied" })).toBeTruthy();
+  });
+
+  it("points at the Cursor dashboard when no invite link is configured", async () => {
+    const offTeamView = create(CursorAccountViewSchema, {
+      account: scenarAccount(),
+      snapshot: create(CursorAccountSyncSnapshotSchema, {
+        accountId: "acc-1",
+        syncedAt: timestampFromDate(new Date("2026-07-22T12:00:00Z")),
+      }),
+      keyViews: [
+        create(CursorMemberKeyViewSchema, {
+          key: create(CursorMemberKeySchema, {
+            keyId: "k-stranger",
+            apiKey: "***REDACTED***",
+            boundEmail: "stranger@else.where",
+            enabled: true,
+          }),
+          state: CursorMemberKeyState.member_key_owner_unknown,
+        }),
+      ],
+    });
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
+      getAccountView: vi.fn().mockResolvedValue(offTeamView),
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
+    await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
+
+    await waitFor(() =>
+      expect(screen.getByText(/Key held — not on the team/)).toBeTruthy(),
+    );
+    expect(screen.queryByRole("button", { name: "Copy invite" })).toBeNull();
+    expect(screen.getByText(/paste the team's invite link/)).toBeTruthy();
+  });
+
+  it("withholds classification before the first sync instead of reporting keys off-team", async () => {
+    const unsyncedView = create(CursorAccountViewSchema, {
+      account: scenarAccount(),
+      keyViews: [
+        create(CursorMemberKeyViewSchema, {
+          key: scenarAccount().memberKeys[0],
+          state: CursorMemberKeyState.member_key_owner_unknown,
+        }),
+      ],
+    });
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
+      getAccountView: vi.fn().mockResolvedValue(unsyncedView),
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
+    await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
+
+    await waitFor(() =>
+      expect(screen.getByText(/not yet classified/)).toBeTruthy(),
+    );
+    expect(screen.getByText("Awaiting sync")).toBeTruthy();
+    expect(screen.queryByText(/Key held — not on the team/)).toBeNull();
   });
 
   it("adds a member key and refreshes both views", async () => {
@@ -290,9 +503,13 @@ describe("CursorAccountsConsole", () => {
       "key_admin_plain",
     );
     await userEvent.type(
-      screen.getByLabelText(/Assigned organization ids/),
+      screen.getByLabelText(/Dedicated organization ids/),
       "org-x org-y",
     );
+    await userEvent.type(
+      screen.getByLabelText(/Team invite link/),
+      "https://cursor.com/team-invite/abc",
+    );
     await userEvent.click(screen.getByRole("button", { name: "Create account" }));
 
     await waitFor(() => expect(upsertAccount).toHaveBeenCalledTimes(1));
@@ -300,7 +517,39 @@ describe("CursorAccountsConsole", () => {
     expect(submitted.displayName).toBe("new team");
     expect(submitted.adminApiKey).toBe("key_admin_plain");
     expect(submitted.orgIds).toEqual(["org-x", "org-y"]);
+    // Readable round-trip: the invite link submits as typed, no marker.
+    expect(submitted.teamInviteLink).toBe("https://cursor.com/team-invite/abc");
     expect(submitted.enabled).toBe(true);
+    // Checkbox default checked ("on-demand enabled", Cursor's team default)
+    // negates into the proto field.
+    expect(submitted.onDemandUsageDisabled).toBe(false);
+    // The deprecated default flag is never written by current clients —
+    // the shared pool is derived from empty org_ids (DD-008).
+    expect(submitted.isPlatformDefault).toBe(false);
+  });
+
+  it("declares on-demand usage off through the editor checkbox", async () => {
+    const upsertAccount = vi.fn().mockResolvedValue(scenarAccount());
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [] }),
+      upsertAccount,
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() =>
+      expect(screen.getByRole("button", { name: "Add account" })).toBeTruthy(),
+    );
+    await userEvent.click(screen.getByRole("button", { name: "Add account" }));
+
+    await userEvent.type(screen.getByLabelText(/Display name/), "capped team");
+    await userEvent.type(screen.getByLabelText(/Team Admin API key/), "key_admin");
+    await userEvent.click(
+      screen.getByRole("checkbox", { name: /On-demand usage enabled/ }),
+    );
+    await userEvent.click(screen.getByRole("button", { name: "Create account" }));
+
+    await waitFor(() => expect(upsertAccount).toHaveBeenCalledTimes(1));
+    expect(upsertAccount.mock.calls[0][0].account.onDemandUsageDisabled).toBe(true);
   });
 
   it("bulk-imports keys one per line, keeping failed lines for retry", async () => {
@@ -362,6 +611,53 @@ describe("CursorAccountsConsole", () => {
     await waitFor(() => expect(syncAccount).toHaveBeenCalledWith("acc-1"));
   });
 
+  it("shows pool-utilization columns and the usage-guard badge from server-computed facts", async () => {
+    const guardedView = create(CursorAccountViewSchema, {
+      account: scenarAccount({ onDemandUsageDisabled: true }),
+      snapshot: create(CursorAccountSyncSnapshotSchema, {
+        accountId: "acc-1",
+        syncedAt: timestampFromDate(new Date("2026-07-22T12:00:00Z")),
+      }),
+      keyViews: [
+        create(CursorMemberKeyViewSchema, {
+          key: scenarAccount().memberKeys[0],
+          state: CursorMemberKeyState.member_key_active,
+          usageGuardTripped: true,
+          spend: create(CursorMemberSpendSchema, {
+            email: "zane@scenar.ai",
+            includedSpendUsdMicros: 169342n,
+            apiPercentUsed: 100,
+            autoPercentUsed: 5.19,
+            totalPercentUsed: 26.58,
+          }),
+        }),
+      ],
+    });
+    const client = createMockStigmer({
+      listAccounts: vi.fn().mockResolvedValue({ accounts: [scenarSummary()] }),
+      getAccountView: vi.fn().mockResolvedValue(guardedView),
+    });
+    render(<CursorAccountsConsole />, { wrapper: wrapper(client) });
+
+    await waitFor(() => expect(screen.getByText("scenar team")).toBeTruthy());
+    await userEvent.click(screen.getByRole("button", { name: /scenar team/ }));
+
+    // The four numeric columns map 1:1 onto Cursor's Members page:
+    // first-party pool %, API pool %, included $, on-demand $.
+    await waitFor(() => expect(screen.getByText("100%")).toBeTruthy()); // API
+    expect(screen.getByText("5%")).toBeTruthy(); // first-party (5.19)
+    expect(screen.getByText("$0.17")).toBeTruthy(); // included, 169342 micro-USD
+    expect(screen.getByText("$0.00")).toBeTruthy(); // on-demand, none
+    // The blended totalPercentUsed (26.58) is deliberately not rendered —
+    // it maps to nothing on Cursor's dashboard and reads a flat 100 for
+    // removed members.
+    expect(screen.queryByText("27%")).toBeNull();
+    // The badge renders the server's flag — no client-side threshold math.
+    expect(screen.getByText("Usage guard")).toBeTruthy();
+    // The header carries the declaration driving the guard.
+    expect(screen.getByText(/on-demand usage off \(usage guard active\)/)).toBeTruthy();
+  });
+
   it("keeps the stored admin key when the editor's masked value is untouched", async () => {
     const upsertAccount = vi.fn().mockResolvedValue(scenarAccount());
     const client = createMockStigmer({