@agent-native/core 0.167.4 → 0.168.1

package/dist/client/agent-page/AgentTabsPage.d.ts

@@ -3,7 +3,10 @@ import type { ResourceView } from "../resources/ResourcesPanel.js";
 import type { SettingsTabItem } from "../settings/SettingsTabsPage.js";
 import type { AgentPageTabProps } from "./types.js";
 export declare const AGENT_RESOURCE_DOCS_HREF: Record<ResourceView, string>;
-export declare function ConnectionsTab({ canManageOrg, }?: Partial<AgentPageTabProps>): import("react").JSX.Element;
+export declare function ConnectionsTab({ canManageOrg, onOAuthStart, oauthReturnPath, }?: Partial<AgentPageTabProps> & {
+    onOAuthStart?: (url: string) => void | Promise<void>;
+    oauthReturnPath?: string;
+}): import("react").JSX.Element;
 export declare const AGENT_ACCESS_DOCS_HREF: {
     readonly mcp: string;
     readonly a2a: string;

package/dist/client/agent-page/AgentTabsPage.js

@@ -117,7 +117,7 @@ function ServerStatus({ server }) {
     }
     return (_jsx("span", { className: "text-[11px] text-muted-foreground", children: "Status unknown" }));
 }
-export function ConnectionsTab({ canManageOrg, } = {}) {
+export function ConnectionsTab({ canManageOrg, onOAuthStart, oauthReturnPath, } = {}) {
     const t = useT();
     const serversQuery = useMcpServers();
     const createServer = useCreateMcpServer();
@@ -181,7 +181,7 @@ export function ConnectionsTab({ canManageOrg, } = {}) {
                                     ? "No personal agent integrations yet"
                                     : "No workspace-shared agent integrations yet", description: section.scope === "user"
                                     ? "Connect a service to give the agent access to it."
-                                    : "Agent integrations shared with this workspace will appear here." }))] }, section.scope))) })), _jsx(McpIntegrationDialog, { open: dialogOpen, onOpenChange: setDialogOpen, defaultScope: "user", canCreateOrgMcp: canCreateOrgMcp, hasOrg: hasOrg, onCreateMcpServer: onCreateMcpServer })] }) }));
+                                    : "Agent integrations shared with this workspace will appear here." }))] }, section.scope))) })), _jsx(McpIntegrationDialog, { open: dialogOpen, onOpenChange: setDialogOpen, defaultScope: "user", canCreateOrgMcp: canCreateOrgMcp, hasOrg: hasOrg, onCreateMcpServer: onCreateMcpServer, onOAuthStart: onOAuthStart, oauthReturnPath: oauthReturnPath })] }) }));
 }
 export const AGENT_ACCESS_DOCS_HREF = {
     mcp: docsUrl("mcp-protocol"),

package/dist/client/integrations/IntegrationConnectionChoice.d.ts

@@ -3,9 +3,12 @@ export interface IntegrationConnectionChoiceProps {
     name: string;
     logo?: ReactNode;
     showWorkspaceOption: boolean;
+    workspaceOptionDisabled?: boolean;
+    workspaceOptionDisabledReason?: string;
+    personalOnlyReason?: string;
     busy?: boolean;
     onPersonal: () => void;
     onWorkspace: () => void;
 }
 /** The one small decision before an integration's advanced setup surface. */
-export declare function IntegrationConnectionChoice({ name, logo, showWorkspaceOption, busy, onPersonal, onWorkspace, }: IntegrationConnectionChoiceProps): import("react").JSX.Element;
+export declare function IntegrationConnectionChoice({ name, logo, showWorkspaceOption, workspaceOptionDisabled, workspaceOptionDisabledReason, personalOnlyReason, busy, onPersonal, onWorkspace, }: IntegrationConnectionChoiceProps): import("react").JSX.Element;

package/dist/client/integrations/IntegrationConnectionChoice.js

@@ -1,6 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { IconLoader2, IconUser, IconUsersGroup } from "@tabler/icons-react";
+import { useT } from "../i18n.js";
 /** The one small decision before an integration's advanced setup surface. */
-export function IntegrationConnectionChoice({ name, logo, showWorkspaceOption, busy = false, onPersonal, onWorkspace, }) {
-    return (_jsxs("div", { className: "flex min-h-full flex-1 flex-col bg-background", children: [_jsx("header", { className: "flex min-h-16 items-center border-b border-border px-6 sm:px-10", children: _jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [logo ? (_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-md bg-muted/50 text-foreground", children: logo })) : null, _jsxs("span", { className: "truncate text-sm font-medium text-foreground", children: ["Connect ", name] })] }) }), _jsx("main", { className: "flex flex-1 justify-center overflow-y-auto px-6 py-12 sm:px-10 sm:py-[12vh]", children: _jsxs("div", { className: "w-full max-w-[420px] self-start", children: [_jsx("h1", { className: "text-2xl font-semibold tracking-[-0.03em] text-foreground sm:text-[28px]", children: "Who should use this?" }), _jsx("p", { className: "mt-2 text-sm leading-6 text-muted-foreground", children: "Choose where this connection is available." }), _jsxs("div", { className: "mt-8 grid gap-2.5", children: [_jsxs("button", { type: "button", onClick: onPersonal, disabled: busy, "aria-busy": busy, className: "flex min-h-12 items-center gap-3 rounded-lg bg-primary px-4 py-3 text-left text-primary-foreground transition-[background-color,opacity] hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-wait disabled:opacity-60", children: [_jsx(IconUser, { className: "size-4 shrink-0 opacity-75" }), _jsx("span", { className: "min-w-0 flex-1 text-sm font-medium", children: "Connect for me" }), busy ? (_jsx(IconLoader2, { className: "size-4 shrink-0 animate-spin" })) : null] }), showWorkspaceOption ? (_jsxs("button", { type: "button", onClick: onWorkspace, disabled: busy, className: "flex min-h-12 items-center gap-3 rounded-lg bg-muted/50 px-4 py-3 text-left text-foreground transition-colors hover:bg-muted/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-wait disabled:opacity-60", children: [_jsx(IconUsersGroup, { className: "size-4 shrink-0 text-muted-foreground" }), _jsx("span", { className: "min-w-0 flex-1 text-sm font-medium", children: "Set up for workspace" })] })) : null] })] }) })] }));
+export function IntegrationConnectionChoice({ name, logo, showWorkspaceOption, workspaceOptionDisabled = false, workspaceOptionDisabledReason, personalOnlyReason, busy = false, onPersonal, onWorkspace, }) {
+    const t = useT();
+    return (_jsxs("div", { className: "flex min-h-full flex-1 flex-col bg-background", children: [_jsx("header", { className: "flex min-h-16 items-center border-b border-border px-6 sm:px-10", children: _jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [logo ? (_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-md bg-muted/50 text-foreground", children: logo })) : null, _jsxs("span", { className: "truncate text-sm font-medium text-foreground", children: [t("mcpIntegrations.connect"), " ", name] })] }) }), _jsx("main", { className: "flex flex-1 justify-center overflow-y-auto px-6 py-12 sm:px-10 sm:py-[12vh]", children: _jsxs("div", { className: "w-full max-w-[420px] self-start", children: [_jsx("h1", { className: "text-2xl font-semibold tracking-[-0.03em] text-foreground sm:text-[28px]", children: t("mcpIntegrations.scopeChoiceTitle") }), _jsx("p", { className: "mt-2 text-sm leading-6 text-muted-foreground", children: t("mcpIntegrations.scopeChoiceDescription") }), _jsxs("div", { className: "mt-8 grid gap-2.5", children: [_jsxs("button", { type: "button", onClick: onPersonal, disabled: busy, "aria-busy": busy, className: "flex min-h-12 items-center gap-3 rounded-lg bg-primary px-4 py-3 text-left text-primary-foreground transition-[background-color,opacity] hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-wait disabled:opacity-60", children: [_jsx(IconUser, { className: "size-4 shrink-0 opacity-75" }), _jsx("span", { className: "min-w-0 flex-1 text-sm font-medium", children: t("mcpIntegrations.connectForMe") }), busy ? (_jsx(IconLoader2, { className: "size-4 shrink-0 animate-spin" })) : null] }), showWorkspaceOption ? (_jsxs("button", { type: "button", onClick: onWorkspace, disabled: busy || workspaceOptionDisabled, "aria-describedby": workspaceOptionDisabledReason
+                                        ? "integration-workspace-scope-restriction"
+                                        : undefined, className: "flex min-h-12 items-center gap-3 rounded-lg bg-muted/50 px-4 py-3 text-left text-foreground transition-colors hover:bg-muted/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-60", children: [_jsx(IconUsersGroup, { className: "size-4 shrink-0 text-muted-foreground" }), _jsx("span", { className: "min-w-0 flex-1 text-sm font-medium", children: t("mcpIntegrations.setUpForWorkspace") }), workspaceOptionDisabledReason ? (_jsx("span", { id: "integration-workspace-scope-restriction", className: "shrink-0 text-[11px] font-normal text-muted-foreground", children: workspaceOptionDisabledReason })) : null] })) : null] }), personalOnlyReason ? (_jsx("p", { className: "mt-3 text-[11px] leading-relaxed text-muted-foreground", children: personalOnlyReason })) : null] }) })] }));
 }

package/dist/client/onboarding/FirstRunOnboarding.js

@@ -6,10 +6,10 @@ import { docsUrl } from "../../shared/docs-url.js";
 import { appPath } from "../api-path.js";
 import { Tooltip, TooltipContent, TooltipTrigger, } from "../components/ui/tooltip.js";
 import { IntegrationGrid } from "../integrations/IntegrationGrid.js";
-import { buildMcpOAuthStartUrl, filterMcpIntegrations, getDefaultMcpIntegrations, navigateToMcpOAuthStart, shouldOfferMcpIntegrationOrganizationScope, } from "../resources/mcp-integration-catalog.js";
+import { buildMcpOAuthStartUrl, filterMcpIntegrations, getDefaultMcpIntegrations, navigateToMcpOAuthStart, } from "../resources/mcp-integration-catalog.js";
 import { McpIntegrationDialog } from "../resources/McpIntegrationDialog.js";
 import { McpIntegrationLogo } from "../resources/McpIntegrationLogo.js";
-import { formatMcpServerError, useCreateMcpServer, useMcpServers, } from "../resources/use-mcp-servers.js";
+import { formatMcpServerError, formatMcpServersLoadError, useCreateMcpServer, useMcpServers, } from "../resources/use-mcp-servers.js";
 import { useBuilderConnectFlow } from "../settings/useBuilderStatus.js";
 import { cn } from "../utils.js";
 import { shouldSkipFirstRunIntegrations } from "./first-run-enabled.js";
@@ -122,7 +122,9 @@ export function FirstRunOnboarding({ skipIntegrations = shouldSkipFirstRunIntegr
             connectingIntegrationId === integration.id) {
             return;
         }
-        if (shouldOfferMcpIntegrationOrganizationScope(integration, hasOrg, canCreateOrgMcp)) {
+        if (!mcpServersQuery.isSuccess)
+            return;
+        if (hasOrg) {
             setIntegrationDialogId(integration.id);
             return;
         }
@@ -190,7 +192,7 @@ export function FirstRunOnboarding({ skipIntegrations = shouldSkipFirstRunIntegr
         return (_jsx(OnboardingShell, { profile: profile, screen: "choice", children: _jsxs("div", { className: "mx-auto flex w-full max-w-xl flex-col gap-4", children: [_jsxs("div", { children: [_jsx("button", { type: "button", className: "mb-4 text-xs text-muted-foreground hover:text-foreground", onClick: () => setScreen("choice"), children: "Back" }), _jsx("h1", { className: "text-xl font-semibold tracking-[-0.04em] sm:text-2xl", children: "Your keys" })] }), _jsxs("div", { className: "rounded-xl bg-muted/35 p-4", children: [_jsx(CapabilityList, { capabilities: profile.capabilities }), _jsxs("div", { className: "mt-5 flex flex-col-reverse gap-2 pt-4 sm:flex-row sm:justify-between", children: [_jsx("button", { type: "button", className: secondaryButtonClass, onClick: () => setScreen("choice"), children: "Back" }), _jsxs("button", { type: "button", className: primaryButtonClass, onClick: handleOpenSettings, children: ["Open key settings", _jsx(IconArrowRight, { size: 15 })] }), _jsx("button", { type: "button", className: secondaryButtonClass, onClick: () => setScreen(skipIntegrations ? "ready" : "tools"), children: skipIntegrations ? "Continue" : "Continue to tools" })] })] })] }) }));
     }
     if (screen === "tools") {
-        return (_jsxs(OnboardingShell, { profile: profile, screen: "tools", footer: _jsxs("div", { "data-testid": "onboarding-tools-footer", className: "mx-auto flex w-full max-w-3xl flex-wrap items-center justify-end gap-2", children: [_jsx("button", { type: "button", className: secondaryButtonClass, onClick: handleFinish, children: "Skip for now" }), _jsxs("button", { type: "button", className: primaryButtonClass, onClick: handleFinish, children: ["Continue", _jsx(IconArrowRight, { size: 15 })] })] }), children: [_jsxs("div", { className: "mx-auto flex w-full max-w-4xl flex-col gap-5", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-[-0.05em] sm:text-3xl", children: "This app is an agent." }), _jsx("p", { className: "mt-1.5 max-w-2xl text-sm leading-6 text-muted-foreground", children: "Connect the tools your agent can use to gather context and take action. You can add more later in Settings." })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-3 pb-4", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("div", { children: _jsx("p", { className: "text-sm font-medium text-foreground", children: "Agent integrations" }) }), _jsxs("label", { className: "relative w-full max-w-xs", children: [_jsx(IconSearch, { className: "pointer-events-none absolute start-3 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }), _jsx("input", { value: integrationQuery, onChange: (event) => setIntegrationQuery(event.target.value), className: "h-9 w-full rounded-md border border-border bg-background pe-3 ps-8 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: "Search integrations", "aria-label": "Search integrations" })] })] }), connectError && (_jsx("p", { className: "text-xs leading-5 text-destructive", children: connectError }))] }), _jsx(IntegrationGrid, { items: mcpIntegrations.map((integration) => {
+        return (_jsxs(OnboardingShell, { profile: profile, screen: "tools", footer: _jsxs("div", { "data-testid": "onboarding-tools-footer", className: "mx-auto flex w-full max-w-3xl flex-wrap items-center justify-end gap-2", children: [_jsx("button", { type: "button", className: secondaryButtonClass, onClick: handleFinish, children: "Skip for now" }), _jsxs("button", { type: "button", className: primaryButtonClass, onClick: handleFinish, children: ["Continue", _jsx(IconArrowRight, { size: 15 })] })] }), children: [_jsxs("div", { className: "mx-auto flex w-full max-w-4xl flex-col gap-5", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-[-0.05em] sm:text-3xl", children: "This app is an agent." }), _jsx("p", { className: "mt-1.5 max-w-2xl text-sm leading-6 text-muted-foreground", children: "Connect the tools your agent can use to gather context and take action. You can add more later in Settings." })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-3 pb-4", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("div", { children: _jsx("p", { className: "text-sm font-medium text-foreground", children: "Agent integrations" }) }), _jsxs("label", { className: "relative w-full max-w-xs", children: [_jsx(IconSearch, { className: "pointer-events-none absolute start-3 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }), _jsx("input", { value: integrationQuery, onChange: (event) => setIntegrationQuery(event.target.value), className: "h-9 w-full rounded-md border border-border bg-background pe-3 ps-8 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: "Search integrations", "aria-label": "Search integrations" })] })] }), connectError && (_jsx("p", { className: "text-xs leading-5 text-destructive", children: connectError })), mcpServersQuery.isError ? (_jsxs("div", { role: "alert", className: "rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 text-xs text-destructive", children: [_jsx("p", { children: formatMcpServersLoadError(mcpServersQuery.error) }), _jsx("button", { type: "button", onClick: () => void mcpServersQuery.refetch(), disabled: mcpServersQuery.isFetching, className: "mt-2 font-medium underline underline-offset-2 hover:text-foreground disabled:cursor-wait disabled:opacity-60", children: mcpServersQuery.isFetching ? "Retrying…" : "Retry" })] })) : null] }), _jsx(IntegrationGrid, { items: mcpIntegrations.map((integration) => {
                                         const connected = connectedUrls.has(compareUrl(integration.url));
                                         return {
                                             id: integration.id,
@@ -200,7 +202,9 @@ export function FirstRunOnboarding({ skipIntegrations = shouldSkipFirstRunIntegr
                                             status: connected ? "Connected" : undefined,
                                             statusClassName: "text-emerald-600 dark:text-emerald-400",
                                             actionLabel: connected ? "Connected" : "Connect",
-                                            disabled: connected || connectingIntegrationId === integration.id,
+                                            disabled: connected ||
+                                                connectingIntegrationId === integration.id ||
+                                                !mcpServersQuery.isSuccess,
                                             onAction: () => void connectIntegration(integration),
                                         };
                                     }), emptyLabel: "No integrations match." })] })] }), integrationDialogId && (_jsx(McpIntegrationDialog, { open: true, onOpenChange: (open) => {

package/dist/client/resources/McpIntegrationDialog.d.ts

@@ -10,7 +10,9 @@ export interface McpIntegrationDialogProps {
     canCreateOrgMcp: boolean;
     hasOrg: boolean;
     onCreateMcpServer: (args: CreateMcpServerArgs) => Promise<unknown>;
+    onOAuthStart?: (url: string) => void | Promise<void>;
+    oauthReturnPath?: string;
     onCreated?: () => void;
     integrations?: DefaultMcpIntegration[];
 }
-export declare function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId, connectIntegrationId, quickConnectIntegrationId, defaultScope, canCreateOrgMcp, hasOrg, onCreateMcpServer, onCreated, integrations, }: McpIntegrationDialogProps): import("react").JSX.Element | null;
+export declare function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId, connectIntegrationId, quickConnectIntegrationId, defaultScope, canCreateOrgMcp, hasOrg, onCreateMcpServer, onOAuthStart, oauthReturnPath, onCreated, integrations, }: McpIntegrationDialogProps): import("react").JSX.Element | null;

package/dist/client/resources/McpIntegrationDialog.js

@@ -8,9 +8,9 @@ import { useT } from "../i18n.js";
 import { IntegrationConnectionChoice } from "../integrations/IntegrationConnectionChoice.js";
 import { IntegrationGrid } from "../integrations/IntegrationGrid.js";
 import { cn } from "../utils.js";
-import { buildMcpOAuthStartUrl, createMcpIntegrationFormDefaults, filterMcpIntegrations, getMcpIntegrationApiFallback, getDefaultMcpIntegrations, isCustomMcpIntegrationEnabled, navigateToMcpOAuthStart, resolveMcpIntegrationScope, shouldOfferMcpIntegrationOrganizationScope, shouldOfferMcpOrganizationScope, } from "./mcp-integration-catalog.js";
+import { buildMcpOAuthStartUrl, createMcpIntegrationFormDefaults, filterMcpIntegrations, getMcpIntegrationApiFallback, getDefaultMcpIntegrations, isCustomMcpIntegrationEnabled, navigateToMcpOAuthStart, resolveMcpIntegrationScope, shouldOfferMcpIntegrationOrganizationScope, shouldOfferMcpOrganizationScope, supportsMcpIntegrationOrganizationScope, } from "./mcp-integration-catalog.js";
 import { McpIntegrationLogo } from "./McpIntegrationLogo.js";
-import { formatMcpServerError, getMcpUrlValidationError, useMcpServersApi, useMcpServers, } from "./use-mcp-servers.js";
+import { formatMcpServerError, formatMcpServersLoadError, getMcpUrlValidationError, useMcpServersApi, useMcpServers, } from "./use-mcp-servers.js";
 function parseHeaderLines(text) {
     const out = {};
     for (const line of text.split(/\r?\n/)) {
@@ -49,7 +49,7 @@ function resolveIntegrationScope(integration, defaultScope, hasOrg, canCreateOrg
         (integration.supportsOrganizationScope === true &&
             integration.managedOAuth !== true));
 }
-export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId = null, connectIntegrationId = null, quickConnectIntegrationId = null, defaultScope, canCreateOrgMcp, hasOrg, onCreateMcpServer, onCreated, integrations, }) {
+export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId = null, connectIntegrationId = null, quickConnectIntegrationId = null, defaultScope, canCreateOrgMcp, hasOrg, onCreateMcpServer, onOAuthStart, oauthReturnPath, onCreated, integrations, }) {
     const t = useT();
     const [mode, setMode] = useState("catalog");
     const [query, setQuery] = useState("");
@@ -89,11 +89,21 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
     useEffect(() => {
         if (!open)
             return;
+        if (initialIntegrationId && !mcpServersQuery.isSuccess)
+            return;
         const initialIntegration = initialIntegrationId
             ? defaultIntegrations.find((integration) => integration.id === initialIntegrationId)
             : null;
         const initialDefaults = createMcpIntegrationFormDefaults(initialIntegration);
-        setMode(initialIntegration || !showCatalog ? "form" : "catalog");
+        const initialNeedsScopeChoice = Boolean(initialIntegration &&
+            hasOrg &&
+            requiresMcpIntegrationSetup(initialIntegration) &&
+            supportsMcpIntegrationOrganizationScope(initialIntegration));
+        setMode(initialNeedsScopeChoice
+            ? "choice"
+            : initialIntegration || !showCatalog
+                ? "form"
+                : "catalog");
         setQuery("");
         setSelected(initialIntegration ?? null);
         setScope(resolveIntegrationScope(initialIntegration, defaultScope, hasOrg, canCreateOrgMcp));
@@ -114,6 +124,7 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
         open,
         safeDefaultScope,
         showCatalog,
+        mcpServersQuery.isSuccess,
     ]);
     useEffect(() => {
         if (open && mode === "form") {
@@ -147,18 +158,31 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
             return;
         }
         setBusy(true);
-        const returnUrl = typeof window === "undefined"
-            ? "/"
-            : window.location.pathname +
-                window.location.search +
-                window.location.hash;
-        navigateToMcpOAuthStart(agentNativePath(buildMcpOAuthStartUrl({
+        const returnUrl = oauthReturnPath?.startsWith("/")
+            ? oauthReturnPath
+            : typeof window === "undefined"
+                ? "/"
+                : window.location.pathname +
+                    window.location.search +
+                    window.location.hash;
+        const oauthUrl = agentNativePath(buildMcpOAuthStartUrl({
             name: args.name,
             url: args.url,
             description: args.description,
             scope: options?.scope ?? scope,
             returnUrl,
-        })));
+        }));
+        if (!onOAuthStart) {
+            navigateToMcpOAuthStart(oauthUrl);
+            return;
+        }
+        void Promise.resolve()
+            .then(() => onOAuthStart(oauthUrl))
+            .then(() => onOpenChange(false))
+            .catch((cause) => {
+            setBusy(false);
+            setError(formatMcpServerError(cause));
+        });
     };
     const connectWithOAuth = (integration, options) => beginOAuth({
         name: integration.name,
@@ -218,6 +242,11 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
         });
     };
     const quickConnect = (integration) => {
+        if (hasOrg) {
+            setSelected(integration);
+            setMode("choice");
+            return;
+        }
         if (requiresMcpIntegrationSetup(integration)) {
             openForm(integration);
             return;
@@ -240,6 +269,13 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
         });
     };
     const selectCatalogConnection = (integration) => {
+        if (!mcpServersQuery.isSuccess)
+            return;
+        if (hasOrg) {
+            setSelected(integration);
+            setMode("choice");
+            return;
+        }
         if (requiresMcpIntegrationSetup(integration)) {
             const apiFallback = getMcpIntegrationApiFallback(integration);
             if (apiFallback) {
@@ -250,11 +286,6 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
             }
             return;
         }
-        if (shouldOfferMcpIntegrationOrganizationScope(integration, hasOrg, canCreateOrgMcp)) {
-            setSelected(integration);
-            setMode("choice");
-            return;
-        }
         quickConnect(integration);
     };
     quickConnectRef.current = quickConnect;
@@ -267,15 +298,30 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
             quickConnectAttemptedRef.current === quickConnectIntegrationId) {
             return;
         }
+        if (mcpServersQuery.isError)
+            return;
+        if (!mcpServersQuery.isSuccess)
+            return;
         const integration = defaultIntegrations.find((candidate) => candidate.id === quickConnectIntegrationId);
         if (!integration)
             return;
         quickConnectAttemptedRef.current = quickConnectIntegrationId;
         quickConnectRef.current?.(integration);
-    }, [defaultIntegrations, open, quickConnectIntegrationId]);
+    }, [
+        defaultIntegrations,
+        hasOrg,
+        mcpServersQuery.isError,
+        mcpServersQuery.isSuccess,
+        open,
+        quickConnectIntegrationId,
+    ]);
     useEffect(() => {
         if (!open || !connectIntegrationId)
             return;
+        if (mcpServersQuery.isError)
+            return;
+        if (!mcpServersQuery.isSuccess)
+            return;
         const integration = defaultIntegrations.find((candidate) => candidate.id === connectIntegrationId);
         if (!integration)
             return;
@@ -283,25 +329,36 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
         if (quickConnectAttemptedRef.current === attemptKey)
             return;
         quickConnectAttemptedRef.current = attemptKey;
+        if (hasOrg) {
+            setSelected(integration);
+            setMode("choice");
+            return;
+        }
         if (requiresMcpIntegrationSetup(integration)) {
             openForm(integration);
             return;
         }
-        const showWorkspaceChoice = shouldOfferMcpIntegrationOrganizationScope(integration, hasOrg, canCreateOrgMcp);
-        if (!showWorkspaceChoice) {
-            quickConnectRef.current?.(integration);
-        }
-        else {
-            setMode("choice");
-        }
+        quickConnectRef.current?.(integration);
     }, [
         canCreateOrgMcp,
         connectIntegrationId,
         defaultIntegrations,
         hasOrg,
+        mcpServersQuery.isError,
+        mcpServersQuery.isSuccess,
         open,
     ]);
     const connectPersonal = (integration) => {
+        if (requiresMcpIntegrationSetup(integration)) {
+            const apiFallback = getMcpIntegrationApiFallback(integration);
+            if (apiFallback) {
+                openAgentSettings(`secrets:${apiFallback.secretKey}`);
+            }
+            else {
+                openForm(integration, { scope: "user" });
+            }
+            return;
+        }
         if (integration.authMode === "oauth") {
             connectWithOAuth(integration, { scope: "user" });
             return;
@@ -319,6 +376,12 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
         openForm(integration, { scope: "user" });
     };
     const connectWorkspace = (integration) => {
+        if (!canCreateOrgMcp)
+            return;
+        if (requiresMcpIntegrationSetup(integration)) {
+            openForm(integration, { scope: "org" });
+            return;
+        }
         if (integration.authMode === "oauth") {
             connectWithOAuth(integration, { scope: "org" });
             return;
@@ -384,93 +447,99 @@ export function McpIntegrationDialog({ open, onOpenChange, initialIntegrationId
     };
     if (!showCatalog && !customIntegrationEnabled)
         return null;
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsx(DialogContent, { "aria-describedby": undefined, className: "inset-0 flex h-[100dvh] max-h-none w-full max-w-none translate-x-0 translate-y-0 flex-col gap-0 overflow-hidden rounded-none p-0", children: mode === "choice" && selected ? (_jsxs(_Fragment, { children: [_jsx(DialogHeader, { className: "sr-only", children: _jsxs(DialogTitle, { children: ["Connect ", selected.name] }) }), _jsx(IntegrationConnectionChoice, { name: selected.name, logo: _jsx(McpIntegrationLogo, { name: selected.name, logoUrl: selected.logoUrl, integrationId: selected.id, className: "size-7 rounded-md", imageClassName: "size-full p-1" }), showWorkspaceOption: shouldOfferMcpIntegrationOrganizationScope(selected, hasOrg, canCreateOrgMcp), busy: busy, onPersonal: () => connectPersonal(selected), onWorkspace: () => connectWorkspace(selected) })] })) : mode === "catalog" ? (_jsxs(_Fragment, { children: [_jsxs(DialogHeader, { className: "shrink-0 border-b border-border px-7 pb-5 pe-14 pt-7 sm:px-10", children: [_jsx(DialogTitle, { children: t("mcpIntegrations.title") }), _jsx(DialogDescription, { children: t("mcpIntegrations.description", {
-                                    count: defaultIntegrations.length,
-                                }) })] }), _jsx("div", { className: "shrink-0 px-7 pb-5 sm:px-10", children: _jsxs("div", { className: "mx-auto flex w-full max-w-5xl flex-col gap-3 sm:flex-row", children: [_jsxs("label", { className: "relative min-w-0 flex-1", children: [_jsx(IconSearch, { className: "pointer-events-none absolute start-3 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }), _jsx("input", { value: query, onChange: (event) => setQuery(event.target.value), className: "h-9 w-full rounded-md border border-border bg-background pe-3 ps-8 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.searchPlaceholder") })] }), _jsx("button", { type: "button", onClick: () => openForm(null), className: cn("inline-flex h-9 items-center justify-center gap-1.5 rounded-md border border-border bg-background px-3 text-[12px] font-medium text-foreground hover:bg-accent", !customIntegrationEnabled && "hidden"), children: t("mcpIntegrations.addYourOwn") })] }) }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-7 pb-10 pt-7 sm:px-10", children: _jsxs("div", { className: "mx-auto w-full max-w-5xl", children: [error && (_jsx("div", { className: "mb-3 rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 text-[12px] leading-relaxed text-destructive", children: error })), _jsx(IntegrationGrid, { items: filteredIntegrations.map((integration) => {
-                                        const connected = connectedUrls.has(compareUrl(integration.url));
-                                        const setupOnly = requiresMcpIntegrationSetup(integration);
-                                        const apiFallback = getMcpIntegrationApiFallback(integration);
-                                        return {
-                                            id: integration.id,
-                                            name: integration.name,
-                                            description: t(integration.descriptionKey),
-                                            logo: (_jsx(McpIntegrationLogo, { name: integration.name, logoUrl: integration.logoUrl, integrationId: integration.id, className: "size-7 rounded-md", imageClassName: "size-full p-1" })),
-                                            status: connected
-                                                ? t("mcpIntegrations.connected")
-                                                : setupOnly
-                                                    ? t("mcpIntegrations.status.setupRequired")
-                                                    : undefined,
-                                            statusClassName: connected
-                                                ? "text-emerald-600 dark:text-emerald-400"
-                                                : "text-muted-foreground",
-                                            actionLabel: connected
-                                                ? "Manage"
-                                                : setupOnly && apiFallback
-                                                    ? t("mcpIntegrations.useApiToken")
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { "aria-describedby": undefined, className: "inset-0 flex h-[100dvh] max-h-none w-full max-w-none translate-x-0 translate-y-0 flex-col gap-0 overflow-hidden rounded-none p-0", children: [mcpServersQuery.isError ? (_jsxs("div", { role: "alert", className: "mx-7 mt-4 shrink-0 rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 text-xs text-destructive sm:mx-10", children: [_jsx("p", { children: formatMcpServersLoadError(mcpServersQuery.error) }), _jsx("button", { type: "button", onClick: () => void mcpServersQuery.refetch(), disabled: mcpServersQuery.isFetching, className: "mt-2 font-medium underline underline-offset-2 hover:text-foreground disabled:cursor-wait disabled:opacity-60", children: mcpServersQuery.isFetching
+                                ? t("mcpIntegrations.retrying")
+                                : t("mcpIntegrations.retry") })] })) : null, mode === "choice" && selected ? (_jsxs(_Fragment, { children: [_jsx(DialogHeader, { className: "sr-only", children: _jsxs(DialogTitle, { children: [t("mcpIntegrations.connect"), " ", selected.name] }) }), _jsx(IntegrationConnectionChoice, { name: selected.name, logo: _jsx(McpIntegrationLogo, { name: selected.name, logoUrl: selected.logoUrl, integrationId: selected.id, className: "size-7 rounded-md", imageClassName: "size-full p-1" }), showWorkspaceOption: supportsMcpIntegrationOrganizationScope(selected), workspaceOptionDisabled: !canCreateOrgMcp, workspaceOptionDisabledReason: !canCreateOrgMcp
+                                ? t("mcpIntegrations.workspaceAdminRequired")
+                                : undefined, personalOnlyReason: !supportsMcpIntegrationOrganizationScope(selected)
+                                ? t("mcpIntegrations.personalOnlyDescription")
+                                : undefined, busy: busy, onPersonal: () => connectPersonal(selected), onWorkspace: () => connectWorkspace(selected) })] })) : mode === "catalog" ? (_jsxs(_Fragment, { children: [_jsxs(DialogHeader, { className: "shrink-0 border-b border-border px-7 pb-5 pe-14 pt-7 sm:px-10", children: [_jsx(DialogTitle, { children: t("mcpIntegrations.title") }), _jsx(DialogDescription, { children: t("mcpIntegrations.description", {
+                                        count: defaultIntegrations.length,
+                                    }) })] }), _jsx("div", { className: "shrink-0 px-7 pb-5 sm:px-10", children: _jsxs("div", { className: "mx-auto flex w-full max-w-5xl flex-col gap-3 sm:flex-row", children: [_jsxs("label", { className: "relative min-w-0 flex-1", children: [_jsx(IconSearch, { className: "pointer-events-none absolute start-3 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }), _jsx("input", { value: query, onChange: (event) => setQuery(event.target.value), className: "h-9 w-full rounded-md border border-border bg-background pe-3 ps-8 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.searchPlaceholder") })] }), _jsx("button", { type: "button", onClick: () => openForm(null), className: cn("inline-flex h-9 items-center justify-center gap-1.5 rounded-md border border-border bg-background px-3 text-[12px] font-medium text-foreground hover:bg-accent", !customIntegrationEnabled && "hidden"), children: t("mcpIntegrations.addYourOwn") })] }) }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-7 pb-10 pt-7 sm:px-10", children: _jsxs("div", { className: "mx-auto w-full max-w-5xl", children: [error && (_jsx("div", { className: "mb-3 rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 text-[12px] leading-relaxed text-destructive", children: error })), !mcpServersQuery.isSuccess && !mcpServersQuery.isError ? (_jsx("div", { role: "status", className: "mb-3 rounded-md border border-border bg-muted/30 px-3 py-2 text-[12px] leading-relaxed text-muted-foreground", children: t("mcpIntegrations.loadingScopeMetadata") })) : null, _jsx(IntegrationGrid, { items: filteredIntegrations.map((integration) => {
+                                            const connected = connectedUrls.has(compareUrl(integration.url));
+                                            const setupOnly = requiresMcpIntegrationSetup(integration);
+                                            const apiFallback = getMcpIntegrationApiFallback(integration);
+                                            return {
+                                                id: integration.id,
+                                                name: integration.name,
+                                                description: t(integration.descriptionKey),
+                                                logo: (_jsx(McpIntegrationLogo, { name: integration.name, logoUrl: integration.logoUrl, integrationId: integration.id, className: "size-7 rounded-md", imageClassName: "size-full p-1" })),
+                                                status: connected
+                                                    ? t("mcpIntegrations.connected")
                                                     : setupOnly
-                                                        ? t("mcpIntegrations.viewSetup")
-                                                        : t("mcpIntegrations.connect"),
-                                            disabled: connected || busy,
-                                            onAction: () => {
-                                                if (connected) {
-                                                    openForm(integration);
-                                                    return;
-                                                }
-                                                selectCatalogConnection(integration);
-                                            },
-                                        };
-                                    }), emptyLabel: t("mcpIntegrations.noMatches") })] }) })] })) : (_jsxs(_Fragment, { children: [_jsxs(DialogHeader, { className: "shrink-0 border-b border-border px-7 pb-5 pe-14 pt-7 sm:px-10", children: [_jsxs("button", { type: "button", onClick: () => {
-                                    clearFeedback();
-                                    setMode("catalog");
-                                }, className: cn("mb-1 inline-flex w-fit items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground", !showCatalog && "hidden"), children: [_jsx(IconArrowLeft, { className: "h-3 w-3 rtl:-scale-x-100" }), t("mcpIntegrations.backToIntegrations")] }), _jsx(DialogTitle, { children: selected
-                                    ? selectedRequiresSetup
-                                        ? t("mcpIntegrations.setupTitle", {
-                                            name: selected.name,
-                                        })
-                                        : t("mcpIntegrations.configureTitle", {
-                                            name: selected.name,
-                                        })
-                                    : t("mcpIntegrations.customTitle") }), _jsx(DialogDescription, { children: selected
-                                    ? selectedRequiresSetup
-                                        ? t("mcpIntegrations.providerSetupFormDescription")
-                                        : selected.authMode === "none"
-                                            ? t("mcpIntegrations.presetNoAuthDescription")
-                                            : t("mcpIntegrations.presetAuthDescription")
-                                    : t("mcpIntegrations.customDescription") })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-7 py-7 sm:px-10", children: _jsxs("div", { className: "mx-auto max-w-2xl space-y-3", children: [renderScopeSelector(), selected?.setupNoteKey && !selectedRequiresSetup ? (_jsx("div", { className: "rounded-md bg-muted/40 px-3 py-2 text-[11px] leading-relaxed text-muted-foreground", children: t(selected.setupNoteKey) })) : null, selectedRequiresSetup && selected && (_jsxs("div", { className: "mx-auto grid w-full max-w-xl gap-4 py-8", children: [_jsxs("div", { children: [_jsx("p", { className: "text-base font-semibold tracking-[-0.02em] text-foreground", children: t("mcpIntegrations.providerSetupRequired") }), _jsx("p", { className: "mt-1 text-sm leading-6 text-muted-foreground", children: t("mcpIntegrations.providerSetupDescription", {
-                                                        name: selected.name,
-                                                    }) })] }), selected.setupNoteKey ? (_jsx("p", { className: "text-sm leading-6 text-muted-foreground", children: t(selected.setupNoteKey) })) : null, selected.docsUrl ? (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex w-fit items-center gap-1 text-sm font-medium text-foreground underline underline-offset-4 hover:text-muted-foreground", children: [t("mcpIntegrations.viewSetup"), _jsx(IconExternalLink, { className: "size-3.5" })] })) : null] })), !selected && (_jsxs("div", { className: "flex items-center justify-between gap-3 rounded-md bg-muted/30 px-3 py-2 text-[11px]", children: [_jsx("span", { className: "text-muted-foreground", children: customAuthMode === "oauth"
-                                                ? t(
-                                                /* i18n-key-ignore */
-                                                "mcpIntegrations.customOAuthDefault", { defaultValue: "Sign in with OAuth" })
-                                                : t(
-                                                /* i18n-key-ignore */
-                                                "mcpIntegrations.customHeadersMode", { defaultValue: "Use an API key" }) }), _jsx("button", { type: "button", onClick: () => {
-                                                setCustomAuthMode((current) => current === "oauth" ? "headers" : "oauth");
-                                                clearFeedback();
-                                            }, className: "font-medium text-foreground underline underline-offset-2 hover:text-muted-foreground", children: customAuthMode === "oauth"
-                                                ? t(
-                                                /* i18n-key-ignore */
-                                                "mcpIntegrations.useApiKeyInstead", { defaultValue: "Use an API key instead" })
-                                                : t(
-                                                /* i18n-key-ignore */
-                                                "mcpIntegrations.useOAuthInstead", { defaultValue: "Use OAuth instead" }) })] })), !selectedRequiresSetup && (_jsxs(_Fragment, { children: [selected?.authMode === "oauth" && (_jsx("div", { className: "rounded-md border border-primary/20 bg-primary/5 px-3 py-2 text-[11px] leading-relaxed text-primary", children: t("mcpIntegrations.oauthNotice") })), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.serverName") }), _jsx("input", { ref: inputRef, value: name, onChange: (event) => {
-                                                        setName(event.target.value);
-                                                        clearFeedback();
-                                                    }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.serverNamePlaceholder") })] }), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.url") }), _jsx("input", { value: url, onChange: (event) => {
-                                                        setUrl(event.target.value);
-                                                        clearFeedback();
-                                                    }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.urlPlaceholder") })] }), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.fieldDescription") }), _jsx("input", { value: description, onChange: (event) => {
-                                                        setDescription(event.target.value);
-                                                        clearFeedback();
-                                                    }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.descriptionPlaceholder") })] }), (selected
-                                            ? selected.authMode !== "oauth"
-                                            : customAuthMode === "headers") && (_jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.headers") }), _jsx("textarea", { value: headersText, onChange: (event) => {
-                                                        setHeadersText(event.target.value);
-                                                        clearFeedback();
-                                                    }, rows: 3, className: "w-full resize-y rounded-md border border-border bg-background px-2.5 py-1.5 text-[12px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", style: {
-                                                        fontFamily: 'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace',
-                                                    }, placeholder: selected?.headerPlaceholder ??
-                                                        t("mcpIntegrations.headersPlaceholder") })] })), selected?.docsUrl && (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 text-[11px] text-muted-foreground underline hover:text-foreground", children: [t("mcpIntegrations.openSetupDocs"), _jsx(IconExternalLink, { className: "h-3 w-3" })] }))] })), testResult && (_jsxs("div", { className: cn("flex items-start gap-1 rounded-md px-3 py-2 text-[11px] leading-snug", testResult.ok
-                                        ? "bg-green-500/5 text-green-600 dark:text-green-400"
-                                        : "bg-red-500/5 text-red-600 dark:text-red-400"), children: [testResult.ok && (_jsx(IconCheck, { className: "mt-0.5 h-3 w-3 shrink-0" })), _jsx("span", { className: "min-w-0 break-words", children: testResult.message })] })), error && (_jsx("div", { className: "break-words rounded-md bg-red-500/5 px-3 py-2 text-[11px] leading-snug text-red-600 dark:text-red-400", children: error }))] }) }), _jsxs("div", { className: "flex shrink-0 items-center justify-between gap-2 border-t border-border px-7 py-4", children: [!selectedRequiresSetup && (_jsx("button", { type: "button", onClick: runTest, disabled: !url.trim() || busy, className: "rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent disabled:pointer-events-none disabled:opacity-40", children: t("mcpIntegrations.test") })), !selected && customAuthMode === "oauth" ? (_jsxs("button", { type: "button", onClick: connectCustomWithOAuth, disabled: !name.trim() || !url.trim() || busy, "aria-busy": busy, className: "rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent disabled:pointer-events-none disabled:opacity-40", children: [busy && (_jsx(IconLoader2, { className: "me-1.5 inline h-3.5 w-3.5 animate-spin" })), t("mcpIntegrations.connectWithOAuth")] })) : null, selectedRequiresSetup ? (_jsxs("div", { className: "ms-auto flex items-center gap-2", children: [selected?.docsUrl ? (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent", children: [t("mcpIntegrations.viewSetup"), _jsx(IconExternalLink, { className: "h-3 w-3" })] })) : null, selected?.authMode === "oauth" && (_jsxs("button", { type: "button", onClick: () => connectWithOAuth(selected), disabled: busy, "aria-busy": busy, className: "inline-flex min-w-[132px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && (_jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" })), t("mcpIntegrations.continueToConnect")] }))] })) : selected?.authMode === "oauth" ? (_jsxs("button", { type: "button", onClick: () => connectWithOAuth(selected), disabled: !name.trim() || !url.trim() || busy, "aria-busy": busy, className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && _jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" }), t("mcpIntegrations.connectWithOAuth")] })) : !selected && customAuthMode === "oauth" ? null : (_jsxs("button", { type: "button", onClick: submitForm, disabled: !name.trim() || !url.trim() || busy, className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && _jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" }), t("mcpIntegrations.connect")] }))] })] })) }) }));
+                                                        ? t("mcpIntegrations.status.setupRequired")
+                                                        : undefined,
+                                                statusClassName: connected
+                                                    ? "text-emerald-600 dark:text-emerald-400"
+                                                    : "text-muted-foreground",
+                                                actionLabel: connected
+                                                    ? "Manage"
+                                                    : setupOnly && apiFallback
+                                                        ? t("mcpIntegrations.useApiToken")
+                                                        : setupOnly
+                                                            ? t("mcpIntegrations.viewSetup")
+                                                            : t("mcpIntegrations.connect"),
+                                                disabled: connected || busy || !mcpServersQuery.isSuccess,
+                                                onAction: () => {
+                                                    if (connected) {
+                                                        openForm(integration);
+                                                        return;
+                                                    }
+                                                    selectCatalogConnection(integration);
+                                                },
+                                            };
+                                        }), emptyLabel: t("mcpIntegrations.noMatches") })] }) })] })) : (_jsxs(_Fragment, { children: [_jsxs(DialogHeader, { className: "shrink-0 border-b border-border px-7 pb-5 pe-14 pt-7 sm:px-10", children: [_jsxs("button", { type: "button", onClick: () => {
+                                        clearFeedback();
+                                        setMode("catalog");
+                                    }, className: cn("mb-1 inline-flex w-fit items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground", !showCatalog && "hidden"), children: [_jsx(IconArrowLeft, { className: "h-3 w-3 rtl:-scale-x-100" }), t("mcpIntegrations.backToIntegrations")] }), _jsx(DialogTitle, { children: selected
+                                        ? selectedRequiresSetup
+                                            ? t("mcpIntegrations.setupTitle", {
+                                                name: selected.name,
+                                            })
+                                            : t("mcpIntegrations.configureTitle", {
+                                                name: selected.name,
+                                            })
+                                        : t("mcpIntegrations.customTitle") }), _jsx(DialogDescription, { children: selected
+                                        ? selectedRequiresSetup
+                                            ? t("mcpIntegrations.providerSetupFormDescription")
+                                            : selected.authMode === "none"
+                                                ? t("mcpIntegrations.presetNoAuthDescription")
+                                                : t("mcpIntegrations.presetAuthDescription")
+                                        : t("mcpIntegrations.customDescription") })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-7 py-7 sm:px-10", children: _jsxs("div", { className: "mx-auto max-w-2xl space-y-3", children: [renderScopeSelector(), selected?.setupNoteKey && !selectedRequiresSetup ? (_jsx("div", { className: "rounded-md bg-muted/40 px-3 py-2 text-[11px] leading-relaxed text-muted-foreground", children: t(selected.setupNoteKey) })) : null, selectedRequiresSetup && selected && (_jsxs("div", { className: "mx-auto grid w-full max-w-xl gap-4 py-8", children: [_jsxs("div", { children: [_jsx("p", { className: "text-base font-semibold tracking-[-0.02em] text-foreground", children: t("mcpIntegrations.providerSetupRequired") }), _jsx("p", { className: "mt-1 text-sm leading-6 text-muted-foreground", children: t("mcpIntegrations.providerSetupDescription", {
+                                                            name: selected.name,
+                                                        }) })] }), selected.setupNoteKey ? (_jsx("p", { className: "text-sm leading-6 text-muted-foreground", children: t(selected.setupNoteKey) })) : null, selected.docsUrl ? (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex w-fit items-center gap-1 text-sm font-medium text-foreground underline underline-offset-4 hover:text-muted-foreground", children: [t("mcpIntegrations.viewSetup"), _jsx(IconExternalLink, { className: "size-3.5" })] })) : null] })), !selected && (_jsxs("div", { className: "flex items-center justify-between gap-3 rounded-md bg-muted/30 px-3 py-2 text-[11px]", children: [_jsx("span", { className: "text-muted-foreground", children: customAuthMode === "oauth"
+                                                    ? t(
+                                                    /* i18n-key-ignore */
+                                                    "mcpIntegrations.customOAuthDefault", { defaultValue: "Sign in with OAuth" })
+                                                    : t(
+                                                    /* i18n-key-ignore */
+                                                    "mcpIntegrations.customHeadersMode", { defaultValue: "Use an API key" }) }), _jsx("button", { type: "button", onClick: () => {
+                                                    setCustomAuthMode((current) => current === "oauth" ? "headers" : "oauth");
+                                                    clearFeedback();
+                                                }, className: "font-medium text-foreground underline underline-offset-2 hover:text-muted-foreground", children: customAuthMode === "oauth"
+                                                    ? t(
+                                                    /* i18n-key-ignore */
+                                                    "mcpIntegrations.useApiKeyInstead", { defaultValue: "Use an API key instead" })
+                                                    : t(
+                                                    /* i18n-key-ignore */
+                                                    "mcpIntegrations.useOAuthInstead", { defaultValue: "Use OAuth instead" }) })] })), !selectedRequiresSetup && (_jsxs(_Fragment, { children: [selected?.authMode === "oauth" && (_jsx("div", { className: "rounded-md border border-primary/20 bg-primary/5 px-3 py-2 text-[11px] leading-relaxed text-primary", children: t("mcpIntegrations.oauthNotice") })), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.serverName") }), _jsx("input", { ref: inputRef, value: name, onChange: (event) => {
+                                                            setName(event.target.value);
+                                                            clearFeedback();
+                                                        }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.serverNamePlaceholder") })] }), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.url") }), _jsx("input", { value: url, onChange: (event) => {
+                                                            setUrl(event.target.value);
+                                                            clearFeedback();
+                                                        }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.urlPlaceholder") })] }), _jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.fieldDescription") }), _jsx("input", { value: description, onChange: (event) => {
+                                                            setDescription(event.target.value);
+                                                            clearFeedback();
+                                                        }, className: "w-full rounded-md border border-border bg-background px-2.5 py-1.5 text-[13px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", placeholder: t("mcpIntegrations.descriptionPlaceholder") })] }), (selected
+                                                ? selected.authMode !== "oauth"
+                                                : customAuthMode === "headers") && (_jsxs("label", { className: "block", children: [_jsx("span", { className: "mb-1 block text-[10px] font-medium text-muted-foreground", children: t("mcpIntegrations.headers") }), _jsx("textarea", { value: headersText, onChange: (event) => {
+                                                            setHeadersText(event.target.value);
+                                                            clearFeedback();
+                                                        }, rows: 3, className: "w-full resize-y rounded-md border border-border bg-background px-2.5 py-1.5 text-[12px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-ring", style: {
+                                                            fontFamily: 'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace',
+                                                        }, placeholder: selected?.headerPlaceholder ??
+                                                            t("mcpIntegrations.headersPlaceholder") })] })), selected?.docsUrl && (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 text-[11px] text-muted-foreground underline hover:text-foreground", children: [t("mcpIntegrations.openSetupDocs"), _jsx(IconExternalLink, { className: "h-3 w-3" })] }))] })), testResult && (_jsxs("div", { className: cn("flex items-start gap-1 rounded-md px-3 py-2 text-[11px] leading-snug", testResult.ok
+                                            ? "bg-green-500/5 text-green-600 dark:text-green-400"
+                                            : "bg-red-500/5 text-red-600 dark:text-red-400"), children: [testResult.ok && (_jsx(IconCheck, { className: "mt-0.5 h-3 w-3 shrink-0" })), _jsx("span", { className: "min-w-0 break-words", children: testResult.message })] })), error && (_jsx("div", { className: "break-words rounded-md bg-red-500/5 px-3 py-2 text-[11px] leading-snug text-red-600 dark:text-red-400", children: error }))] }) }), _jsxs("div", { className: "flex shrink-0 items-center justify-between gap-2 border-t border-border px-7 py-4", children: [!selectedRequiresSetup && (_jsx("button", { type: "button", onClick: runTest, disabled: !url.trim() || busy, className: "rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent disabled:pointer-events-none disabled:opacity-40", children: t("mcpIntegrations.test") })), !selected && customAuthMode === "oauth" ? (_jsxs("button", { type: "button", onClick: connectCustomWithOAuth, disabled: !name.trim() || !url.trim() || busy, "aria-busy": busy, className: "rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent disabled:pointer-events-none disabled:opacity-40", children: [busy && (_jsx(IconLoader2, { className: "me-1.5 inline h-3.5 w-3.5 animate-spin" })), t("mcpIntegrations.connectWithOAuth")] })) : null, selectedRequiresSetup ? (_jsxs("div", { className: "ms-auto flex items-center gap-2", children: [selected?.docsUrl ? (_jsxs("a", { href: selected.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md border border-border bg-background px-3 py-1.5 text-[12px] font-medium text-foreground hover:bg-accent", children: [t("mcpIntegrations.viewSetup"), _jsx(IconExternalLink, { className: "h-3 w-3" })] })) : null, selected?.authMode === "oauth" && (_jsxs("button", { type: "button", onClick: () => connectWithOAuth(selected), disabled: busy, "aria-busy": busy, className: "inline-flex min-w-[132px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && (_jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" })), t("mcpIntegrations.continueToConnect")] }))] })) : selected?.authMode === "oauth" ? (_jsxs("button", { type: "button", onClick: () => connectWithOAuth(selected), disabled: !name.trim() || !url.trim() || busy, "aria-busy": busy, className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && _jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" }), t("mcpIntegrations.connectWithOAuth")] })) : !selected && customAuthMode === "oauth" ? null : (_jsxs("button", { type: "button", onClick: submitForm, disabled: !name.trim() || !url.trim() || busy, className: "inline-flex min-w-[92px] items-center justify-center gap-1.5 rounded-md bg-primary px-3 py-1.5 text-[12px] font-medium text-primary-foreground hover:bg-primary/90 disabled:pointer-events-none disabled:opacity-40", children: [busy && _jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" }), t("mcpIntegrations.connect")] }))] })] }))] }) }));
 }