@opengeni/react 4.6.1 → 4.6.2-canary.39853438886001

package/src/app/lib/actions/actions.test.ts

@@ -9,7 +9,13 @@ import {
   type Chord,
 } from "./chords";
 import type { ChatRecord } from "./chat-directory";
-import { isSwitcherKey, openChatSwitcher, stepChatSwitcher, SWITCHER_LIMIT } from "./chat-switcher";
+import {
+  extendChatSwitcher,
+  isSwitcherKey,
+  openChatSwitcher,
+  stepChatSwitcher,
+  SWITCHER_LIMIT,
+} from "./chat-switcher";
 import { LOOSE_MATCH_BELOW, rankLabel, rankWithKeywords } from "./rank";
 import { appActions, stepWorkspace } from "./registry";
 
@@ -296,9 +302,58 @@ describe("chat switcher", () => {
     expect(state.ids[state.index]).toBe("b");
   });
 
-  test("the list stops at ten chats", () => {
-    const ids = Array.from({ length: 15 }, (_, index) => `c${index}`);
-    expect(openChatSwitcher(directory(ids), "c0", false)!.ids).toHaveLength(SWITCHER_LIMIT);
+  test("past the opened chats it carries on through other chats by latest activity", () => {
+    const rows = [
+      record("a", { updatedAt: 1 }),
+      record("b", { updatedAt: 2 }),
+      record("older", { updatedAt: 5 }),
+      record("newer", { updatedAt: 9, workspaceId: "other" }),
+      record("gone", { updatedAt: 8, archived: true }),
+      record("child", { updatedAt: 7, row: { parentSessionId: "a" } as ChatRecord["row"] }),
+    ];
+    const state = openChatSwitcher(directory(["a", "b"], rows), "a", false)!;
+    expect(state.ids).toEqual(["a", "b", "newer", "older"]);
+    expect(state.viewed).toBe(2);
+    // Tab keeps going into the older chats before it wraps.
+    let stepped = stepChatSwitcher(state, 1);
+    stepped = stepChatSwitcher(stepped, 1);
+    expect(stepped.ids[stepped.index]).toBe("older");
+  });
+
+  test("with no opened chats yet, the most recently active chat is the target", () => {
+    const rows = [record("a", { updatedAt: 1 }), record("b", { updatedAt: 2 })];
+    const state = openChatSwitcher(directory([], rows), null, false)!;
+    expect(state.ids).toEqual(["b", "a"]);
+    expect(state.viewed).toBe(0);
+    expect(state.ids[state.index]).toBe("b");
+  });
+
+  test("chats that load while it is open join at the end, and nothing else moves", () => {
+    const start = directory(["a", "b"], [record("a"), record("b"), record("c", { updatedAt: 3 })]);
+    const state = stepChatSwitcher(openChatSwitcher(start, "a", false)!, 1);
+    expect(extendChatSwitcher(state, start)).toBe(state);
+    const later = directory(
+      ["a", "b"],
+      [record("a"), record("b"), record("c", { updatedAt: 3 }), record("d", { updatedAt: 9 })],
+    );
+    const grown = extendChatSwitcher(state, later);
+    expect(grown.ids).toEqual(["a", "b", "c", "d"]);
+    expect(grown.index).toBe(state.index);
+    expect(grown.viewed).toBe(2);
+  });
+
+  test("the list stops at its limit", () => {
+    const ids = Array.from({ length: SWITCHER_LIMIT + 20 }, (_, index) => `c${index}`);
+    const rows = Array.from({ length: 30 }, (_, index) =>
+      record(`x${index}`, { updatedAt: index }),
+    );
+    const state = openChatSwitcher(
+      directory(ids, [...ids.map((id) => record(id)), ...rows]),
+      "c0",
+      false,
+    )!;
+    expect(state.ids).toHaveLength(SWITCHER_LIMIT);
+    expect(extendChatSwitcher(state, directory(ids, rows))).toBe(state);
   });
 
   test("only Control+Tab opens it", () => {

package/src/app/lib/actions/chat-switcher.ts

@@ -5,50 +5,103 @@
  * chat (press again to return); holding Control shows the list, each Tab moves
  * down it (Shift+Tab up), and releasing Control opens the highlighted chat.
  *
- * The list is read once when the switcher opens, so it holds still while the
- * person cycles through it.
+ * Past the chats someone opened, the list carries on through the other chats
+ * the app knows, most recently active first, so holding Tab keeps going back
+ * in time. The list is read when the switcher opens and only ever grows at
+ * the end (as more chats load), so it holds still while the person cycles.
  */
-import type { ChatDirectorySnapshot } from "./chat-directory";
+import type { ChatDirectorySnapshot, ChatRecord } from "./chat-directory";
 
 /** At most this many chats; older ones are a search away in ⌘K. */
-export const SWITCHER_LIMIT = 10;
+export const SWITCHER_LIMIT = 100;
 /** A press shorter than this switches without ever drawing the list. */
 export const SWITCHER_SHOW_DELAY_MS = 140;
 
 export type ChatSwitcherState = Readonly<{
-  /** Chats in the order shown, most recently viewed first. */
+  /** Chats in the order shown: recently viewed first, then recently active. */
   ids: readonly string[];
+  /** How many of `ids`, from the front, are chats the person opened recently. */
+  viewed: number;
   /** The highlighted chat. */
   index: number;
   /** Whether the list is drawn (after the delay, or once Tab is pressed again). */
   visible: boolean;
 }>;
 
+type SwitcherDirectory = Pick<ChatDirectorySnapshot, "recent" | "rows">;
+
+function switchable(
+  record: ChatRecord | undefined,
+  reachable: (workspaceId: string) => boolean,
+): boolean {
+  if (!record || record.archived || !reachable(record.workspaceId)) return false;
+  // Subagent chats live under their parent, as in the sidebar.
+  return !record.row || record.row.parentSessionId === null;
+}
+
+/** Known chats not in `taken`, most recently active first. */
+function moreChats(
+  directory: SwitcherDirectory,
+  taken: ReadonlySet<string>,
+  reachable: (workspaceId: string) => boolean,
+  room: number,
+): string[] {
+  if (room <= 0) return [];
+  const more: ChatRecord[] = [];
+  for (const record of directory.rows.values()) {
+    if (!taken.has(record.id) && switchable(record, reachable)) more.push(record);
+  }
+  more.sort((a, b) => b.updatedAt - a.updatedAt || (a.id < b.id ? -1 : 1));
+  return more.slice(0, room).map((record) => record.id);
+}
+
 /**
- * The chats to switch between, most recently viewed first, with the open chat
- * (when there is one) at the front. Null when there is nowhere to switch to.
+ * The chats to switch between: the open chat (when there is one), the other
+ * recently viewed chats, then the rest the app knows by latest activity.
+ * Null when there is nowhere to switch to.
  */
 export function openChatSwitcher(
-  directory: Pick<ChatDirectorySnapshot, "recent" | "rows">,
+  directory: SwitcherDirectory,
   currentChatId: string | null,
   backwards: boolean,
   /** Whether a workspace is still open to the person; chats elsewhere are left out. */
   reachable: (workspaceId: string) => boolean = () => true,
 ): ChatSwitcherState | null {
-  const switchable = directory.recent.filter((id) => {
-    const record = directory.rows.get(id);
-    if (!record || record.archived || !reachable(record.workspaceId)) return false;
-    // Subagent chats live under their parent, as in the sidebar.
-    return !record.row || record.row.parentSessionId === null;
-  });
-  const ids = currentChatId
-    ? [currentChatId, ...switchable.filter((id) => id !== currentChatId)]
-    : switchable;
-  const limited = ids.slice(0, SWITCHER_LIMIT);
+  const recent = directory.recent.filter(
+    (id) => id !== currentChatId && switchable(directory.rows.get(id), reachable),
+  );
+  const viewed = (currentChatId ? [currentChatId, ...recent] : recent).slice(0, SWITCHER_LIMIT);
+  const ids = [
+    ...viewed,
+    ...moreChats(directory, new Set(viewed), reachable, SWITCHER_LIMIT - viewed.length),
+  ];
   // Away from a chat (the inbox, a new chat) the most recent chat is the target.
   const first = currentChatId ? 1 : 0;
-  if (limited.length <= first) return null;
-  return { ids: limited, index: backwards ? limited.length - 1 : first, visible: false };
+  if (ids.length <= first) return null;
+  return {
+    ids,
+    viewed: viewed.length,
+    index: backwards ? ids.length - 1 : first,
+    visible: false,
+  };
+}
+
+/**
+ * Chats that loaded while the list is open join at its end, so nothing the
+ * person is looking at moves. The same state when there is nothing new.
+ */
+export function extendChatSwitcher(
+  state: ChatSwitcherState,
+  directory: SwitcherDirectory,
+  reachable: (workspaceId: string) => boolean = () => true,
+): ChatSwitcherState {
+  const more = moreChats(
+    directory,
+    new Set(state.ids),
+    reachable,
+    SWITCHER_LIMIT - state.ids.length,
+  );
+  return more.length === 0 ? state : { ...state, ids: [...state.ids, ...more] };
 }
 
 /** Tab moves down the list and Shift+Tab up, wrapping at the ends. */

package/src/app/lib/drive-connect-return.test.ts

@@ -0,0 +1,183 @@
+import { expect, mock, test } from "bun:test";
+import type { OpenGeniBrowserClient } from "@opengeni/sdk/browser";
+import {
+  beginDriveConnect,
+  resolveDriveConnectReturn,
+  completeDriveConnectReturn,
+} from "./drive-connect-return";
+
+function fixture() {
+  const values = new Map<string, string>();
+  const storage = {
+    getItem: (key: string) => values.get(key) ?? null,
+    setItem: (key: string, value: string) => {
+      values.set(key, value);
+    },
+    removeItem: (key: string) => {
+      values.delete(key);
+    },
+  };
+  let outcome = {
+    id: "attempt",
+    providerId: "google-drive",
+    ownership: "personal",
+    state: "complete",
+    credentialsCommitted: true,
+    account: { id: "exact-account", providerId: "google-drive", ownership: "personal" },
+  } as Record<string, unknown>;
+  const beginConnect = mock(async () => ({
+    id: "attempt",
+    revision: 1,
+    state: "credential_input",
+  }));
+  const advanceConnectAttempt = mock(async () => ({
+    id: "attempt",
+    nextAction: { type: "authorize", url: "https://accounts.google.com/consent" },
+  }));
+  const getConnectAttempt = mock(async () => outcome);
+  const client = {
+    beginConnect,
+    connectTransport: () => ({ advance: advanceConnectAttempt, get: getConnectAttempt }),
+  } as unknown as OpenGeniBrowserClient;
+  return {
+    storage,
+    values,
+    client,
+    beginConnect,
+    advanceConnectAttempt,
+    getConnectAttempt,
+    setOutcome: (value: Record<string, unknown>) => {
+      outcome = value;
+    },
+  };
+}
+
+test("Drive return reads the exact durable account, scoped to its original workspace and return nonce", async () => {
+  const f = fixture();
+  expect(
+    await beginDriveConnect({
+      client: f.client,
+      workspaceId: "display",
+      connectionWorkspaceId: "owner",
+      itemId: "drive",
+      reconnectAccountId: "existing",
+      returnUrl: "https://app.example/settings?connect_item=drive",
+      storage: f.storage,
+    }),
+  ).toBe("https://accounts.google.com/consent");
+  expect(f.beginConnect).toHaveBeenCalledWith(
+    "owner",
+    expect.objectContaining({
+      providerId: "google-drive",
+      ownership: "personal",
+      reconnectAccountId: "existing",
+    }),
+  );
+  expect(f.advanceConnectAttempt).toHaveBeenCalledWith(
+    "owner",
+    "attempt",
+    expect.objectContaining({ expectedRevision: 1, action: { type: "credentials", values: {} } }),
+  );
+  const receipt = JSON.parse([...f.values.values()][0]!);
+  await expect(
+    resolveDriveConnectReturn({
+      client: f.client,
+      workspaceId: "display",
+      nonce: "wrong",
+      storage: f.storage,
+    }),
+  ).rejects.toThrow("could not be matched");
+  expect(f.getConnectAttempt).not.toHaveBeenCalled();
+  await expect(
+    resolveDriveConnectReturn({
+      client: f.client,
+      workspaceId: "other",
+      nonce: receipt.nonce,
+      storage: f.storage,
+    }),
+  ).rejects.toThrow("could not be matched");
+  expect(
+    await resolveDriveConnectReturn({
+      client: f.client,
+      workspaceId: "display",
+      nonce: receipt.nonce,
+      storage: f.storage,
+    }),
+  ).toEqual({ itemId: "drive", connectionId: "exact-account" });
+  expect(f.getConnectAttempt).toHaveBeenCalledWith("owner", "attempt");
+  // StrictMode/effect cleanup can discard the first reader. The locator remains
+  // until its active consumer confirms the connector was enabled.
+  expect(
+    await resolveDriveConnectReturn({
+      client: f.client,
+      workspaceId: "display",
+      nonce: receipt.nonce,
+      storage: f.storage,
+    }),
+  ).toEqual({ itemId: "drive", connectionId: "exact-account" });
+  completeDriveConnectReturn("display", "different-return", f.storage);
+  expect(f.values.size).toBe(1);
+  completeDriveConnectReturn("display", receipt.nonce, f.storage);
+  expect(f.values.size).toBe(0);
+});
+
+test("failed or incomplete Drive returns never produce an account to auto-enable", async () => {
+  for (const state of ["failed", "requires_user_action", "complete"]) {
+    const f = fixture();
+    await beginDriveConnect({
+      client: f.client,
+      workspaceId: "workspace",
+      itemId: "drive",
+      returnUrl: "https://app.example/settings",
+      storage: f.storage,
+    });
+    const receipt = JSON.parse([...f.values.values()][0]!);
+    f.setOutcome({
+      id: "attempt",
+      providerId: "google-drive",
+      ownership: "personal",
+      state,
+      credentialsCommitted: false,
+      error: { message: "Provider rejected access" },
+    });
+    await expect(
+      resolveDriveConnectReturn({
+        client: f.client,
+        workspaceId: "workspace",
+        nonce: receipt.nonce,
+        storage: f.storage,
+      }),
+    ).rejects.toThrow();
+    expect(f.values.size).toBe(state === "failed" ? 0 : 1);
+  }
+});
+
+test("a different provider or ownership cannot satisfy a saved Drive return", async () => {
+  for (const patch of [{ providerId: "mcp-oauth" }, { ownership: "workspace" }]) {
+    const f = fixture();
+    await beginDriveConnect({
+      client: f.client,
+      workspaceId: "workspace",
+      itemId: "drive",
+      returnUrl: "https://app.example/settings",
+      storage: f.storage,
+    });
+    const receipt = JSON.parse([...f.values.values()][0]!);
+    f.setOutcome({
+      id: "attempt",
+      providerId: "google-drive",
+      ownership: "personal",
+      state: "complete",
+      credentialsCommitted: true,
+      ...patch,
+    });
+    await expect(
+      resolveDriveConnectReturn({
+        client: f.client,
+        workspaceId: "workspace",
+        nonce: receipt.nonce,
+        storage: f.storage,
+      }),
+    ).rejects.toThrow("account changed");
+  }
+});

package/src/app/lib/drive-connect-return.tsx

@@ -0,0 +1,116 @@
+import type { OpenGeniBrowserClient } from "@opengeni/sdk/browser";
+
+export const DRIVE_MCP_URL = "https://drivemcp.googleapis.com/mcp/v1";
+export const DRIVE_CONNECT_RETURN_PARAM = "drive_connect_return";
+const storageKey = (workspaceId: string) => `opengeni.drive-connect.v1:${workspaceId}`;
+type Receipt = { nonce: string; attemptId: string; connectionWorkspaceId: string; itemId: string };
+type Storage = Pick<globalThis.Storage, "getItem" | "setItem" | "removeItem">;
+
+/** Browser state is only a locator. Completion and the account come from Connect. */
+export async function beginDriveConnect(input: {
+  client: Pick<OpenGeniBrowserClient, "beginConnect" | "connectTransport">;
+  workspaceId: string;
+  connectionWorkspaceId?: string;
+  itemId: string;
+  reconnectAccountId?: string;
+  returnUrl: string;
+  storage: Storage;
+}): Promise<string> {
+  const nonce = crypto.randomUUID();
+  const returnUrl = new URL(input.returnUrl);
+  returnUrl.searchParams.set(DRIVE_CONNECT_RETURN_PARAM, nonce);
+  const connectionWorkspaceId = input.connectionWorkspaceId ?? input.workspaceId;
+  const created = await input.client.beginConnect(connectionWorkspaceId, {
+    providerId: "google-drive",
+    ownership: "personal",
+    returnUrl: returnUrl.toString(),
+    idempotencyKey: crypto.randomUUID(),
+    ...(input.reconnectAccountId ? { reconnectAccountId: input.reconnectAccountId } : {}),
+  });
+  if (created.state !== "credential_input")
+    throw new Error("Google Drive setup did not start. Try again.");
+  const attempt = await input.client.connectTransport().advance(connectionWorkspaceId, created.id, {
+    expectedRevision: created.revision,
+    idempotencyKey: crypto.randomUUID(),
+    action: { type: "credentials", values: {} },
+  });
+  if (attempt.nextAction.type !== "authorize")
+    throw new Error(attempt.error?.message ?? "Google Drive did not return an authorization link.");
+  input.storage.setItem(
+    storageKey(input.workspaceId),
+    JSON.stringify({
+      nonce,
+      attemptId: attempt.id,
+      connectionWorkspaceId,
+      itemId: input.itemId,
+    } satisfies Receipt),
+  );
+  return attempt.nextAction.url;
+}
+
+export async function resolveDriveConnectReturn(input: {
+  client: Pick<OpenGeniBrowserClient, "connectTransport">;
+  workspaceId: string;
+  nonce: string;
+  storage: Storage;
+}): Promise<{ itemId: string; connectionId: string }> {
+  const key = storageKey(input.workspaceId);
+  const raw = input.storage.getItem(key);
+  let receipt: Receipt;
+  try {
+    receipt = JSON.parse(raw ?? "null");
+    if (
+      !receipt ||
+      receipt.nonce !== input.nonce ||
+      ![receipt.attemptId, receipt.connectionWorkspaceId, receipt.itemId].every(
+        (value) => typeof value === "string" && value.length > 0 && value.length <= 4096,
+      )
+    )
+      throw new Error();
+  } catch {
+    throw new Error(
+      "The Google Drive setup return could not be matched. Open Drive to check your connection.",
+    );
+  }
+  const attempt = await input.client
+    .connectTransport()
+    .get(receipt.connectionWorkspaceId, receipt.attemptId);
+  if (
+    attempt.id !== receipt.attemptId ||
+    attempt.providerId !== "google-drive" ||
+    attempt.ownership !== "personal"
+  ) {
+    throw new Error("The Google Drive setup account changed. Open Drive to try again.");
+  }
+  if (["failed", "expired", "cancelled"].includes(attempt.state)) {
+    input.storage.removeItem(key);
+    throw new Error(
+      attempt.error?.message ??
+        "Google Drive connection was not completed. Open Drive to try again.",
+    );
+  }
+  if (
+    attempt.state !== "complete" ||
+    !attempt.credentialsCommitted ||
+    attempt.account?.providerId !== "google-drive" ||
+    attempt.account.ownership !== "personal" ||
+    !attempt.account.id
+  ) {
+    throw new Error("Google Drive setup is still incomplete. Reload to check it again.");
+  }
+  return { itemId: receipt.itemId, connectionId: attempt.account.id };
+}
+
+/** Clear only after the UI has finished enabling; never consume a newer attempt. */
+export function completeDriveConnectReturn(
+  workspaceId: string,
+  nonce: string,
+  storage: Storage,
+): void {
+  const key = storageKey(workspaceId);
+  try {
+    if (JSON.parse(storage.getItem(key) ?? "null")?.nonce === nonce) storage.removeItem(key);
+  } catch {
+    /* An absent or replaced browser locator grants no authority. */
+  }
+}

package/src/app/routes/session.tsx

@@ -57,6 +57,7 @@ import {
 // composer. Enter queues and Cmd/Ctrl+Enter steers; failed sessions stay
 // honest (reason + retry history) and revivable from the same composer.
 import { LightboxProvider } from "../../timeline";
+import { connectorLogo, connectorLogoIndex } from "../../timeline/connector-logo-index";
 import { sessionAdmissionBlocked, sessionDisplayStatus } from "../../session-status-model";
 import { useSessionSecrets } from "../../hooks/use-vaults";
 import type { WorkspaceTab } from "../../components/workspace-dock";
@@ -182,7 +183,6 @@ import type {
   SessionEditableArtifactsStatus,
 } from "../components/session/editable-artifacts-workspace";
 import {
-  normalizeProviderDomain,
   oauthConnectionOwnership,
   oauthConnectionRef,
   catalogConnectionAccountSelection,
@@ -1159,20 +1159,15 @@ export function SessionRoute({
   // The workspace shell already needs the capability catalog for session tool
   // policy. Reuse that authoritative read for timeline logos instead of
   // downloading the same large catalog again from the session route.
-  const providerLogos = useMemo(() => {
-    const logos = new Map<string, string>();
-    for (const capability of context.workspaceCapabilityCatalog) {
-      const domain = capability.providerDomain ?? capability.connectionRef?.providerDomain ?? null;
-      const url = context.client.catalogAssetUrl(capability.logoAssetPath);
-      if (domain && url) {
-        const key = normalizeProviderDomain(domain);
-        if (!logos.has(key)) logos.set(key, url);
-      }
-    }
-    return logos;
-  }, [context.client, context.workspaceCapabilityCatalog]);
+  const providerLogos = useMemo(
+    () =>
+      connectorLogoIndex(context.workspaceCapabilityCatalog, (path) =>
+        context.client.catalogAssetUrl(path ?? null),
+      ),
+    [context.client, context.workspaceCapabilityCatalog],
+  );
   const resolveProviderLogo = useCallback(
-    (domain: string) => providerLogos.get(normalizeProviderDomain(domain)) ?? null,
+    (domain: string) => connectorLogo(providerLogos, domain),
     [providerLogos],
   );
   // One lineage read feeds the single composer-anchored agents surface. Events
@@ -4027,6 +4022,9 @@ function SessionChatPane(props: {
                       sessionKey={props.session.id}
                       menuSide="top"
                       connectModelsHref={`/workspaces/${encodeURIComponent(props.session.workspaceId)}/settings?section=models`}
+                      claudeSubscriptionAvailable={
+                        context.clientConfig.claudeSubscriptionEnabled === true
+                      }
                       codexOnly={props.session.codexCompactionMode === "remote_v2"}
                       onModelChange={composer.setModel}
                       onEffortChange={composer.setReasoningEffort}

package/src/app/routes/sessions-index.tsx

@@ -2228,6 +2228,7 @@ function SessionModelControl({
       error={modelCatalog.error ?? policyError}
       menuSide="bottom"
       connectModelsHref={`/workspaces/${encodeURIComponent(workspaceId)}/settings?section=models`}
+      claudeSubscriptionAvailable={context.clientConfig.claudeSubscriptionEnabled === true}
       onModelChange={(model) => {
         onPolicyChosen();
         context.setModel(model);

package/src/components/model-policy-picker-menu.tsx

@@ -181,7 +181,11 @@ export function ModelPolicyPickerMenu(props: ModelPolicyPickerProps) {
             ) : null}
           </>
         ) : props.connectModelsHref || rows.length > 0 ? (
-          <ConnectModelsPanel href={props.connectModelsHref} messages={messages} />
+          <ConnectModelsPanel
+            href={props.connectModelsHref}
+            claude={props.claudeSubscriptionAvailable === true}
+            messages={messages}
+          />
         ) : (
           <p className={MENU_NOTE_CLASS}>{messages.noModels}</p>
         )}
@@ -204,8 +208,14 @@ export function ModelPolicyPickerMenu(props: ModelPolicyPickerProps) {
 
 const CONNECT_MODEL_OPTIONS = (
   t: OpenGeniText,
+  claude: boolean,
 ): Array<{
-  billingClass: "codex_subscription" | "supergrok_subscription" | "byok" | "external";
+  billingClass:
+    | "codex_subscription"
+    | "claude_subscription"
+    | "supergrok_subscription"
+    | "byok"
+    | "external";
   title: string;
   detail: string;
 }> => [
@@ -214,6 +224,15 @@ const CONNECT_MODEL_OPTIONS = (
     title: t("modelPolicyPickerMenu.codex"),
     detail: "ChatGPT",
   },
+  ...(claude
+    ? [
+        {
+          billingClass: "claude_subscription" as const,
+          title: t("modelPolicyPicker.claude"),
+          detail: "Anthropic",
+        },
+      ]
+    : []),
   { billingClass: "supergrok_subscription", title: "SuperGrok", detail: "xAI" },
   {
     billingClass: "byok",
@@ -225,6 +244,7 @@ const CONNECT_MODEL_OPTIONS = (
 
 function ConnectModelsPanel(props: {
   href: string | undefined;
+  claude: boolean;
   messages: ReturnType<typeof defaultModelPolicyPickerMessages>;
 }) {
   const t = useOpenGeniText();
@@ -239,7 +259,7 @@ function ConnectModelsPanel(props: {
         </p>
       </div>
       <div className="grid grid-cols-2 gap-1">
-        {CONNECT_MODEL_OPTIONS(t).map((option) => {
+        {CONNECT_MODEL_OPTIONS(t, props.claude).map((option) => {
           const content = (
             <>
               <span className="flex size-8 shrink-0 items-center justify-center rounded-og-md bg-og-surface-2 text-og-fg">
@@ -260,7 +280,8 @@ function ConnectModelsPanel(props: {
             </>
           );
           const className =
-            "flex min-w-0 items-center gap-2 rounded-og-md px-1.5 py-1.5 outline-hidden transition-colors hover:bg-og-hover focus-visible:ring-2 focus-visible:ring-og-accent/40";
+            // An odd last tile spans both columns instead of sitting alone.
+            "flex min-w-0 items-center gap-2 rounded-og-md px-1.5 py-1.5 outline-hidden transition-colors odd:last:col-span-2 hover:bg-og-hover focus-visible:ring-2 focus-visible:ring-og-accent/40";
           return props.href ? (
             <a key={option.title} href={props.href} className={className}>
               {content}

package/src/components/model-policy-picker.tsx

@@ -96,6 +96,8 @@ export type ModelPolicyPickerProps = {
   allowModelOptions?: boolean | undefined;
   /** Settings → Models. Shown when the catalog has no model that can run. */
   connectModelsHref?: string | undefined;
+  /** The deployment offers Claude subscriptions; the connect panel lists Claude too. */
+  claudeSubscriptionAvailable?: boolean | undefined;
   /** Classes for the portalled menu surface. Prefer --og-* tokens for theming. */
   contentClassName?: string | undefined;
   /** Inline styles for the portalled menu, applied after inherited --og-* tokens. */