@iblai/web-containers 1.56.1 → 1.58.0

package/dist/esm/components/modals/edit-mentor-modal/tabs/mcp-tab/connector-management-content.js

@@ -1,350 +1,69 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import { format } from 'date-fns';
+import { toast } from 'sonner';
 import { Button } from '../../../../ui/button.js';
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../../../ui/dialog.js';
 import { Input } from '../../../../ui/input.js';
 import { Switch } from '../../../../ui/switch.js';
+import { Tabs, TabsList, TabsTrigger, TabsContent } from '../../../../ui/tabs.js';
 import { Popover, PopoverTrigger, PopoverContent } from '../../../../ui/popover.js';
 import { Calendar as Calendar$1 } from '../../../../ui/calendar.js';
 import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '../../../../ui/command.js';
 import { ConnectorDialogs } from './connector-dialogs.js';
-import { useLocalStorage } from '../../../../../hooks/use-local-storage.js';
-import { useGetMCPServersQuery, useGetMentorSettingsQuery, useGetConnectedServicesQuery, useGetMCPServerConnectionsQuery, useCreateMCPServerMutation, useUpdateMCPServerMutation, useDeleteMCPServerMutation, useEditMentorJsonMutation, useLazyStartOAuthFlowQuery, useDisconnectServiceMutation, useCreateMCPServerConnectionMutation } from '@iblai/data-layer';
-import { TransportEnum } from '@iblai/iblai-api';
-import { toast } from 'sonner';
+import { canManageMcpServers, currentSignInScope, connectionForScopeExists, getTransportLabelKey, TRANSPORT_OPTIONS, getMcpConnectionState, connectorImage, normalizeTransportValue, MCP_SERVER_PERMISSION_NAME } from './mcp-connector-helpers.js';
+export { MCP_RADIO_ITEM_CLASS, attachedMcpServers, checkOAuthConnectionComplete, connectionHasSignIn, createMCPServerFormData, createOAuthConnection, determineCheckConnectionAction, determineMessageEventAction, executeCheckConnectionFlowLogic, executeConnectionFoundCleanup, executeHandleMessageCallback, executeMaxPollsCleanup, executeMessageEventFlowLogic, findMCPServerConnection, handleOAuthMessageResult, mcpServerSignedIn, oauthCallbackUrl, processOAuthMessageEvent, processOAuthStorageEvent, readAttachedMcpServerIds, shouldExecuteMessageAction, validateDisconnectOAuthParams } from './mcp-connector-helpers.js';
+import { RemoveConnectorDialog } from './remove-connector-dialog.js';
+import { useGetMCPServersQuery, useSetMCPServerMentorAuthScopeMutation, usePartialUpdateMCPServerMutation } from '@iblai/data-layer';
 import { Spinner } from '../../../../spinner/index.js';
+import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from '../../../../ui/tooltip.js';
 import { cn } from '../../../../../lib/utils.js';
 import { IblPagination } from '../../../../ibl-pagination.js';
-import { WithPermissions, WithFormPermissions } from '@iblai/web-utils';
-import { useAgentSettingsOptional } from '../../agent-settings-context.js';
+import { checkRbacPermission, WithPermissions, WithFormPermissions } from '@iblai/web-utils';
 import { useT } from '../../../../../i18n/context.js';
 import '../../../../../packages/i18n/dist/index.esm.js';
+import { useMcpServerActions } from './use-mcp-server-actions.js';
+import Plus from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plus.js';
+import Plug from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plug.js';
 import Calendar from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/calendar.js';
 import ChevronsUpDown from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/chevrons-up-down.js';
 import Check from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/check.js';
-import Plug from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plug.js';
-import Plus from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plus.js';
-import Unlink from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/unlink.js';
-import Link2 from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/link-2.js';
-import SquarePen from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/square-pen.js';
+import Building2 from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/building-2.js';
+import Bot from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/bot.js';
+import UserRound from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/user-round.js';
+import Settings from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/settings.js';
 import Trash2 from '../../../../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/trash-2.js';
 
-const MCP_SERVER_PERMISSION_NAME = 'server';
-const TRANSPORT_OPTIONS = [
-    { value: '', label: 'All Transports' },
-    { value: TransportEnum.SSE, label: 'SSE' },
-    { value: TransportEnum.WEBSOCKET, label: 'WebSocket' },
-    { value: TransportEnum.STREAMABLE_HTTP, label: 'Streamable HTTP' },
-];
-const TRANSPORT_LABEL_KEYS = {
-    '': 'mcpTabConnectorManagementContent.transportLabelAllTransports',
-    [TransportEnum.SSE]: 'mcpTabConnectorManagementContent.transportLabelSSE',
-    [TransportEnum.WEBSOCKET]: 'mcpTabConnectorManagementContent.transportLabelWebSocket',
-    [TransportEnum.STREAMABLE_HTTP]: 'mcpTabConnectorManagementContent.transportLabelStreamableHTTP',
-};
-const getTransportLabelKey = (value) => { var _a; return (_a = TRANSPORT_LABEL_KEYS[value]) !== null && _a !== void 0 ? _a : 'mcpTabConnectorManagementContent.transportLabelStreamableHTTP'; };
-const getTransportLabel = (transport) => {
-    const normalized = transport === null || transport === void 0 ? void 0 : transport.toString().toLowerCase();
-    const option = TRANSPORT_OPTIONS.find((opt) => {
-        const optVal = opt.value ? opt.value.toString().toLowerCase() : '';
-        return optVal === '' ? !normalized : optVal === normalized;
-    });
-    return (option === null || option === void 0 ? void 0 : option.label) || (transport === null || transport === void 0 ? void 0 : transport.toString()) || 'Streamable HTTP';
-};
-const normalizeTransportValue = (transport) => {
-    const normalized = transport === null || transport === void 0 ? void 0 : transport.toString().toLowerCase();
-    if (normalized === TransportEnum.SSE)
-        return TransportEnum.SSE;
-    if (normalized === TransportEnum.WEBSOCKET)
-        return TransportEnum.WEBSOCKET;
-    return TransportEnum.STREAMABLE_HTTP;
-};
-/**
- * Finds the active MCP server connection for a given server, accounting for scope rules.
- * - tenant scope: any connection for this server ID means connected
- * - user scope: connection must match the current user
- * - mentor scope: connection must match the current mentor being edited
- */
-const findMCPServerConnection = (connections, serverId, currentUser, currentMentorId) => {
-    if (!(connections === null || connections === void 0 ? void 0 : connections.length))
-        return null;
-    const active = connections.filter((c) => c.server === serverId && c.is_active);
-    for (const conn of active) {
-        if (conn.scope === 'tenant')
-            return conn;
-        if (conn.scope === 'user' && conn.user === currentUser)
-            return conn;
-        if (conn.scope === 'mentor' && conn.mentor === currentMentorId)
-            return conn;
-    }
-    return null;
-};
-// Helper to create FormData for MCP server
-const createMCPServerFormData = (data) => {
-    var _a;
-    const formData = new FormData();
-    formData.append('name', data.name);
-    formData.append('url', data.url);
-    formData.append('transport', data.transport);
-    if (data.description)
-        formData.append('description', data.description);
-    if (data.auth_type)
-        formData.append('auth_type', data.auth_type);
-    if (data.auth_scope)
-        formData.append('auth_scope', data.auth_scope);
-    if (data.credentials)
-        formData.append('credentials', data.credentials);
-    if (data.image)
-        formData.append('image', data.image);
-    if (data.mentor !== undefined)
-        formData.append('mentor', (_a = data.mentor) !== null && _a !== void 0 ? _a : '');
-    return formData;
-};
-// Helper to validate and create OAuth connection
-const createOAuthConnection = async (params, onSuccess, onError) => {
-    var _a;
-    const { connectedServiceId, isCreatingConnection, createMCPServerConnection, tenantKey, username, serverId, authScope, mentorId, oauthDisplayName, refetchFeatured, refetchMy, refetchConnected, refetchMCPServerConnections, refetchMentorSettings, } = params;
-    if (isCreatingConnection || !connectedServiceId || !Number.isFinite(connectedServiceId)) {
-        return false;
-    }
-    const scope = authScope || 'user';
-    try {
-        await createMCPServerConnection({
-            org: tenantKey,
-            userId: username,
-            server: serverId,
-            scope,
-            auth_type: 'oauth2',
-            ...(scope !== 'mentor' ? { user: username } : {}),
-            connected_service: connectedServiceId,
-            ...(scope === 'mentor' && mentorId ? { mentor: mentorId } : {}),
-        }).unwrap();
-        await Promise.all([
-            refetchFeatured(),
-            refetchMy(),
-            refetchConnected(),
-            refetchMCPServerConnections(),
-            refetchMentorSettings(),
-        ]);
-        toast.success(`${oauthDisplayName} connected successfully`);
-        onSuccess();
-        return true;
-    }
-    catch (error) {
-        const err = error;
-        toast.error(`Failed to create connection: ${((_a = err === null || err === void 0 ? void 0 : err.data) === null || _a === void 0 ? void 0 : _a.detail) || 'Unknown error'}`);
-        onError(error);
-        return false;
-    }
-};
-// Helper to process OAuth storage events
-const processOAuthStorageEvent = (event, expectedProvider, expectedServiceName) => {
-    if (event.key !== 'oauth_connection_complete') {
-        return null;
-    }
-    try {
-        const data = JSON.parse(event.newValue || '{}');
-        if (data.connectedServiceId) {
-            const isMatch = data.provider === expectedProvider && data.serviceName === expectedServiceName;
-            return { connectedServiceId: data.connectedServiceId, isMatch };
-        }
-    }
-    catch (_a) {
-        // Invalid JSON, return null to trigger fallback
-    }
-    return null;
-};
-// Helper to process OAuth message events
-const processOAuthMessageEvent = (event, expectedOrigin, expectedProvider, expectedServiceName) => {
-    var _a, _b;
-    if (event.origin !== expectedOrigin) {
-        return null;
-    }
-    if (((_a = event.data) === null || _a === void 0 ? void 0 : _a.type) === 'GOOGLE_AUTH_SUCCESS' && ((_b = event.data) === null || _b === void 0 ? void 0 : _b.connectedServiceId)) {
-        if (event.data.provider === expectedProvider &&
-            event.data.serviceName === expectedServiceName) {
-            return event.data.connectedServiceId;
-        }
-    }
-    return null;
-};
-// Helper to check if OAuth connection is complete
-const checkOAuthConnectionComplete = async (refetchConnected, provider, serviceName) => {
-    try {
-        const updated = await refetchConnected();
-        if (updated === null || updated === void 0 ? void 0 : updated.data) {
-            const connService = updated.data.find((cs) => cs.provider === provider && cs.service === serviceName);
-            if (connService === null || connService === void 0 ? void 0 : connService.id) {
-                return connService.id;
-            }
-        }
-    }
-    catch (_a) {
-        // Continue polling on error
-    }
-    return null;
-};
-// Helper to handle OAuth message event result and determine if connection should be created
-const handleOAuthMessageResult = (event, expectedOrigin, expectedProvider, expectedServiceName) => {
-    const connectedServiceId = processOAuthMessageEvent(event, expectedOrigin, expectedProvider, expectedServiceName);
-    return {
-        shouldCreate: connectedServiceId !== null && connectedServiceId > 0,
-        connectedServiceId,
-    };
-};
-const validateDisconnectOAuthParams = (tenantKey, username, connectedServiceId) => {
-    if (!tenantKey || !username) {
-        return {
-            isValid: false,
-            error: 'Missing required parameters',
-            connectedServiceId: null,
-        };
-    }
-    if (!connectedServiceId) {
-        return {
-            isValid: false,
-            error: 'No connected service to disconnect',
-            connectedServiceId: null,
-        };
-    }
-    return {
-        isValid: true,
-        error: null,
-        connectedServiceId,
-    };
-};
-// Determines the action to take in checkConnection based on the current state
-const determineCheckConnectionAction = (isCreatingConnection, connectedServiceId, createConnectionSuccess, pollCount, maxPolls) => {
-    if (isCreatingConnection) {
-        return { action: 'skip', connectedServiceId: null };
-    }
-    if (pollCount >= maxPolls) {
-        return { action: 'max_polls_cleanup', connectedServiceId: null };
-    }
-    return { action: 'continue_polling', connectedServiceId };
-};
-// Determines the action to take after processing a message event
-const determineMessageEventAction = (shouldCreate, connectedServiceId) => {
-    if (shouldCreate && connectedServiceId) {
-        return { action: 'create_and_cleanup', connectedServiceId };
-    }
-    return { action: 'ignore', connectedServiceId: null };
-};
-// Helper to check if message event should trigger cleanup and create
-const shouldExecuteMessageAction = (actionResult) => {
-    return actionResult.action === 'create_and_cleanup' && actionResult.connectedServiceId !== null;
-};
-// Execute the check connection flow logic - returns what action was taken
-const executeCheckConnectionFlowLogic = (connectedServiceId, createConnectionSuccess, pollCount, maxPolls) => {
-    // Determine if we should create and cleanup
-    if (connectedServiceId && createConnectionSuccess) {
-        return {
-            executed: true,
-            action: 'create_and_cleanup',
-            connectedServiceId,
-        };
-    }
-    // Check if max polls reached
-    if (pollCount >= maxPolls) {
-        return {
-            executed: true,
-            action: 'max_polls_cleanup',
-            connectedServiceId: null,
-        };
-    }
-    return {
-        executed: false,
-        action: 'continue_polling',
-        connectedServiceId: null,
-    };
-};
-// Execute the message event flow logic - returns what action was taken
-const executeMessageEventFlowLogic = (event, expectedOrigin, expectedProvider, expectedServiceName) => {
-    const { shouldCreate, connectedServiceId } = handleOAuthMessageResult(event, expectedOrigin, expectedProvider, expectedServiceName);
-    const actionResult = determineMessageEventAction(shouldCreate, connectedServiceId);
-    if (shouldExecuteMessageAction(actionResult)) {
-        return {
-            executed: true,
-            action: 'create_and_cleanup',
-            connectedServiceId: actionResult.connectedServiceId,
-        };
-    }
-    return {
-        executed: false,
-        action: 'ignore',
-        connectedServiceId: null,
-    };
-};
-const executeHandleMessageCallback = async (params) => {
-    const flowResult = executeMessageEventFlowLogic(params.event, params.expectedOrigin, params.provider, params.serviceName);
-    if (flowResult.executed && flowResult.connectedServiceId) {
-        params.cleanup();
-        await params.doCreateConnection(flowResult.connectedServiceId);
-        return {
-            executed: true,
-            connectedServiceId: flowResult.connectedServiceId,
-        };
-    }
-    return { executed: false, connectedServiceId: null };
-};
-const executeMaxPollsCleanup = (params) => {
-    const maxPollsFlowResult = executeCheckConnectionFlowLogic(null, false, params.pollCount, params.maxPolls);
-    if (maxPollsFlowResult.executed) {
-        params.cleanup();
-        return true;
-    }
-    return false;
-};
-const executeConnectionFoundCleanup = async (params) => {
-    const success = await params.doCreateConnection(params.connectedServiceId);
-    const flowResult = executeCheckConnectionFlowLogic(params.connectedServiceId, success, params.pollCount, params.maxPolls);
-    if (flowResult.executed) {
-        params.cleanup();
-        return { cleaned: true, success };
-    }
-    return { cleaned: false, success };
-};
-function ConnectorManagementContent({ tenantKey, username, mentorId, rbacPermissions, onSelect, }) {
-    var _a, _b, _c;
+// The agent settings tabs' own sub-tab look (Settings, Memory, ...).
+const SUB_TAB_TRIGGER_CLASS = 'px-3 py-1.5 text-sm font-medium text-gray-700 data-[state=active]:bg-white data-[state=active]:text-gray-900';
+// A connector seeded from the MCP directory: the organization cannot edit or
+// delete it; the one thing an agent may change is how it signs in (guide §5.9).
+const isDirectoryServer = (server) => { var _a; return ((_a = server.registry) === null || _a === void 0 ? void 0 : _a.source) === 'registry'; };
+// Only a sign-in (OAuth) connector has a way of signing in to choose.
+const isOAuthServer = (server) => { var _a; return ((_a = server.auth_type) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'oauth2' && !!server.oauth_service_data; };
+// Featured and directory connectors cannot be edited by the organization:
+// Configure opens the form with only the settings for this agent enabled.
+const isLockedServer = (server) => !!server.is_featured || isDirectoryServer(server);
+function ConnectorManagementContent({ tenantKey, username, mentorId, rbacPermissions, enableRbac = false, onSelect, }) {
     const t = useT();
-    // Outside an agent-settings host (e.g. a standalone picker) there is no RBAC
-    // flag, so permissions are not enforced, as before.
-    const enableRBAC = (_b = (_a = useAgentSettingsOptional()) === null || _a === void 0 ? void 0 : _a.enableRBAC) !== null && _b !== void 0 ? _b : false;
     const itemsPerPage = 12;
-    // Filter state
     const [searchQuery, setSearchQuery] = useState('');
     const [dateRange, setDateRange] = useState(undefined);
     const [selectedTransport, setSelectedTransport] = useState('');
-    // Pagination state
+    const [section, setSection] = useState('featured');
     const [featuredPage, setFeaturedPage] = useState(1);
     const [myConnectorsPage, setMyConnectorsPage] = useState(1);
-    // Dialog state
     const [showAddConnectorDialog, setShowAddConnectorDialog] = useState(false);
-    const [deletingServerId, setDeletingServerId] = useState(null);
     const [connectorToDelete, setConnectorToDelete] = useState(null);
     const [editingServer, setEditingServer] = useState(null);
-    const [togglingServerIds, setTogglingServerIds] = useState(() => new Set());
-    const [connectingServiceIds, setConnectingServiceIds] = useState(() => new Set());
-    const [disconnectingServiceIds, setDisconnectingServiceIds] = useState(() => new Set());
-    // Use localStorage hook for pending OAuth server data
-    const [, setPendingOAuthServer, removePendingOAuthServer] = useLocalStorage('oauth_pending_server', null);
-    // Tracks in-flight OAuth cleanup callbacks so they fire on unmount, not just
-    // on successful completion / timeout / popup-closed paths inside
-    // `handleConnectOAuth`. Without this, navigating away mid-flow would leak
-    // the `storage` / `message` / `focus` window listeners until the 5-minute
-    // safety timer eventually fires.
-    const oauthCleanupsRef = useRef(new Set());
-    useEffect(() => () => {
-        oauthCleanupsRef.current.forEach((fn) => fn());
-        oauthCleanupsRef.current.clear();
-    }, []);
-    // Reset to first page when filters change
+    // A connector the organization cannot edit: the form opens with only its
+    // settings for this agent (and its sign-in app) enabled.
+    const [restricted, setRestricted] = useState(false);
+    const [openOnSignInApp, setOpenOnSignInApp] = useState(false);
+    const canSetUpOAuthApp = checkRbacPermission(rbacPermissions !== null && rbacPermissions !== void 0 ? rbacPermissions : {}, '/mcpservers/#create', enableRbac);
     useEffect(() => {
         setFeaturedPage(1);
         setMyConnectorsPage(1);
     }, [searchQuery, dateRange, selectedTransport]);
-    // Build query params
     const buildQueryParams = useCallback((page, isFeatured) => ({
         org: tenantKey,
         userId: username,
@@ -356,86 +75,235 @@ function ConnectorManagementContent({ tenantKey, username, mentorId, rbacPermiss
         ...(searchQuery && { search: searchQuery }),
         ...(selectedTransport && { transport: selectedTransport }),
     }), [tenantKey, username, mentorId, searchQuery, selectedTransport]);
-    // API hooks
     const { data: featuredServers, isLoading: isLoadingFeatured, error: featuredError, refetch: refetchFeatured, } = useGetMCPServersQuery(buildQueryParams(featuredPage, true), {
         skip: !tenantKey || !username,
     });
     const { data: myServers, isLoading: isLoadingMy, error: myError, refetch: refetchMy, } = useGetMCPServersQuery(buildQueryParams(myConnectorsPage, false), {
         skip: !tenantKey || !username,
     });
-    const { data: mentorSettings, refetch: refetchMentorSettings } = useGetMentorSettingsQuery({
-        mentor: mentorId,
-        org: tenantKey,
-        // @ts-expect-error userId is not part of useGetMentorSettingsQuery Query definition
-        userId: username,
-    }, { skip: !username });
-    const { refetch: refetchConnected } = useGetConnectedServicesQuery({ org: tenantKey, userId: username }, { skip: !tenantKey || !username });
-    const { data: mcpServerConnections, refetch: refetchMCPServerConnections } = useGetMCPServerConnectionsQuery({ org: tenantKey, userId: username }, { skip: !tenantKey || !username });
-    // Mutations
-    const [createMCPServer] = useCreateMCPServerMutation();
-    const [updateMCPServer] = useUpdateMCPServerMutation();
-    const [deleteMCPServer] = useDeleteMCPServerMutation();
-    const [editMentorJson] = useEditMentorJsonMutation();
-    const [startOAuthFlow] = useLazyStartOAuthFlowQuery();
-    const [disconnectService] = useDisconnectServiceMutation();
-    const [createMCPServerConnection] = useCreateMCPServerConnectionMutation();
-    // Get active MCP server IDs from mentor settings
-    const activeMcpServerIds = useMemo(() => {
-        if (!mentorSettings || typeof mentorSettings !== 'object')
-            return [];
-        const maybeServers = mentorSettings.mcp_servers;
-        if (!Array.isArray(maybeServers))
-            return [];
-        return maybeServers
-            .map((entry) => {
-            if (typeof entry === 'number' && Number.isFinite(entry))
-                return entry;
-            if (typeof entry === 'object' && entry !== null && 'id' in entry) {
-                const id = entry.id;
-                if (typeof id === 'number')
-                    return id;
+    const refetchServers = useCallback(() => Promise.all([refetchFeatured(), refetchMy()]), [refetchFeatured, refetchMy]);
+    const serverDisplayName = useCallback((server) => {
+        var _a;
+        return server.name ||
+            ((_a = server.oauth_service_data) === null || _a === void 0 ? void 0 : _a.display_name) ||
+            t('mcpTabConnectorManagementContent.unknownConnector');
+    }, [t]);
+    const { activeMcpServerIds, fieldPermissions, attachmentsKnown, isOAuthServerConnected, hasConnectionForScope, refetchMCPServerConnections, getConnectedServiceId, getSignedInServiceId, ownsConnectedService, getConnectionId, handleToggleConnector, saveConnector, deleteServer, deletingServerId, handleConnectOAuth, handleDisconnectOAuth, refetchAfterOAuth: handleOAuthComplete, togglingServerIds, connectingServiceIds, disconnectingServiceIds, } = useMcpServerActions({
+        tenantKey,
+        username,
+        mentorId,
+        refetchServers,
+        softUserScopeConnectFailure: true,
+        // No sign-in app for this organization yet: open the setup dialog for
+        // whoever may add connectors, instead of the error.
+        onConnectNotConfigured: (server) => {
+            var _a, _b, _c;
+            // Said the same way as in the chat panel, for whoever cannot set it up.
+            if (!canSetUpOAuthApp) {
+                toast.info(t('mcpServersMenu.notSetUp', { name: serverDisplayName(server) }));
+                return true;
             }
-            return null;
-        })
-            .filter((id) => typeof id === 'number' && Number.isFinite(id));
-    }, [mentorSettings]);
-    // Get current tool_slugs from mentor_tools in mentor settings
-    // mentor_tools is an array of objects like: [{ name: "MCP", slug: "mcp", ... }]
-    const currentToolSlugs = useMemo(() => {
-        if (!mentorSettings || typeof mentorSettings !== 'object')
-            return [];
-        const maybeTools = mentorSettings.mentor_tools;
-        if (!Array.isArray(maybeTools))
-            return [];
-        return maybeTools
-            .map((tool) => {
-            if (typeof tool === 'object' && tool !== null && 'slug' in tool) {
-                const slug = tool.slug;
-                if (typeof slug === 'string')
-                    return slug;
+            const canEdit = (_c = (_b = (_a = server.permissions) === null || _a === void 0 ? void 0 : _a.object) === null || _b === void 0 ? void 0 : _b.write) !== null && _c !== void 0 ? _c : !enableRbac;
+            setRestricted(isLockedServer(server) || !canEdit);
+            setOpenOnSignInApp(true);
+            // Connect passes the server already carrying the choice in force for this
+            // agent, so the form opens on it.
+            setEditingServer(server);
+            setShowAddConnectorDialog(true);
+            return true;
+        },
+    });
+    const canManage = canManageMcpServers({ attachmentsKnown, fieldPermissions, enableRbac });
+    // A sign-in choice made in the form is saved at once for a connector the agent
+    // uses; otherwise it is kept and stored when the connector is turned on. The
+    // choice shown stays the chosen one until the list reflects it.
+    const chosenScopes = useRef(new Map());
+    const pendingScopes = useRef(new Map());
+    const [setMentorAuthScope] = useSetMCPServerMentorAuthScopeMutation();
+    const [patchServer] = usePartialUpdateMCPServerMutation();
+    // Only for a server as the list has it: on a copy that already carries the
+    // choice it would drop a kept choice the list never got.
+    const shownScope = useCallback((server) => {
+        const listed = currentSignInScope(server);
+        const chosen = chosenScopes.current.get(server.id);
+        if (chosen === undefined)
+            return listed;
+        // The list now reflects the choice: from here on the list is the source.
+        if (chosen === listed)
+            chosenScopes.current.delete(server.id);
+        return chosen;
+    }, []);
+    // Unlike shownScope, never settles a kept choice against `server`, so it is
+    // safe on a copy that already carries the choice.
+    const scopeInForce = useCallback((server) => { var _a; return (_a = chosenScopes.current.get(server.id)) !== null && _a !== void 0 ? _a : currentSignInScope(server); }, []);
+    const storeScope = useCallback(async (server, scope) => {
+        await setMentorAuthScope({
+            org: tenantKey,
+            userId: username,
+            id: server.id,
+            mentor: mentorId,
+            // The connector's own scope is stored as "no override".
+            authScope: scope === (server.auth_scope || 'user') ? null : scope,
+        }).unwrap();
+        pendingScopes.current.delete(server.id);
+    }, [setMentorAuthScope, tenantKey, username, mentorId]);
+    // The form and a sign-in use the choice in force for this agent, kept ones included.
+    const withShownScope = useCallback((server) => isOAuthServer(server) ? { ...server, effective_auth_scope: shownScope(server) } : server, [shownScope]);
+    const openEdit = useCallback((server, restrictedEdit) => {
+        setRestricted(restrictedEdit);
+        setEditingServer(withShownScope(server));
+        setShowAddConnectorDialog(true);
+    }, [withShownScope]);
+    // The organization edited the connector's own scope, so the agent's override
+    // no longer applies; best-effort, like the connection patch.
+    const clearAgentScopeOverride = useCallback(async (server) => {
+        try {
+            await setMentorAuthScope({
+                org: tenantKey,
+                userId: username,
+                id: server.id,
+                mentor: mentorId,
+                authScope: null,
+            }).unwrap();
+        }
+        catch (_a) {
+            // The connector's own scope was saved; the override clears on the next edit.
+        }
+        chosenScopes.current.delete(server.id);
+        pendingScopes.current.delete(server.id);
+    }, [setMentorAuthScope, tenantKey, username, mentorId]);
+    // A connector that signs in once for everyone (agent or organization) and has
+    // no such sign-in yet: turning it on also opens that sign-in.
+    const needsSharedSignIn = useCallback((server) => {
+        const scope = shownScope(server);
+        return isOAuthServer(server) && scope !== 'user' && !hasConnectionForScope(server.id, scope);
+    }, [shownScope, hasConnectionForScope]);
+    // Turning on also stores a sign-in choice made while the connector was off.
+    const turnOn = useCallback(async (server) => {
+        const name = serverDisplayName(server);
+        const attached = await handleToggleConnector(server.id, name, true);
+        if (!attached)
+            return;
+        const pending = pendingScopes.current.get(server.id);
+        if (pending === undefined)
+            return;
+        try {
+            await storeScope(server, pending);
+        }
+        catch (_a) {
+            toast.error(t('mcpTabConnectorManagementContent.saveFailed', { name }));
+        }
+    }, [serverDisplayName, handleToggleConnector, storeScope, t]);
+    // The sign-in starts in the same click, so its tab opens at once.
+    const turnOnAndSignIn = useCallback((server) => {
+        if (needsSharedSignIn(server))
+            void handleConnectOAuth(withShownScope(server));
+        return turnOn(server);
+    }, [needsSharedSignIn, handleConnectOAuth, withShownScope, turnOn]);
+    const requestToggle = useCallback((server, checked) => {
+        if (checked)
+            void turnOnAndSignIn(server);
+        else
+            void handleToggleConnector(server.id, serverDisplayName(server), false);
+    }, [turnOnAndSignIn, handleToggleConnector, serverDisplayName]);
+    // Picking closes the workflow editor's connector panel, and with it a sign-in
+    // still open in its tab, so a connector waiting for one is picked once it lands.
+    const pendingSelectRef = useRef(null);
+    const selectConnector = useCallback(async (server) => {
+        if (activeMcpServerIds.includes(server.id)) {
+            onSelect === null || onSelect === void 0 ? void 0 : onSelect(server);
+            return;
+        }
+        const waitsForSignIn = needsSharedSignIn(server);
+        if (waitsForSignIn)
+            pendingSelectRef.current = { server, scope: shownScope(server) };
+        await turnOnAndSignIn(server);
+        if (!waitsForSignIn)
+            onSelect === null || onSelect === void 0 ? void 0 : onSelect(server);
+    }, [activeMcpServerIds, needsSharedSignIn, shownScope, turnOnAndSignIn, onSelect]);
+    useEffect(() => {
+        const pending = pendingSelectRef.current;
+        if (!pending)
+            return;
+        if (hasConnectionForScope(pending.server.id, pending.scope)) {
+            pendingSelectRef.current = null;
+            onSelect === null || onSelect === void 0 ? void 0 : onSelect(pending.server);
+            return;
+        }
+        // The sign-in ended without a connection (tab closed, refused): nothing to pick.
+        if (!connectingServiceIds.has(`server-${pending.server.id}`))
+            pendingSelectRef.current = null;
+    }, [connectingServiceIds, hasConnectionForScope, onSelect]);
+    // A connector edited to sign in for everyone, while on for this agent with no
+    // such sign-in yet, goes off by itself until it is turned on again.
+    const handleAuthScopeChanged = useCallback(async (server, authScope) => {
+        if (authScope === 'user' || !activeMcpServerIds.includes(server.id))
+            return;
+        const { data } = await refetchMCPServerConnections();
+        if (connectionForScopeExists(data === null || data === void 0 ? void 0 : data.results, server.id, authScope, username, mentorId))
+            return;
+        const name = serverDisplayName(server);
+        await handleToggleConnector(server.id, name, false, { quiet: true });
+        toast.info(t('mcpTabConnectorManagementContent.turnedOffUntilConnected', { name }));
+    }, [
+        activeMcpServerIds,
+        refetchMCPServerConnections,
+        username,
+        mentorId,
+        serverDisplayName,
+        handleToggleConnector,
+        t,
+    ]);
+    // The settings for this agent of a connector the organization cannot edit,
+    // saved from the form's restricted mode. The failure is said here and
+    // rethrown, so the form stays open.
+    const handleRestrictedSave = useCallback(async (server, { scope, userCanDisable }) => {
+        const name = serverDisplayName(server);
+        const attached = activeMcpServerIds.includes(server.id);
+        const scopeChanged = isOAuthServer(server) && scope !== scopeInForce(server);
+        const disableChanged = userCanDisable !== (server.user_can_disable !== false);
+        try {
+            // First, since the organization may be refused it for a featured or
+            // directory connector: nothing else is stored when it is.
+            if (disableChanged) {
+                await patchServer({
+                    id: server.id,
+                    org: tenantKey,
+                    userId: username,
+                    body: { user_can_disable: userCanDisable },
+                }).unwrap();
             }
-            return null;
-        })
-            .filter((slug) => typeof slug === 'string');
-    }, [mentorSettings]);
-    // Field-level permissions from mentor settings (for mcp_servers write check)
-    const fieldPermissions = (_c = mentorSettings === null || mentorSettings === void 0 ? void 0 : mentorSettings.permissions) === null || _c === void 0 ? void 0 : _c.field;
-    // OAuth helpers — use mcp-server-connections endpoint for scope-aware detection
-    const isOAuthServerConnected = useCallback((server) => {
-        const connection = findMCPServerConnection(mcpServerConnections === null || mcpServerConnections === void 0 ? void 0 : mcpServerConnections.results, server.id, username, mentorId);
-        return !!connection;
-    }, [mcpServerConnections, username, mentorId]);
-    const getConnectedServiceId = useCallback((server) => {
-        var _a;
-        const connection = findMCPServerConnection(mcpServerConnections === null || mcpServerConnections === void 0 ? void 0 : mcpServerConnections.results, server.id, username, mentorId);
-        return (_a = connection === null || connection === void 0 ? void 0 : connection.connected_service) !== null && _a !== void 0 ? _a : null;
-    }, [mcpServerConnections, username, mentorId]);
-    const getConnectionId = useCallback((server) => {
-        var _a;
-        const connection = findMCPServerConnection(mcpServerConnections === null || mcpServerConnections === void 0 ? void 0 : mcpServerConnections.results, server.id, username, mentorId);
-        return (_a = connection === null || connection === void 0 ? void 0 : connection.id) !== null && _a !== void 0 ? _a : null;
-    }, [mcpServerConnections, username, mentorId]);
-    // Filter servers by date range
+            if (scopeChanged) {
+                // The override can only be stored for a connector the agent uses.
+                if (attached)
+                    await storeScope(server, scope);
+                else
+                    pendingScopes.current.set(server.id, scope);
+                chosenScopes.current.set(server.id, scope);
+            }
+        }
+        catch (failure) {
+            // The API's prose stays out of the toast: a refused change has one sentence.
+            const status = failure === null || failure === void 0 ? void 0 : failure.status;
+            toast.error(status === 403 || status === 404
+                ? t('mcpTabConnectorManagementContent.cannotChangeSetting', { name })
+                : t('mcpTabConnectorManagementContent.saveFailed', { name }));
+            throw failure;
+        }
+        toast.success(t('mcpTabConnectorDialogs.connectorUpdatedSuccess'));
+        if (scopeChanged)
+            await handleAuthScopeChanged(server, scope);
+    }, [
+        serverDisplayName,
+        activeMcpServerIds,
+        scopeInForce,
+        patchServer,
+        tenantKey,
+        username,
+        storeScope,
+        t,
+        handleAuthScopeChanged,
+    ]);
     const filterByDate = useCallback((servers) => {
         if (!(dateRange === null || dateRange === void 0 ? void 0 : dateRange.from) || !(dateRange === null || dateRange === void 0 ? void 0 : dateRange.to))
             return servers;
@@ -445,7 +313,6 @@ function ConnectorManagementContent({ tenantKey, username, mentorId, rbacPermiss
             return created >= dateRange.from && created <= dateRange.to;
         });
     }, [dateRange]);
-    // Filtered servers
     const filteredFeaturedServers = useMemo(() => filterByDate((featuredServers === null || featuredServers === void 0 ? void 0 : featuredServers.results) || []), [featuredServers, filterByDate]);
     const featuredOAuthServers = useMemo(() => filteredFeaturedServers.filter((s) => {
         var _a;
@@ -469,600 +336,126 @@ function ConnectorManagementContent({ tenantKey, username, mentorId, rbacPermiss
     }, [myServers, filterByDate]);
     const featuredTotalPages = featuredServers ? Math.ceil(featuredServers.count / itemsPerPage) : 0;
     const myConnectorsTotalPages = myServers ? Math.ceil(myServers.count / itemsPerPage) : 0;
-    // Update MCP servers in mentor settings with optional tool_slugs and can_use_tools
-    const updateMCPServers = useCallback(async (serverIds, options) => {
-        if (!mentorId)
-            throw new Error('Invalid mentor ID');
-        const uniqueIds = [...new Set(serverIds.filter((id) => Number.isFinite(id) && id > 0))];
-        const requestBody = { mcp_servers: uniqueIds };
-        // Include tool_slugs if provided
-        if ((options === null || options === void 0 ? void 0 : options.toolSlugs) !== undefined) {
-            requestBody.tool_slugs = options.toolSlugs;
-        }
-        // Always set can_use_tools to true when enabling MCP connectors
-        if ((options === null || options === void 0 ? void 0 : options.canUseTools) !== undefined) {
-            requestBody.can_use_tools = options.canUseTools;
-        }
-        await editMentorJson({
-            mentorId,
-            org: tenantKey,
-            requestBody,
-            userId: username,
-        }).unwrap();
-    }, [mentorId, tenantKey, username, editMentorJson]);
-    // Handle toggle for activating/deactivating connectors
-    const handleToggleConnector = useCallback(async (serverId, serverName, isActive) => {
-        var _a, _b;
-        if (!Number.isFinite(serverId) || serverId <= 0) {
-            toast.error(t('mcpTabConnectorManagementContent.invalidServerId'));
-            return;
-        }
-        setTogglingServerIds((prev) => new Set(prev).add(serverId));
-        try {
-            const currentIds = Array.isArray(activeMcpServerIds) ? activeMcpServerIds : [];
-            const updatedIds = isActive
-                ? currentIds.includes(serverId)
-                    ? currentIds
-                    : [...currentIds, serverId]
-                : currentIds.filter((id) => id !== serverId);
-            /* istanbul ignore next -- @preserve optimization path, tested via toggle tests */
-            if (updatedIds.length === currentIds.length && isActive && currentIds.includes(serverId)) {
-                return; // Already in desired state
-            }
-            // Prepare options for tool_slugs and can_use_tools updates
-            const hasMcpInToolSlugs = currentToolSlugs.includes('mcp');
-            if (isActive) {
-                // When enabling a connector:
-                // - If tool_slugs doesn't have 'mcp', add it
-                // - Always set can_use_tools to true
-                if (!hasMcpInToolSlugs) {
-                    const updatedToolSlugs = [...currentToolSlugs, 'mcp'];
-                    await updateMCPServers(updatedIds, {
-                        toolSlugs: updatedToolSlugs,
-                        canUseTools: true,
-                    });
-                }
-                else {
-                    // mcp already in tool_slugs, just update mcp_servers and can_use_tools
-                    await updateMCPServers(updatedIds, {
-                        canUseTools: true,
-                    });
-                }
-            }
-            else {
-                // When disabling a connector:
-                // - If this is the last connector being disabled, remove 'mcp' from tool_slugs
-                const isLastConnector = updatedIds.length === 0;
-                if (isLastConnector && hasMcpInToolSlugs) {
-                    const updatedToolSlugs = currentToolSlugs.filter((slug) => slug !== 'mcp');
-                    await updateMCPServers(updatedIds, {
-                        toolSlugs: updatedToolSlugs,
-                        // Set can_use_tools based on whether there are other tools
-                        canUseTools: updatedToolSlugs.length > 0,
-                    });
-                }
-                else {
-                    // Not the last connector, just update mcp_servers
-                    await updateMCPServers(updatedIds);
-                }
-            }
-            await refetchMentorSettings();
-            toast.success(isActive
-                ? t('mcpTabConnectorManagementContent.serverActivated', { serverName })
-                : t('mcpTabConnectorManagementContent.serverDeactivated', { serverName }));
-        }
-        catch (error) {
-            const err = error;
-            const msg = ((_a = err === null || err === void 0 ? void 0 : err.data) === null || _a === void 0 ? void 0 : _a.detail) || ((_b = err === null || err === void 0 ? void 0 : err.data) === null || _b === void 0 ? void 0 : _b.error) || (err === null || err === void 0 ? void 0 : err.message) || '';
-            if (msg.includes('does not exist') || msg.includes('not accessible')) {
-                toast.error(t('mcpTabConnectorManagementContent.serverNotAccessible', { serverName }));
-            }
-            else {
-                toast.error(isActive
-                    ? t('mcpTabConnectorManagementContent.failedToActivate', { serverName, msg })
-                    : t('mcpTabConnectorManagementContent.failedToDeactivate', { serverName, msg }));
-            }
-        }
-        finally {
-            setTogglingServerIds((prev) => {
-                const next = new Set(prev);
-                next.delete(serverId);
-                return next;
-            });
-        }
-    }, [activeMcpServerIds, currentToolSlugs, updateMCPServers, refetchMentorSettings]);
-    // Handle add/edit connector
     const handleAddConnectorClick = useCallback(async (connector) => {
-        var _a, _b;
-        if (!tenantKey || !username) {
-            toast.error(t('mcpTabConnectorManagementContent.missingRequiredParams'));
-            return;
-        }
-        try {
-            const hasFileImage = connector.image instanceof File;
-            const trimmedCredentials = (_a = connector.credentials) === null || _a === void 0 ? void 0 : _a.trim();
-            const authType = (_b = connector.authType) !== null && _b !== void 0 ? _b : (trimmedCredentials ? 'token' : 'none');
-            const resolvedTransport = normalizeTransportValue(connector.transport);
-            const basePayload = {
-                name: connector.name,
-                url: connector.url || `https://api.${connector.name.toLowerCase()}.com/mcp`,
-                transport: resolvedTransport,
-                auth_type: authType,
-                description: connector.description || '',
-                // Only include credentials if provided (for edits, undefined means keep existing)
-                ...(trimmedCredentials !== undefined && {
-                    credentials: trimmedCredentials,
-                }),
-                ...(connector.authScope && { auth_scope: connector.authScope }),
-                ...(connector.mentor !== undefined && { mentor: connector.mentor }),
-            };
-            /* istanbul ignore next -- @preserve update path tested via ConnectorDialogs integration */
-            if (editingServer) {
-                // Update existing server
-                const args = {
-                    id: editingServer.id,
-                    org: tenantKey,
-                    userId: username,
-                    ...(hasFileImage
-                        ? {
-                            formData: createMCPServerFormData({
-                                ...basePayload,
-                                image: connector.image,
-                            }),
-                        }
-                        : { body: basePayload }),
-                };
-                await updateMCPServer(args).unwrap();
-                toast.success(t('mcpTabConnectorManagementContent.connectorUpdated', { name: connector.name }));
-            }
-            else {
-                // Create new server
-                const args = {
-                    org: tenantKey,
-                    userId: username,
-                    ...(hasFileImage
-                        ? {
-                            formData: createMCPServerFormData({
-                                ...basePayload,
-                                image: connector.image,
-                            }),
-                        }
-                        : { body: basePayload }),
-                };
-                const newServer = await createMCPServer(args).unwrap();
-                toast.success(t('mcpTabConnectorManagementContent.connectorAdded', { name: connector.name }));
-                // Auto-activate new connector
-                try {
-                    const newId = Number(newServer.id);
-                    if (Number.isFinite(newId)) {
-                        const updatedIds = [...activeMcpServerIds, newId];
-                        const hasMcpInToolSlugs = currentToolSlugs.includes('mcp');
-                        // When auto-activating, also add 'mcp' to tool_slugs if not present
-                        if (!hasMcpInToolSlugs) {
-                            const updatedToolSlugs = [...currentToolSlugs, 'mcp'];
-                            await updateMCPServers(updatedIds, {
-                                toolSlugs: updatedToolSlugs,
-                                canUseTools: true,
-                            });
-                        }
-                        else {
-                            await updateMCPServers(updatedIds, {
-                                canUseTools: true,
-                            });
-                        }
-                        await refetchMentorSettings();
-                    }
-                }
-                catch (_c) {
-                    toast.warning(t('mcpTabConnectorManagementContent.connectorNotActivated', { name: connector.name }));
-                }
-            }
-            setShowAddConnectorDialog(false);
-            setEditingServer(null);
-            await Promise.all([refetchFeatured(), refetchMy()]);
-        }
-        catch (_d) {
-            toast.error(editingServer
-                ? t('mcpTabConnectorManagementContent.failedToUpdateConnector', {
-                    name: connector.name,
-                })
-                : t('mcpTabConnectorManagementContent.failedToAddConnector', { name: connector.name }));
-        }
-    }, [
-        tenantKey,
-        username,
-        editingServer,
-        activeMcpServerIds,
-        currentToolSlugs,
-        createMCPServer,
-        updateMCPServer,
-        updateMCPServers,
-        refetchFeatured,
-        refetchMy,
-        refetchMentorSettings,
-    ]);
-    // Handle delete connector
+        await saveConnector(connector, {
+            editingServer,
+            onSaved: () => {
+                setShowAddConnectorDialog(false);
+                setEditingServer(null);
+            },
+        });
+    }, [saveConnector, editingServer]);
     const handleDeleteConnector = useCallback(async (serverId, serverName) => {
-        if (!tenantKey || !username) {
-            toast.error(t('mcpTabConnectorManagementContent.missingRequiredParams'));
-            return;
-        }
-        setDeletingServerId(serverId);
-        try {
-            await deleteMCPServer({
-                id: serverId,
-                org: tenantKey,
-                userId: username,
-            }).unwrap();
-            toast.success(t('mcpTabConnectorManagementContent.connectorRemoved', { serverName }));
-            await Promise.all([refetchFeatured(), refetchMy()]);
-            try {
-                const updatedIds = activeMcpServerIds.filter((id) => id !== serverId);
-                await updateMCPServers(updatedIds);
-                await refetchMentorSettings();
-            }
-            catch (_a) {
-                toast.warning(t('mcpTabConnectorManagementContent.connectorDeletedStillActive', { serverName }));
-            }
-        }
-        catch (_b) {
-            toast.error(t('mcpTabConnectorManagementContent.failedToRemoveConnector', { serverName }));
-        }
-        finally {
-            setDeletingServerId(null);
-            setConnectorToDelete(null);
-        }
-    }, [
-        tenantKey,
-        username,
-        activeMcpServerIds,
-        deleteMCPServer,
-        updateMCPServers,
-        refetchFeatured,
-        refetchMy,
-        refetchMentorSettings,
-    ]);
-    // Handle OAuth connect
-    const handleConnectOAuth = useCallback(async (server) => {
-        if (!tenantKey || !username || !server.oauth_service_data) {
-            toast.error(t('mcpTabConnectorManagementContent.missingOAuthParams'));
-            return;
-        }
-        const oauthData = server.oauth_service_data;
-        const { oauth_provider: provider, name } = oauthData;
-        const serverId = server.id;
-        const serviceKey = `server-${serverId}`;
-        const oauthDisplayName = oauthData.display_name || name;
-        setPendingOAuthServer({
-            serverId,
-            provider,
-            service: name,
-            timestamp: Date.now(),
+        await deleteServer(serverId, serverName);
+        setConnectorToDelete(null);
+    }, [deleteServer]);
+    // Read as is: `editingServer` already carries the scope in force (openEdit),
+    // and shownScope on such a copy would settle a kept choice against itself.
+    const describeConnection = (server) => {
+        const { isConnected, showConnect, showDisconnect, disconnectOptions } = getMcpConnectionState(server, {
+            canManage,
+            attachmentsKnown,
+            activeMcpServerIds,
+            isOAuthServerConnected,
+            getConnectedServiceId,
+            getSignedInServiceId,
+            ownsConnectedService,
         });
-        setConnectingServiceIds((prev) => new Set(prev).add(serviceKey));
-        // State the cleanup closure references. Declared before the first
-        // `await` so we can register cleanup synchronously — guaranteeing an
-        // unmount mid-flow tears down listeners, intervals, and timers.
-        let pollCount = 0;
-        const maxPolls = 60;
-        let pollInterval = null;
-        let popupCheckInterval = null;
-        let isCreatingConnection = false;
-        // Listener handlers — reassigned with real implementations once the
-        // OAuth URL resolves. Default noops let cleanup safely call
-        // removeEventListener even if we never reached addEventListener (e.g.
-        // unmount before startOAuthFlow resolves).
-        let handleFocus = () => { };
-        let handleStorageChange = () => { };
-        let handleMessage = () => { };
-        // Cleanup function to remove listeners and reset state. Idempotent —
-        // tracked in `oauthCleanupsRef` so component unmount can also drive it.
-        let cleanedUp = false;
-        const cleanup = () => {
-            if (cleanedUp)
-                return;
-            cleanedUp = true;
-            oauthCleanupsRef.current.delete(cleanup);
-            if (pollInterval)
-                clearInterval(pollInterval);
-            if (popupCheckInterval)
-                clearInterval(popupCheckInterval);
-            window.removeEventListener('focus', handleFocus);
-            window.removeEventListener('storage', handleStorageChange);
-            window.removeEventListener('message', handleMessage);
-            setConnectingServiceIds((prev) => {
-                const next = new Set(prev);
-                next.delete(serviceKey);
-                return next;
-            });
-            removePendingOAuthServer();
-            isCreatingConnection = false;
+        return {
+            connected: isConnected,
+            canConnect: showConnect,
+            canDisconnect: showDisconnect,
+            connecting: connectingServiceIds.has(`server-${server.id}`),
+            disconnecting: disconnectingServiceIds.has(server.id),
+            onConnect: () => void handleConnectOAuth(server),
+            onDisconnect: () => void handleDisconnectOAuth(server, disconnectOptions),
         };
-        oauthCleanupsRef.current.add(cleanup);
-        try {
-            const result = await startOAuthFlow({
-                org: tenantKey,
-                userId: username,
-                provider,
-                service: name,
-            }).unwrap();
-            if (!result.auth_url)
-                throw new Error('No authorization URL returned');
-            // Bail if the flow was already torn down while we awaited the auth URL
-            // (e.g. the component unmounted). `cleanup` has run and been dropped
-            // from `oauthCleanupsRef`, so anything registered past this point —
-            // listeners, intervals, timers — would leak with nothing left to
-            // remove it.
-            if (cleanedUp)
-                return;
-            const popup = window.open(result.auth_url, '_blank');
-            // Create connection using helper function
-            const doCreateConnection = async (connectedServiceId) => {
-                const result = await createOAuthConnection({
-                    connectedServiceId,
-                    isCreatingConnection,
-                    createMCPServerConnection,
-                    tenantKey,
-                    username,
-                    serverId,
-                    authScope: server.auth_scope,
-                    mentorId,
-                    oauthDisplayName,
-                    refetchFeatured,
-                    refetchMy,
-                    refetchConnected,
-                    refetchMCPServerConnections,
-                    refetchMentorSettings,
-                }, 
-                /* istanbul ignore next -- @preserve success callback, tested via createOAuthConnection */
-                () => {
-                    isCreatingConnection = false;
-                }, 
-                /* istanbul ignore next -- @preserve error callback, tested via createOAuthConnection */
-                () => {
-                    isCreatingConnection = false;
-                });
-                if (result) {
-                    isCreatingConnection = true;
-                }
-                return result;
-            };
-            // Check for OAuth connection using helper
-            const checkConnection = async () => {
-                // Early check using helper
-                const earlyCheck = determineCheckConnectionAction(isCreatingConnection, null, false, pollCount, maxPolls);
-                if (earlyCheck.action === 'skip')
-                    return;
-                try {
-                    const connectedServiceId = await checkOAuthConnectionComplete(refetchConnected, provider, name);
-                    // If we found a connected service, try to create connection using helper
-                    // Logic tested via executeConnectionFoundCleanup unit tests
-                    /* istanbul ignore next -- @preserve callback wrapper, logic tested via helper */
-                    if (connectedServiceId) {
-                        const result = await executeConnectionFoundCleanup({
-                            connectedServiceId,
-                            doCreateConnection,
-                            pollCount,
-                            maxPolls,
-                            cleanup,
-                        });
-                        if (result.cleaned) {
-                            return;
-                        }
-                    }
-                    await Promise.all([refetchFeatured(), refetchMy()]);
-                    pollCount++;
-                    // Check if max polls reached using extracted helper function
-                    executeMaxPollsCleanup({ pollCount, maxPolls, cleanup });
-                }
-                catch (_a) {
-                    // Continue polling
-                }
-            };
-            handleFocus = () => checkConnection();
-            // Handle OAuth message events using extracted helper function
-            // Logic tested via executeHandleMessageCallback unit tests
-            /* istanbul ignore next -- @preserve callback wrapper, logic tested via helper */
-            handleMessage = async (event) => {
-                await executeHandleMessageCallback({
-                    event,
-                    expectedOrigin: window.location.origin,
-                    provider,
-                    serviceName: name,
-                    cleanup,
-                    doCreateConnection,
-                });
-            };
-            // Handle OAuth storage events using helper
-            handleStorageChange = async (e) => {
-                const result = processOAuthStorageEvent(e, provider, name);
-                if (result) {
-                    if (result.isMatch) {
-                        cleanup();
-                        await doCreateConnection(result.connectedServiceId);
-                    }
-                    else {
-                        await checkConnection();
-                    }
-                }
-                else if (e.key === 'oauth_connection_complete') {
-                    /* istanbul ignore next */ // Fallback for parse errors or missing data
-                    await checkConnection();
-                }
-            };
-            window.addEventListener('storage', handleStorageChange);
-            window.addEventListener('message', handleMessage);
-            window.addEventListener('focus', handleFocus);
-            pollInterval = setInterval(checkConnection, 5000);
-            setTimeout(cleanup, 5 * 60 * 1000);
-            // Detect if user closed the OAuth popup without completing
-            if (popup) {
-                popupCheckInterval = setInterval(() => {
-                    if (popup.closed) {
-                        if (popupCheckInterval)
-                            clearInterval(popupCheckInterval);
-                        popupCheckInterval = null;
-                        // Grace period for OAuth callback/redirect to complete
-                        setTimeout(() => {
-                            if (!isCreatingConnection) {
-                                cleanup();
-                            }
-                        }, 10000);
-                    }
-                }, 2000);
-            }
-        } /* istanbul ignore next */
-        catch (_a) {
-            toast.error(t('mcpTabConnectorManagementContent.failedToConnect', {
-                name: oauthData.display_name || name,
-            }));
-            setConnectingServiceIds((prev) => {
-                const next = new Set(prev);
-                next.delete(serviceKey);
-                return next;
-            });
-            removePendingOAuthServer();
-        }
-    }, [
-        tenantKey,
-        username,
-        startOAuthFlow,
-        createMCPServerConnection,
-        refetchFeatured,
-        refetchMy,
-        refetchConnected,
-        refetchMCPServerConnections,
-        refetchMentorSettings,
-        mentorId,
-        setPendingOAuthServer,
-        removePendingOAuthServer,
-    ]);
-    // Handle OAuth disconnect
-    const handleDisconnectOAuth = useCallback(async (server) => {
-        const serverConnectedServiceId = getConnectedServiceId(server);
-        const validation = validateDisconnectOAuthParams(tenantKey, username, serverConnectedServiceId);
-        /* istanbul ignore next -- @preserve validation error branch */
-        if (!validation.isValid) {
-            toast.error(validation.error || 'Validation failed');
-            return;
-        }
-        const connectedServiceId = validation.connectedServiceId;
-        setDisconnectingServiceIds((prev) => new Set(prev).add(server.id));
-        try {
-            const updatedIds = activeMcpServerIds.filter((id) => id !== server.id);
-            await updateMCPServers(updatedIds);
-            await disconnectService({
-                org: tenantKey,
-                userId: username,
-                id: connectedServiceId,
-            }).unwrap();
-            await Promise.all([
-                refetchFeatured(),
-                refetchMy(),
-                refetchConnected(),
-                refetchMCPServerConnections(),
-                refetchMentorSettings(),
-            ]);
-            toast.success(t('mcpTabConnectorManagementContent.serviceDisconnected'));
-        }
-        catch (_a) {
-            toast.error(t('mcpTabConnectorManagementContent.failedToDisconnect'));
-        }
-        finally {
-            setDisconnectingServiceIds((prev) => {
-                const next = new Set(prev);
-                next.delete(server.id);
-                return next;
-            });
-        }
-    }, [
-        tenantKey,
-        username,
-        activeMcpServerIds,
-        getConnectedServiceId,
-        updateMCPServers,
-        disconnectService,
-        refetchFeatured,
-        refetchMy,
-        refetchConnected,
-        refetchMCPServerConnections,
-        refetchMentorSettings,
-    ]);
-    // Handle OAuth completion from ConnectorDialogs
-    const handleOAuthComplete = useCallback(async () => {
-        await Promise.all([
-            refetchFeatured(),
-            refetchMy(),
-            refetchMCPServerConnections(),
-            refetchMentorSettings(),
-        ]);
-    }, [refetchFeatured, refetchMy, refetchMCPServerConnections, refetchMentorSettings]);
-    // Render server card
+    };
+    const editingConnection = editingServer ? describeConnection(editingServer) : null;
+    // Read-only: the Authentication Scope in force for this agent, changed in Configure.
+    const renderScopePill = (server, displayName) => {
+        const scope = shownScope(server);
+        const ScopeIcon = scope === 'platform' ? Building2 : scope === 'mentor' ? Bot : UserRound;
+        const scopeName = t(scope === 'platform'
+            ? 'mcpTabConnectorManagementContent.scopeTenant'
+            : scope === 'mentor'
+                ? 'mcpTabConnectorManagementContent.scopeAgent'
+                : 'mcpTabConnectorManagementContent.scopeUser');
+        const scopeHint = t(scope === 'platform'
+            ? 'mcpTabConnectorManagementContent.scopeHintOrganization'
+            : scope === 'mentor'
+                ? 'mcpTabConnectorManagementContent.scopeHintAgent'
+                : 'mcpTabConnectorManagementContent.scopeHintUser', { name: displayName });
+        const scopeLabel = t('mcpTabConnectorDialogs.authScopeLabel');
+        return (jsx(TooltipProvider, { delayDuration: 200, children: jsxs(Tooltip, { children: [jsx(TooltipTrigger, { asChild: true, children: jsxs("span", { tabIndex: 0, "data-testid": `mcp-connector-scope-${server.id}`, className: "inline-flex cursor-default items-center gap-1 rounded bg-gray-100 px-2 py-0.5 text-xs text-gray-600", children: [jsxs("span", { className: "sr-only", children: [scopeLabel, ": "] }), jsx(ScopeIcon, { className: "h-3 w-3", "aria-hidden": "true" }), scopeName] }) }), jsxs(TooltipContent, { className: "ibl-tooltip-content z-50 max-w-[300px]", children: [jsx("p", { className: "font-medium", children: scopeLabel }), jsx("p", { children: scopeHint })] })] }) }));
+    };
+    const renderIconAction = ({ label, icon: Icon, testId, onClick, disabled, className, }) => (jsx(TooltipProvider, { delayDuration: 200, children: jsxs(Tooltip, { children: [jsx(TooltipTrigger, { asChild: true, children: jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": label, "data-testid": testId, className: cn('h-8 w-8 text-gray-500', className), onClick: onClick, disabled: disabled, children: jsx(Icon, { className: "h-4 w-4", "aria-hidden": "true" }) }) }), jsx(TooltipContent, { className: "ibl-tooltip-content z-50", children: label })] }) }));
     const renderServerCard = (server, isFeatured) => {
         var _a, _b, _c, _d, _e, _f, _g;
         const oauthData = server.oauth_service_data;
-        const displayName = server.name ||
-            (oauthData === null || oauthData === void 0 ? void 0 : oauthData.display_name) ||
-            t('mcpTabConnectorManagementContent.unknownConnector');
-        const authType = (_a = server.auth_type) === null || _a === void 0 ? void 0 : _a.toLowerCase();
-        const isOAuth2 = authType === 'oauth2';
-        const isToken = authType === 'token';
-        const isConnected = isOAuth2 && isOAuthServerConnected(server);
-        const connectedServiceId = getConnectedServiceId(server);
-        const serviceKey = `server-${server.id}`;
-        const isConnecting = connectingServiceIds.has(serviceKey);
-        const isDisconnecting = disconnectingServiceIds.has(server.id);
+        const displayName = serverDisplayName(server);
         const isActive = activeMcpServerIds.includes(server.id);
-        // Only OAuth2 needs connection flow - token auth works without connection
-        const needsOAuthConnection = isOAuth2 && !isConnected;
+        const locked = isFeatured || isLockedServer(server);
+        const description = (oauthData === null || oauthData === void 0 ? void 0 : oauthData.description) || server.description || server.url;
         const objectPermissions = {
-            write: (_d = (_c = (_b = server.permissions) === null || _b === void 0 ? void 0 : _b.object) === null || _c === void 0 ? void 0 : _c.write) !== null && _d !== void 0 ? _d : true,
-            delete: (_g = (_f = (_e = server.permissions) === null || _e === void 0 ? void 0 : _e.object) === null || _f === void 0 ? void 0 : _f.delete) !== null && _g !== void 0 ? _g : true,
+            write: (_c = (_b = (_a = server.permissions) === null || _a === void 0 ? void 0 : _a.object) === null || _b === void 0 ? void 0 : _b.write) !== null && _c !== void 0 ? _c : true,
+            delete: (_f = (_e = (_d = server.permissions) === null || _d === void 0 ? void 0 : _d.object) === null || _e === void 0 ? void 0 : _e.delete) !== null && _f !== void 0 ? _f : true,
         };
-        return (jsxs("div", { className: "flex flex-col overflow-hidden rounded-lg border border-gray-200 bg-gray-50", children: [jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-gray-200 p-4", children: [jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [jsx("div", { className: "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg border border-gray-100 bg-white", children: (oauthData === null || oauthData === void 0 ? void 0 : oauthData.image) || server.image ? (jsx("img", { src: (oauthData === null || oauthData === void 0 ? void 0 : oauthData.image) || server.image, alt: displayName, className: "h-6 w-6 object-contain" })) : (jsx(Plug, { className: "h-5 w-5 text-gray-400" })) }), jsx("h4", { className: "truncate text-sm font-medium text-gray-900", children: displayName })] }), jsx("div", { className: "flex flex-shrink-0 items-center gap-2", children: needsOAuthConnection ? (jsx("span", { className: "whitespace-nowrap text-xs text-gray-600", children: t('mcpTabConnectorManagementContent.notConnected') })) : (jsx(WithFormPermissions, { name: "mcp_servers", permissions: fieldPermissions !== null && fieldPermissions !== void 0 ? fieldPermissions : {}, enableRBAC: enableRBAC, children: ({ disabled }) => disabled ? null : (jsxs(Fragment, { children: [jsx("span", { className: "whitespace-nowrap text-xs text-gray-600", children: isActive
-                                                ? t('mcpTabConnectorManagementContent.active')
-                                                : t('mcpTabConnectorManagementContent.inactive') }), jsx(Switch, { checked: isActive, onCheckedChange: (checked) => handleToggleConnector(server.id, displayName, checked), disabled: togglingServerIds.has(server.id), "aria-label": isActive
+        // A connector the organization cannot edit still has settings for this
+        // agent, so Configure opens the form with only those enabled, for whoever
+        // may change what the agent uses.
+        const restrictedEdit = locked || !objectPermissions.write;
+        const configureButton = renderIconAction({
+            label: t('mcpTabConnectorManagementContent.configure'),
+            icon: Settings,
+            testId: `mcp-connector-configure-${server.id}`,
+            onClick: () => openEdit(server, restrictedEdit),
+            className: 'hover:text-gray-700',
+        });
+        // The card's actions are icons because its on/off is a switch: one style per
+        // card, never a switch beside words (#2725 review). The name wraps, never truncates.
+        return (jsxs("div", { "data-testid": `mcp-connector-${server.id}`, role: "group", "aria-label": displayName, className: "flex flex-col gap-3 rounded-lg border p-4", children: [jsxs("div", { className: "flex items-start justify-between gap-3", children: [jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [jsx("div", { className: "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg border border-gray-100 bg-white", children: connectorImage(server) ? (jsx("img", { src: connectorImage(server), alt: displayName, className: "h-6 w-6 object-contain" })) : (jsx(Plug, { className: "h-5 w-5 text-gray-400" })) }), jsxs("div", { className: "min-w-0", children: [jsx("h4", { className: "text-sm font-medium break-words text-gray-900", children: displayName }), (isOAuthServer(server) || !isFeatured) && (jsxs("div", { className: "mt-1 flex flex-wrap items-center gap-1", children: [isOAuthServer(server) && renderScopePill(server, displayName), !isFeatured && (
+                                                // The same word the transport filter above uses; no transport means Streamable HTTP.
+                                                jsx("span", { className: "inline-block rounded bg-gray-100 px-2 py-0.5 text-xs text-gray-600", children: t(getTransportLabelKey(normalizeTransportValue((_g = server.transport) !== null && _g !== void 0 ? _g : undefined))) }))] }))] })] }), jsxs("div", { className: "flex flex-shrink-0 items-center gap-1", children: [!locked && (jsx(WithFormPermissions, { name: MCP_SERVER_PERMISSION_NAME, permissions: { [MCP_SERVER_PERMISSION_NAME]: objectPermissions }, enableRBAC: enableRbac, children: ({ canDelete }) => canDelete
+                                        ? renderIconAction({
+                                            label: t('mcpTabConnectorManagementContent.delete'),
+                                            icon: Trash2,
+                                            testId: `mcp-connector-delete-${server.id}`,
+                                            onClick: () => setConnectorToDelete({ id: server.id, name: server.name }),
+                                            disabled: deletingServerId === server.id,
+                                            className: 'hover:bg-red-50 hover:text-red-600',
+                                        })
+                                        : null })), restrictedEdit ? (jsx(WithFormPermissions, { name: "mcp_servers", permissions: fieldPermissions !== null && fieldPermissions !== void 0 ? fieldPermissions : {}, enableRBAC: enableRbac, children: ({ disabled }) => (disabled ? null : configureButton) })) : (jsx(WithFormPermissions, { name: MCP_SERVER_PERMISSION_NAME, permissions: { [MCP_SERVER_PERMISSION_NAME]: objectPermissions }, enableRBAC: enableRbac, children: ({ disabled }) => (disabled ? null : configureButton) })), jsx(WithFormPermissions, { name: "mcp_servers", permissions: fieldPermissions !== null && fieldPermissions !== void 0 ? fieldPermissions : {}, enableRBAC: enableRbac, children: ({ disabled }) => disabled ? null : (
+                                    // The state reads on hover (title) and to screen readers (aria-label).
+                                    jsx("span", { className: "flex flex-shrink-0 items-center", title: isActive
+                                            ? t('mcpTabConnectorManagementContent.onForThisAgent')
+                                            : t('mcpTabConnectorManagementContent.offForThisAgent'), children: jsx(Switch, { "data-testid": `mcp-connector-toggle-${server.id}`, checked: isActive, onCheckedChange: (checked) => requestToggle(server, checked), disabled: togglingServerIds.has(server.id), "aria-label": isActive
                                                 ? t('mcpTabConnectorManagementContent.ariaEnabled', { displayName })
-                                                : t('mcpTabConnectorManagementContent.ariaDisabled', { displayName }) })] })) })) })] }), jsxs("div", { className: "flex flex-1 flex-col p-4", children: [jsx("div", { className: "mb-3 max-h-20 overflow-y-auto text-sm text-gray-600", children: (oauthData === null || oauthData === void 0 ? void 0 : oauthData.description) || server.description || server.url }), jsxs("div", { className: "mb-3 flex flex-wrap items-center gap-2", children: [isOAuth2 && (jsx("span", { className: "rounded bg-blue-100 px-2 py-1 text-xs text-blue-600", children: "OAuth" })), isOAuth2 && server.auth_scope && (jsx("span", { className: "rounded bg-amber-100 px-2 py-1 text-xs text-amber-700", children: server.auth_scope === 'user'
-                                        ? t('mcpTabConnectorManagementContent.scopeUser')
-                                        : server.auth_scope === 'mentor'
-                                            ? t('mcpTabConnectorManagementContent.scopeAgent')
-                                            : t('mcpTabConnectorManagementContent.scopeTenant') })), isToken && (jsx("span", { className: "rounded bg-purple-100 px-2 py-1 text-xs text-purple-600", children: "Token" })), isFeatured && (oauthData === null || oauthData === void 0 ? void 0 : oauthData.oauth_provider) && (jsx("span", { className: "rounded bg-gray-100 px-2 py-1 text-xs text-gray-600", children: oauthData.oauth_provider })), !isFeatured && (jsx("span", { className: "rounded bg-gray-100 px-2 py-1 text-xs text-gray-600", children: getTransportLabel(server.transport) }))] }), jsx("div", { className: "mt-auto", children: !isFeatured ? (
-                            // Custom (non-featured) servers: Show Edit/Delete based on object permissions, and Connect/Disconnect if OAuth
-                            jsxs("div", { className: "space-y-2", children: [isOAuth2 && (jsx(Fragment, { children: isConnected && connectedServiceId ? (jsx(Button, { variant: "outline", size: "sm", className: "h-8 w-full text-red-600 hover:bg-red-50 hover:text-red-700", onClick: () => handleDisconnectOAuth(server), disabled: isDisconnecting, children: isDisconnecting ? (jsxs(Fragment, { children: [jsx(Spinner, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.disconnecting')] })) : (jsxs(Fragment, { children: [jsx(Unlink, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.disconnect')] })) })) : /* istanbul ignore next -- @preserve JSX branch */ needsOAuthConnection ? (jsx(Button, { variant: "outline", size: "sm", className: "h-8 w-full border-[#38A1E5] bg-[#38A1E5] text-white hover:bg-[#2d8bc7] hover:text-white", onClick: () => handleConnectOAuth(server), disabled: isConnecting, children: isConnecting ? (jsxs(Fragment, { children: [jsx(Spinner, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.connecting')] })) : (jsxs(Fragment, { children: [jsx(Link2, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.connect')] })) })) : null })), jsxs("div", { className: "flex gap-2", children: [jsx(WithFormPermissions, { name: MCP_SERVER_PERMISSION_NAME, enableRBAC: enableRBAC, permissions: {
-                                                    [MCP_SERVER_PERMISSION_NAME]: objectPermissions,
-                                                }, children: ({ disabled }) => !disabled ? (jsxs(Button, { variant: "outline", size: "sm", className: "h-8 flex-1", onClick: () => {
-                                                        setEditingServer(server);
-                                                        setShowAddConnectorDialog(true);
-                                                    }, children: [jsx(SquarePen, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.edit')] })) : null }), jsx(WithFormPermissions, { name: MCP_SERVER_PERMISSION_NAME, enableRBAC: enableRBAC, permissions: {
-                                                    [MCP_SERVER_PERMISSION_NAME]: objectPermissions,
-                                                }, children: ({ canDelete }) => canDelete ? (jsxs(Button, { variant: "outline", size: "sm", className: "h-8 flex-1 text-red-600 hover:bg-red-50 hover:text-red-700", onClick: () => setConnectorToDelete({
-                                                        id: server.id,
-                                                        name: server.name,
-                                                    }), disabled: deletingServerId === server.id, children: [jsx(Trash2, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.delete')] })) : null })] })] })) : (
-                            // Featured servers: Only show Connect/Disconnect for OAuth
-                            jsx(Fragment, { children: isConnected && connectedServiceId ? (jsx(Button, { variant: "outline", size: "sm", className: "h-8 w-full text-red-600 hover:bg-red-50 hover:text-red-700", onClick: () => handleDisconnectOAuth(server), disabled: isDisconnecting, children: isDisconnecting ? (jsxs(Fragment, { children: [jsx(Spinner, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.disconnecting')] })) : (jsxs(Fragment, { children: [jsx(Unlink, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.disconnect')] })) })) : needsOAuthConnection ? (jsx(Button, { variant: "outline", size: "sm", className: "h-8 w-full border-[#38A1E5] bg-[#38A1E5] text-white hover:bg-[#2d8bc7] hover:text-white", onClick: () => handleConnectOAuth(server), disabled: isConnecting, children: isConnecting ? (jsxs(Fragment, { children: [jsx(Spinner, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.connecting')] })) : (jsxs(Fragment, { children: [jsx(Link2, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.connect')] })) })) : null })) }), onSelect && !needsOAuthConnection && (jsxs(Button, { variant: "default", size: "sm", className: "mt-2 h-8 w-full border-0 bg-gradient-to-r from-[#2563EB] to-[#93C5FD] text-white hover:opacity-90", onClick: async (e) => {
-                                e.stopPropagation();
-                                if (!isActive) {
-                                    await handleToggleConnector(server.id, displayName, true);
-                                }
-                                onSelect(server);
-                            }, children: [jsx(Check, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.select')] })), jsx("div", { className: "mt-2 text-xs text-gray-500", children: t('mcpTabConnectorManagementContent.createdDate', {
-                                date: new Date(server.created_at).toLocaleDateString(),
-                            }) })] })] }, server.id));
+                                                : t('mcpTabConnectorManagementContent.ariaDisabled', { displayName }), className: "data-[state=checked]:bg-[#38A1E5] data-[state=unchecked]:bg-gray-200" }) })) })] })] }), description && (jsx("p", { className: "truncate text-xs text-gray-500", title: description, children: description })), onSelect && (jsx("div", { className: "mt-auto flex gap-2", children: jsxs(Button, { variant: "default", size: "sm", className: "h-8 border-0 bg-gradient-to-r from-[#2563EB] to-[#93C5FD] text-white hover:opacity-90", onClick: (e) => {
+                            e.stopPropagation();
+                            void selectConnector(server);
+                        }, children: [jsx(Check, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.select')] }) }))] }, server.id));
     };
-    return (jsxs(Fragment, { children: [jsxs("div", { className: "space-y-6", children: [jsx("div", { className: "rounded-lg border p-4", children: jsxs("div", { className: "flex flex-col gap-3 lg:flex-row", children: [jsx("div", { className: "relative min-w-[200px] flex-1", children: jsx(Input, { type: "text", placeholder: t('mcpTabConnectorManagementContent.searchByName'), value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), className: "w-full bg-transparent" }) }), jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "outline", className: "flex w-full items-center gap-2 bg-transparent font-normal whitespace-nowrap lg:w-auto", children: [jsx(Calendar, { className: "h-4 w-4" }), 
-                                                    /* istanbul ignore next */ (dateRange === null || dateRange === void 0 ? void 0 : dateRange.from) && (dateRange === null || dateRange === void 0 ? void 0 : dateRange.to)
-                                                        ? `${format(dateRange.from, 'MMM dd')} - ${format(dateRange.to, 'MMM dd')}`
-                                                        : t('mcpTabConnectorManagementContent.pickDateRange')] }) }), jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: jsx(Calendar$1, { mode: "range", selected: dateRange, onSelect: setDateRange, numberOfMonths: 2, initialFocus: true }) })] }), jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "outline", role: "combobox", "aria-label": t('mcpTabConnectorManagementContent.ariaSelectTransport'), className: "w-full justify-between bg-transparent font-normal lg:w-[200px]", children: [selectedTransport
-                                                        ? t(getTransportLabelKey(selectedTransport))
-                                                        : t('mcpTabConnectorManagementContent.allTransports'), jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })] }) }), jsx(PopoverContent, { className: "w-full p-0", align: "start", children: jsxs(Command, { children: [jsx(CommandInput, { placeholder: t('mcpTabConnectorManagementContent.searchTransport') }), jsxs(CommandList, { children: [jsx(CommandEmpty, { children: t('mcpTabConnectorManagementContent.noTransportFound') }), jsx(CommandGroup, { children: TRANSPORT_OPTIONS.map((option) => (jsxs(CommandItem, { value: String(option.value), onSelect: () => setSelectedTransport(option.value), children: [jsx(Check, { className: cn('mr-2 h-4 w-4', selectedTransport === option.value ? 'opacity-100' : 'opacity-0') }), t(getTransportLabelKey(option.value))] }, option.value || 'all'))) })] })] }) })] })] }) }), (featuredOAuthServers.length > 0 || featuredRegularServers.length > 0) && (jsxs("div", { children: [jsx("div", { className: "mb-4 flex items-center justify-between", children: jsx("h3", { className: "text-base font-medium text-gray-900", children: t('mcpTabConnectorManagementContent.featuredConnectors') }) }), isLoadingFeatured ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx(Spinner, { className: "mb-4 h-8 w-8" }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.loadingFeaturedConnectors') })] })) : featuredError ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-100", children: jsx(Plug, { className: "h-8 w-8 text-red-400" }) }), jsx("p", { className: "mb-2 text-sm text-red-600", children: t('mcpTabConnectorManagementContent.failedToLoadFeatured') }), jsx(Button, { variant: "outline", size: "sm", onClick: () => refetchFeatured(), className: "text-sm", children: t('mcpTabConnectorManagementContent.retry') })] })) : (jsxs(Fragment, { children: [jsxs("div", { className: "grid grid-cols-[repeat(auto-fill,minmax(min(100%,15rem),1fr))] gap-4", children: [featuredOAuthServers.map((server) => renderServerCard(server, true)), featuredRegularServers.map((server) => renderServerCard(server, true))] }), featuredTotalPages > 1 && (jsx("div", { className: "flex justify-center pt-4", children: jsx(IblPagination, { currentPage: featuredPage, totalPages: featuredTotalPages, onPageChange: setFeaturedPage, disabled: isLoadingFeatured }) }))] }))] })), jsxs("div", { children: [jsxs("div", { className: "mb-6 flex items-center justify-between", children: [jsx("h3", { className: "text-base font-medium text-gray-900", children: t('mcpTabConnectorManagementContent.connectors') }), jsx(WithPermissions, { rbacResource: "/mcpservers/#create", rbacPermissions: rbacPermissions !== null && rbacPermissions !== void 0 ? rbacPermissions : {}, children: ({ hasPermission }) => hasPermission ? (jsxs(Button, { onClick: () => setShowAddConnectorDialog(true), variant: "outline", className: "ibl-button-primary shrink-0", children: [jsx(Plus, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.addConnector')] })) : null })] }), isLoadingMy ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx(Spinner, { className: "mb-4 h-8 w-8" }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.loadingConnectors') })] })) : myError ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-100", children: jsx(Plug, { className: "h-8 w-8 text-red-400" }) }), jsx("p", { className: "mb-2 text-sm text-red-600", children: t('mcpTabConnectorManagementContent.failedToLoadConnectors') }), jsx(Button, { variant: "outline", size: "sm", onClick: () => refetchMy(), className: "text-sm", children: t('mcpTabConnectorManagementContent.retry') })] })) : !filteredMyServers.length ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gray-200", children: jsx(Plug, { className: "h-8 w-8 text-gray-400" }) }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.noConnectorsConfigured') })] })) : (jsxs(Fragment, { children: [jsx("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", children: filteredMyServers.map((server) => renderServerCard(server, false)) }), myConnectorsTotalPages > 1 && (jsx("div", { className: "flex justify-center pt-4", children: jsx(IblPagination, { currentPage: myConnectorsPage, totalPages: myConnectorsTotalPages, onPageChange: setMyConnectorsPage, disabled: isLoadingMy }) }))] }))] })] }), jsx(ConnectorDialogs, { open: showAddConnectorDialog, onClose: () => {
+    const hasFeatured = featuredOAuthServers.length > 0 || featuredRegularServers.length > 0;
+    // Decided before the featured page answers: the sub-tabs show from the first
+    // render (with the Featured panel's own spinner or error), never swapping the
+    // Connectors list away from under the person once it has arrived.
+    const showTabs = isLoadingFeatured || !!featuredError || hasFeatured;
+    const addButton = (jsx(WithPermissions, { rbacResource: "/mcpservers/#create", rbacPermissions: rbacPermissions !== null && rbacPermissions !== void 0 ? rbacPermissions : {}, children: ({ hasPermission }) => hasPermission ? (jsxs(Button, { onClick: () => setShowAddConnectorDialog(true), variant: "outline", className: "ibl-button-primary shrink-0", children: [jsx(Plus, { className: "mr-2 h-4 w-4" }), t('mcpTabConnectorManagementContent.addConnector')] })) : null }));
+    const featuredList = isLoadingFeatured ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx(Spinner, { className: "mb-4 h-8 w-8" }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.loadingFeaturedConnectors') })] })) : featuredError ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-100", children: jsx(Plug, { className: "h-8 w-8 text-red-400" }) }), jsx("p", { className: "mb-2 text-sm text-red-600", children: t('mcpTabConnectorManagementContent.failedToLoadFeatured') }), jsx(Button, { variant: "outline", size: "sm", onClick: () => refetchFeatured(), className: "text-sm", children: t('mcpTabConnectorManagementContent.retry') })] })) : (jsxs(Fragment, { children: [jsxs("div", { className: "grid gap-3 md:grid-cols-2", children: [featuredOAuthServers.map((server) => renderServerCard(server, true)), featuredRegularServers.map((server) => renderServerCard(server, true))] }), featuredTotalPages > 1 && (jsx("div", { className: "flex justify-center pt-4", children: jsx(IblPagination, { currentPage: featuredPage, totalPages: featuredTotalPages, onPageChange: setFeaturedPage, disabled: isLoadingFeatured }) }))] }));
+    const connectorsList = isLoadingMy ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx(Spinner, { className: "mb-4 h-8 w-8" }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.loadingConnectors') })] })) : myError ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-red-100", children: jsx(Plug, { className: "h-8 w-8 text-red-400" }) }), jsx("p", { className: "mb-2 text-sm text-red-600", children: t('mcpTabConnectorManagementContent.failedToLoadConnectors') }), jsx(Button, { variant: "outline", size: "sm", onClick: () => refetchMy(), className: "text-sm", children: t('mcpTabConnectorManagementContent.retry') })] })) : !filteredMyServers.length ? (jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [jsx("div", { className: "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-gray-200", children: jsx(Plug, { className: "h-8 w-8 text-gray-400" }) }), jsx("p", { className: "text-sm text-gray-500", children: t('mcpTabConnectorManagementContent.noConnectorsConfigured') })] })) : (jsxs(Fragment, { children: [jsx("div", { className: "grid gap-3 md:grid-cols-2", children: filteredMyServers.map((server) => renderServerCard(server, false)) }), myConnectorsTotalPages > 1 && (jsx("div", { className: "flex justify-center pt-4", children: jsx(IblPagination, { currentPage: myConnectorsPage, totalPages: myConnectorsTotalPages, onPageChange: setMyConnectorsPage, disabled: isLoadingMy }) }))] }));
+    return (jsxs(Fragment, { children: [jsxs("div", { className: "space-y-6", children: [jsxs("div", { className: "flex flex-col gap-3 lg:flex-row", children: [jsx("div", { className: "relative min-w-[200px] flex-1", children: jsx(Input, { type: "text", placeholder: t('mcpTabConnectorManagementContent.searchByName'), value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), className: "h-10 w-full bg-transparent" }) }), jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "outline", className: "flex w-full items-center gap-2 bg-transparent font-normal whitespace-nowrap lg:w-auto", children: [jsx(Calendar, { className: "h-4 w-4" }), 
+                                                /* istanbul ignore next */ (dateRange === null || dateRange === void 0 ? void 0 : dateRange.from) && (dateRange === null || dateRange === void 0 ? void 0 : dateRange.to)
+                                                    ? `${format(dateRange.from, 'MMM dd')} - ${format(dateRange.to, 'MMM dd')}`
+                                                    : t('mcpTabConnectorManagementContent.pickDateRange')] }) }), jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: jsx(Calendar$1, { mode: "range", selected: dateRange, onSelect: setDateRange, numberOfMonths: 2, initialFocus: true }) })] }), jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "outline", role: "combobox", "aria-label": t('mcpTabConnectorManagementContent.ariaSelectTransport'), className: "w-full justify-between bg-transparent font-normal lg:w-[200px]", children: [selectedTransport
+                                                    ? t(getTransportLabelKey(selectedTransport))
+                                                    : t('mcpTabConnectorManagementContent.allTransports'), jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })] }) }), jsx(PopoverContent, { className: "w-full p-0", align: "start", children: jsxs(Command, { children: [jsx(CommandInput, { placeholder: t('mcpTabConnectorManagementContent.searchTransport') }), jsxs(CommandList, { children: [jsx(CommandEmpty, { children: t('mcpTabConnectorManagementContent.noTransportFound') }), jsx(CommandGroup, { children: TRANSPORT_OPTIONS.map((option) => (jsxs(CommandItem, { value: String(option.value), onSelect: () => setSelectedTransport(option.value), children: [jsx(Check, { className: cn('mr-2 h-4 w-4', selectedTransport === option.value ? 'opacity-100' : 'opacity-0') }), t(getTransportLabelKey(option.value))] }, option.value || 'all'))) })] })] }) })] })] }), showTabs ? (jsxs(Tabs, { value: section, onValueChange: (value) => setSection(value), className: "space-y-4", children: [jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [jsxs(TabsList, { className: "inline-flex h-auto max-w-full justify-start overflow-x-auto rounded-md bg-gray-100 p-1", "aria-label": t('mcpTabConnectorManagementContent.connectors'), children: [jsx(TabsTrigger, { value: "featured", "data-testid": "mcp-tab-featured", className: SUB_TAB_TRIGGER_CLASS, children: t('mcpTabConnectorManagementContent.featured') }), jsx(TabsTrigger, { value: "custom", "data-testid": "mcp-tab-custom", className: SUB_TAB_TRIGGER_CLASS, children: t('mcpTabConnectorManagementContent.directory') })] }), addButton] }), jsx(TabsContent, { value: "featured", forceMount: true, className: "m-0 data-[state=inactive]:hidden", children: featuredList }), jsx(TabsContent, { value: "custom", forceMount: true, className: "m-0 data-[state=inactive]:hidden", children: connectorsList })] })) : (jsxs("div", { className: "space-y-4", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx("h3", { className: "text-base font-medium text-gray-900", children: t('mcpTabConnectorManagementContent.connectors') }), addButton] }), connectorsList] }))] }), jsx(ConnectorDialogs, { open: showAddConnectorDialog, restricted: restricted, openOnSignInApp: openOnSignInApp, onClose: () => {
+                    setRestricted(false);
+                    setOpenOnSignInApp(false);
                     setShowAddConnectorDialog(false);
                     setEditingServer(null);
-                }, onAddConnector: handleAddConnectorClick, editingServer: editingServer, editingConnectionId: editingServer ? getConnectionId(editingServer) : null, tenantKey: tenantKey, username: username, mentorId: mentorId, onOAuthComplete: handleOAuthComplete }), connectorToDelete && (jsx(Dialog, { open: true, onOpenChange: () => setConnectorToDelete(null), children: jsxs(DialogContent, { className: "bg-white sm:max-w-[425px]", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { className: "space-y-2", children: jsx(DialogTitle, { className: "text-xl font-semibold text-gray-700", children: t('mcpTabConnectorManagementContent.removeConnector') }) }), jsxs("div", { className: "space-y-4", children: [jsxs("p", { className: "text-sm text-gray-600", children: [t('mcpTabConnectorManagementContent.confirmRemovePrefix'), ' ', jsx("strong", { children: connectorToDelete.name }), t('mcpTabConnectorManagementContent.confirmRemoveSuffix')] }), jsxs("div", { className: "flex justify-end gap-3", children: [jsx(Button, { variant: "outline", onClick: () => setConnectorToDelete(null), disabled: deletingServerId !== null, children: t('mcpTabConnectorManagementContent.cancel') }), jsx(Button, { onClick: () => handleDeleteConnector(connectorToDelete.id, connectorToDelete.name), disabled: deletingServerId !== null, className: "ibl-button-primary", children: deletingServerId === connectorToDelete.id
-                                                ? t('mcpTabConnectorManagementContent.deleting')
-                                                : t('mcpTabConnectorManagementContent.delete') })] })] })] }) }))] }));
+                }, onAddConnector: handleAddConnectorClick, onRestrictedSave: handleRestrictedSave, clearAgentScopeOverride: clearAgentScopeOverride, editingServer: editingServer, editingConnectionId: editingServer ? getConnectionId(editingServer) : null, tenantKey: tenantKey, username: username, mentorId: mentorId, onOAuthComplete: handleOAuthComplete, onAuthScopeChanged: handleAuthScopeChanged, connection: editingConnection }), jsx(RemoveConnectorDialog, { connector: connectorToDelete, deletingServerId: deletingServerId, onCancel: () => setConnectorToDelete(null), onConfirm: (connector) => handleDeleteConnector(connector.id, connector.name) })] }));
 }
 
-export { ConnectorManagementContent, MCP_SERVER_PERMISSION_NAME, TRANSPORT_OPTIONS, checkOAuthConnectionComplete, createMCPServerFormData, createOAuthConnection, determineCheckConnectionAction, determineMessageEventAction, executeCheckConnectionFlowLogic, executeConnectionFoundCleanup, executeHandleMessageCallback, executeMaxPollsCleanup, executeMessageEventFlowLogic, findMCPServerConnection, getTransportLabel, getTransportLabelKey, handleOAuthMessageResult, normalizeTransportValue, processOAuthMessageEvent, processOAuthStorageEvent, shouldExecuteMessageAction, validateDisconnectOAuthParams };
+export { ConnectorManagementContent, MCP_SERVER_PERMISSION_NAME, TRANSPORT_OPTIONS, canManageMcpServers, connectionForScopeExists, connectorImage, currentSignInScope, getMcpConnectionState, getTransportLabelKey, normalizeTransportValue };
 //# sourceMappingURL=connector-management-content.js.map