@taskforcehq/taskforce 0.3.329 → 0.3.330

package/dist/components/features/agentConnections/AgentConnectionControl.d.ts

@@ -0,0 +1,15 @@
+type AgentConnectionControlProps = {
+    workspaceId: string;
+    runtimeMode: 'local' | 'cloud';
+    agentId: string | null;
+    providerKey: string;
+    active: boolean;
+    refreshKey: number;
+    cloudAccessAvailable?: boolean;
+    cloudAccessPending?: boolean;
+    cloudAuthConfigured?: boolean;
+    resolveCloudAuthUrl?: (path: string) => string;
+    onManageConnections: () => void;
+};
+export declare function AgentConnectionControl({ workspaceId, runtimeMode, agentId, providerKey, active, refreshKey, cloudAccessAvailable, cloudAccessPending, cloudAuthConfigured, resolveCloudAuthUrl, onManageConnections, }: AgentConnectionControlProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/agentConnections/AgentConnectionControl.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { AlertTriangle, CheckCircle, Link, Loader2, Plug } from 'lucide-react';
+import styles from '../../../Taskforce.module.css';
+import { bindAgentConnection, inspectAgentConnectionBinding, listModelConnections, } from './modelConnectionsApi.js';
+export function AgentConnectionControl({ workspaceId, runtimeMode, agentId, providerKey, active, refreshKey, cloudAccessAvailable = runtimeMode === 'cloud', cloudAccessPending = false, cloudAuthConfigured = runtimeMode === 'cloud', resolveCloudAuthUrl, onManageConnections, }) {
+    const context = useMemo(() => ({
+        workspaceId,
+        resolveApiUrl: resolveCloudAuthUrl,
+    }), [resolveCloudAuthUrl, workspaceId]);
+    const [binding, setBinding] = useState(null);
+    const [connections, setConnections] = useState([]);
+    const [selectedConnectionId, setSelectedConnectionId] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState('');
+    const loadGenerationRef = useRef(0);
+    const activeConnections = useMemo(() => connections.filter((connection) => (connection.providerKey === providerKey
+        && connection.authenticationType === 'chatgpt_device_code'
+        && connection.lifecycleStatus === 'active')), [connections, providerKey]);
+    const load = useCallback(async () => {
+        if (!active || !cloudAccessAvailable || !agentId)
+            return;
+        const generation = ++loadGenerationRef.current;
+        setLoading(true);
+        setBinding(null);
+        setConnections([]);
+        setSelectedConnectionId('');
+        setError('');
+        try {
+            const [nextBinding, nextConnections] = await Promise.all([
+                inspectAgentConnectionBinding(agentId, context),
+                listModelConnections(context),
+            ]);
+            if (generation !== loadGenerationRef.current)
+                return;
+            setConnections(nextConnections);
+            const ownedBindingId = nextBinding.ownerIsCaller ? String(nextBinding.connectionId || '') : '';
+            const matchingConnections = nextConnections.filter((connection) => (connection.providerKey === providerKey
+                && connection.authenticationType === 'chatgpt_device_code'
+                && connection.lifecycleStatus === 'active'));
+            const firstActiveId = matchingConnections[0]?.id || '';
+            const ownedBindingIsActive = matchingConnections.some((connection) => connection.id === ownedBindingId);
+            setSelectedConnectionId(ownedBindingIsActive ? ownedBindingId : firstActiveId);
+            let resolvedBinding = nextBinding;
+            const mayReplaceBinding = !nextBinding.bound || (nextBinding.ownerIsCaller && !nextBinding.available);
+            if (mayReplaceBinding && matchingConnections.length === 1) {
+                try {
+                    resolvedBinding = await bindAgentConnection(agentId, matchingConnections[0].id, context);
+                }
+                catch (bindError) {
+                    if (generation !== loadGenerationRef.current)
+                        return;
+                    setError(bindError.message || 'Unable to assign this account to the Agent.');
+                }
+            }
+            if (generation !== loadGenerationRef.current)
+                return;
+            setBinding(resolvedBinding);
+        }
+        catch (loadError) {
+            if (generation !== loadGenerationRef.current)
+                return;
+            setError(loadError.message || 'Unable to inspect this Agent connection.');
+        }
+        finally {
+            if (generation === loadGenerationRef.current)
+                setLoading(false);
+        }
+    }, [active, agentId, cloudAccessAvailable, context, providerKey]);
+    useEffect(() => {
+        loadGenerationRef.current += 1;
+        setBinding(null);
+        setConnections([]);
+        setSelectedConnectionId('');
+        setLoading(false);
+        setBusy(false);
+        setError('');
+    }, [cloudAccessAvailable, context]);
+    useEffect(() => {
+        void load();
+        return () => {
+            loadGenerationRef.current += 1;
+        };
+    }, [load, refreshKey]);
+    const bind = useCallback(async () => {
+        if (!agentId || !selectedConnectionId)
+            return;
+        const generation = loadGenerationRef.current;
+        setBusy(true);
+        setError('');
+        try {
+            const nextBinding = await bindAgentConnection(agentId, selectedConnectionId, context);
+            if (generation !== loadGenerationRef.current)
+                return;
+            setBinding(nextBinding);
+        }
+        catch (bindError) {
+            if (generation !== loadGenerationRef.current)
+                return;
+            setError(bindError.message || 'Unable to assign this account to the Agent.');
+        }
+        finally {
+            if (generation === loadGenerationRef.current)
+                setBusy(false);
+        }
+    }, [agentId, context, selectedConnectionId]);
+    if (!cloudAccessAvailable) {
+        return (_jsxs("div", { className: styles.taskforceAgentConnectionControl, children: [_jsxs("div", { children: [_jsx(Plug, { size: 15 }), _jsx("strong", { children: "Connected account" })] }), _jsx("span", { children: cloudAccessPending
+                        ? 'Checking Taskforce Cloud sign-in...'
+                        : cloudAuthConfigured
+                            ? 'Sign in to Taskforce Cloud to configure this model.'
+                            : 'Connect this local runtime to Taskforce Cloud to configure this model.' })] }));
+    }
+    if (!agentId) {
+        return (_jsxs("div", { className: styles.taskforceAgentConnectionControl, children: [_jsxs("div", { children: [_jsx(Plug, { size: 15 }), _jsx("strong", { children: "Connected account" })] }), _jsx("span", { children: "Save this Agent to assign a connected account." })] }));
+    }
+    return (_jsxs("div", { className: styles.taskforceAgentConnectionControl, children: [_jsxs("div", { className: styles.taskforceAgentConnectionControlHeader, children: [_jsxs("div", { children: [_jsx(Plug, { size: 15 }), _jsx("strong", { children: "Connected account" })] }), _jsx("span", { role: "status", "aria-live": "polite", children: loading ? _jsx(Loader2, { size: 14, className: styles.spinner }) : binding?.available ? (_jsxs("span", { className: "tf-chip-success", children: [_jsx(CheckCircle, { size: 12 }), " Assigned"] })) : binding?.bound ? (_jsxs("span", { className: "tf-chip-warning", children: [_jsx(AlertTriangle, { size: 12 }), " Unavailable"] })) : (_jsx("span", { className: "tf-chip-neutral", children: "Not assigned" })) })] }), error ? _jsx("span", { className: "tf-text-error", role: "alert", children: error }) : null, !loading && activeConnections.length > 0 && (!binding?.bound || binding.ownerIsCaller) ? (_jsxs("div", { className: styles.taskforceAgentConnectionBindingRow, children: [_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Account" }), _jsx("select", { className: styles.select, value: selectedConnectionId, onChange: (event) => setSelectedConnectionId(event.target.value), "aria-label": "Connected model account", disabled: busy || activeConnections.length === 1, children: activeConnections.map((connection) => (_jsx("option", { value: connection.id, children: connection.displayMetadata.accountLabel
+                                        || connection.displayMetadata.accountEmail
+                                        || 'ChatGPT subscription' }, connection.id))) })] }), activeConnections.length > 1 || !binding?.available ? (_jsxs("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => { void bind(); }, disabled: busy || !selectedConnectionId || (binding?.available && binding.connectionId === selectedConnectionId), children: [busy ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Link, { size: 14 }), "Use account"] })) : null] })) : !loading ? (_jsxs("div", { className: styles.taskforceAgentConnectionCallout, children: [_jsx("span", { children: binding?.bound && !binding.ownerIsCaller
+                            ? "This Agent uses another eligible user's private connection. Ask the connection owner to reconnect it."
+                            : binding?.bound
+                                ? 'The bound connection is unavailable.'
+                                : 'Connect ChatGPT before running this Agent.' }), binding?.ownerIsCaller !== false ? (_jsxs("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: onManageConnections, children: [_jsx(Plug, { size: 14 }), " Manage connections"] })) : null] })) : null] }));
+}

package/dist/components/features/agentConnections/ModelConnectionsPanel.d.ts

@@ -0,0 +1,18 @@
+import { type ModelConnection } from './modelConnectionsApi.js';
+type ModelConnectionsPanelProps = {
+    workspaceId: string;
+    active: boolean;
+    runtimeMode: 'local' | 'cloud';
+    eligible: boolean;
+    cloudAccessAvailable?: boolean;
+    cloudAccessPending?: boolean;
+    cloudAuthConfigured?: boolean;
+    resolveCloudAuthUrl?: (path: string) => string;
+    onConnectionActivated?: (connection: ModelConnection) => void | Promise<void>;
+    onConnectionUnavailable?: (connectionId: string) => void;
+    onReturnToAgent?: () => void;
+    pollIntervalMs?: number;
+    libraryPortalTarget?: HTMLElement | null;
+};
+export declare function ModelConnectionsPanel({ workspaceId, active, runtimeMode, eligible, cloudAccessAvailable, cloudAccessPending, cloudAuthConfigured, resolveCloudAuthUrl, onConnectionActivated, onConnectionUnavailable, onReturnToAgent, pollIntervalMs, libraryPortalTarget, }: ModelConnectionsPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/agentConnections/ModelConnectionsPanel.js

@@ -0,0 +1,393 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { AlertTriangle, Check, CircleSlash, Copy, ExternalLink, Loader2, LogOut, Pencil, Plug, RefreshCw, RotateCcw, Trash2, X, } from 'lucide-react';
+import styles from '../../../Taskforce.module.css';
+import { cancelDeviceCodeLogin, createOpenAiCodexConnection, disconnectModelConnection, getDeviceCodeLogin, listModelConnections, loadModelConnectionsSnapshot, modelConnectionFailureMessage, refreshModelConnection, renameModelConnection, removeModelConnection, startDeviceCodeLogin, verifyModelConnection, } from './modelConnectionsApi.js';
+import managerStyles from '../agentBehavior/AgentBehaviorManagerShared.module.css';
+import { getProductLogoUrl } from '../../../utils/productLogoRegistry.js';
+const LOGIN_POLL_INTERVAL_MS = 1_500;
+const CHATGPT_LOGO_URL = getProductLogoUrl('chatgpt');
+function connectionStatusLabel(status) {
+    switch (status) {
+        case 'active': return 'Connected';
+        case 'pending': return 'Not authorized';
+        case 'reconnect_required': return 'Reconnect required';
+        case 'revoked': return 'Revoked';
+        case 'disconnected': return 'Disconnected';
+        default: return 'Unavailable';
+    }
+}
+function connectionStatusClass(status) {
+    if (status === 'active')
+        return 'tf-chip-success';
+    if (status === 'pending' || status === 'disconnected')
+        return 'tf-chip-neutral';
+    if (status === 'reconnect_required')
+        return 'tf-chip-warning';
+    return 'tf-chip-danger';
+}
+function connectionAccountLabel(connection) {
+    return String(connection.displayMetadata.displayName
+        || connection.displayMetadata.accountLabel
+        || connection.displayMetadata.accountEmail
+        || 'ChatGPT subscription');
+}
+function connectionLastChecked(connection) {
+    const timestamps = [connection.lastVerifiedAt, connection.lastRefreshedAt]
+        .filter((value) => Boolean(value))
+        .map((value) => new Date(value))
+        .filter((value) => !Number.isNaN(value.getTime()))
+        .sort((left, right) => right.getTime() - left.getTime());
+    const value = timestamps[0];
+    if (!value)
+        return 'Not verified yet';
+    return `Checked ${value.toLocaleString()}`;
+}
+export function ModelConnectionsPanel({ workspaceId, active, runtimeMode, eligible, cloudAccessAvailable = runtimeMode === 'cloud', cloudAccessPending = false, cloudAuthConfigured = runtimeMode === 'cloud', resolveCloudAuthUrl, onConnectionActivated, onConnectionUnavailable, onReturnToAgent, pollIntervalMs = LOGIN_POLL_INTERVAL_MS, libraryPortalTarget, }) {
+    const context = useMemo(() => ({
+        workspaceId,
+        resolveApiUrl: resolveCloudAuthUrl,
+    }), [resolveCloudAuthUrl, workspaceId]);
+    const [connections, setConnections] = useState([]);
+    const [selectedConnectionId, setSelectedConnectionId] = useState('');
+    const [localEligible, setLocalEligible] = useState(runtimeMode === 'local' ? null : eligible);
+    const [loading, setLoading] = useState(false);
+    const [busyConnectionId, setBusyConnectionId] = useState(null);
+    const [login, setLogin] = useState(null);
+    const [feedback, setFeedback] = useState(null);
+    const [copied, setCopied] = useState(false);
+    const [renamingConnectionId, setRenamingConnectionId] = useState(null);
+    const [connectionNameDraft, setConnectionNameDraft] = useState('');
+    const pollGenerationRef = useRef(0);
+    const loadGenerationRef = useRef(0);
+    const connectButtonRef = useRef(null);
+    const effectiveEligible = runtimeMode === 'local' ? localEligible : eligible;
+    const selectedConnection = connections.find((connection) => connection.id === selectedConnectionId) || null;
+    const loadConnections = useCallback(async (quiet = false) => {
+        if (!cloudAccessAvailable)
+            return;
+        const generation = ++loadGenerationRef.current;
+        if (!quiet)
+            setLoading(true);
+        try {
+            if (runtimeMode === 'local') {
+                const snapshot = await loadModelConnectionsSnapshot(context);
+                if (generation !== loadGenerationRef.current)
+                    return;
+                setLocalEligible(snapshot.eligible);
+                setConnections(snapshot.connections);
+            }
+            else {
+                const next = await listModelConnections(context);
+                if (generation !== loadGenerationRef.current)
+                    return;
+                setConnections(next);
+            }
+            if (!quiet)
+                setFeedback(null);
+        }
+        catch (error) {
+            if (generation !== loadGenerationRef.current)
+                return;
+            const apiError = error;
+            setFeedback({ type: 'error', message: apiError.message || 'Unable to load model connections.' });
+        }
+        finally {
+            if (!quiet && generation === loadGenerationRef.current)
+                setLoading(false);
+        }
+    }, [cloudAccessAvailable, context, runtimeMode]);
+    useEffect(() => {
+        loadGenerationRef.current += 1;
+        pollGenerationRef.current += 1;
+        setConnections([]);
+        setSelectedConnectionId('');
+        setLocalEligible(runtimeMode === 'local' ? null : eligible);
+        setLoading(false);
+        setBusyConnectionId(null);
+        setLogin(null);
+        setFeedback(null);
+        setCopied(false);
+        setRenamingConnectionId(null);
+        setConnectionNameDraft('');
+    }, [cloudAccessAvailable, context, eligible, runtimeMode]);
+    useEffect(() => {
+        setSelectedConnectionId((current) => {
+            if (current && connections.some((connection) => connection.id === current))
+                return current;
+            return connections.length === 1 ? connections[0].id : '';
+        });
+    }, [connections]);
+    useEffect(() => {
+        if (!active || !cloudAccessAvailable || (runtimeMode === 'cloud' && !eligible))
+            return;
+        void loadConnections();
+    }, [active, cloudAccessAvailable, eligible, loadConnections, runtimeMode]);
+    useEffect(() => () => {
+        pollGenerationRef.current += 1;
+    }, []);
+    const completeActiveLogin = useCallback(async (current, generation) => {
+        if (generation !== pollGenerationRef.current)
+            return;
+        setLogin(null);
+        let nextConnections;
+        try {
+            nextConnections = await listModelConnections(context);
+        }
+        catch (error) {
+            if (generation !== pollGenerationRef.current)
+                return;
+            setFeedback({
+                type: 'error',
+                message: error.message || 'ChatGPT was authorized, but the connection status could not be refreshed.',
+            });
+            return;
+        }
+        if (generation !== pollGenerationRef.current)
+            return;
+        setConnections(nextConnections);
+        const activated = nextConnections.find((connection) => connection.id === current.connectionId) || null;
+        if (!activated) {
+            setFeedback({ type: 'error', message: 'ChatGPT was authorized, but the connection status could not be refreshed.' });
+            return;
+        }
+        setSelectedConnectionId(activated.id);
+        try {
+            await onConnectionActivated?.(activated);
+        }
+        catch (error) {
+            if (generation !== pollGenerationRef.current)
+                return;
+            setFeedback({
+                type: 'error',
+                message: `ChatGPT is connected, but this Agent could not refresh its account selection. ${error.message || 'Return to the Agent and select the account again.'}`,
+                returnToAgent: Boolean(onReturnToAgent),
+            });
+            return;
+        }
+        if (generation !== pollGenerationRef.current)
+            return;
+        setFeedback({ type: 'success', message: 'ChatGPT connection authorized.' });
+    }, [context, onConnectionActivated, onReturnToAgent]);
+    const pollLogin = useCallback(async (initial, generation) => {
+        let current = initial;
+        while (generation === pollGenerationRef.current && current.status === 'pending') {
+            await new Promise((resolve) => window.setTimeout(resolve, pollIntervalMs));
+            if (generation !== pollGenerationRef.current)
+                return;
+            try {
+                current = await getDeviceCodeLogin(current.connectionId, current.id, context);
+                if (generation !== pollGenerationRef.current)
+                    return;
+                setLogin(current);
+            }
+            catch (error) {
+                if (generation !== pollGenerationRef.current)
+                    return;
+                const apiError = error;
+                setFeedback({ type: 'error', message: apiError.message || 'Unable to check device authorization.' });
+                return;
+            }
+        }
+        if (generation !== pollGenerationRef.current)
+            return;
+        if (current.status === 'active') {
+            await completeActiveLogin(current, generation);
+            return;
+        }
+        setLogin(null);
+        if (current.status !== 'cancelled') {
+            setFeedback({ type: 'error', message: modelConnectionFailureMessage(current.failureCode) });
+        }
+    }, [completeActiveLogin, context, pollIntervalMs]);
+    const beginAuthorization = useCallback(async (connection) => {
+        const generation = ++pollGenerationRef.current;
+        setFeedback(null);
+        setCopied(false);
+        setBusyConnectionId(connection?.id || 'new');
+        try {
+            const target = connection || await createOpenAiCodexConnection(context);
+            if (generation !== pollGenerationRef.current)
+                return;
+            setConnections((current) => current.some((item) => item.id === target.id)
+                ? current.map((item) => item.id === target.id ? target : item)
+                : [target, ...current]);
+            setSelectedConnectionId(target.id);
+            const nextLogin = await startDeviceCodeLogin(target.id, context);
+            if (generation !== pollGenerationRef.current)
+                return;
+            setLogin(nextLogin);
+            window.open(nextLogin.verificationUrl, '_blank', 'noopener,noreferrer');
+            void pollLogin(nextLogin, generation);
+        }
+        catch (error) {
+            if (generation !== pollGenerationRef.current)
+                return;
+            const apiError = error;
+            setFeedback({
+                type: 'error',
+                message: apiError.code
+                    ? modelConnectionFailureMessage(apiError.code, apiError.message)
+                    : apiError.message,
+            });
+            await loadConnections(true);
+        }
+        finally {
+            if (generation === pollGenerationRef.current)
+                setBusyConnectionId(null);
+        }
+    }, [context, loadConnections, pollLogin]);
+    const cancelLogin = useCallback(async () => {
+        if (!login)
+            return;
+        const generation = ++pollGenerationRef.current;
+        setBusyConnectionId(login.connectionId);
+        try {
+            const cancelled = await cancelDeviceCodeLogin(login.connectionId, login.id, context);
+            if (generation !== pollGenerationRef.current)
+                return;
+            if (cancelled.status === 'active') {
+                await completeActiveLogin(cancelled, generation);
+            }
+            else if (cancelled.status === 'pending') {
+                setLogin(cancelled);
+                setBusyConnectionId(null);
+                void pollLogin(cancelled, generation);
+            }
+            else {
+                setLogin(null);
+                setFeedback(cancelled.status === 'cancelled'
+                    ? null
+                    : { type: 'error', message: modelConnectionFailureMessage(cancelled.failureCode) });
+            }
+        }
+        catch (error) {
+            if (generation !== pollGenerationRef.current)
+                return;
+            setFeedback({ type: 'error', message: error.message || 'Unable to cancel authorization.' });
+            setBusyConnectionId(null);
+            void pollLogin(login, generation);
+        }
+        finally {
+            if (generation === pollGenerationRef.current)
+                setBusyConnectionId(null);
+        }
+    }, [completeActiveLogin, context, login, pollLogin]);
+    const copyCode = useCallback(async () => {
+        if (!login?.userCode || !navigator.clipboard?.writeText)
+            return;
+        try {
+            await navigator.clipboard.writeText(login.userCode);
+            setCopied(true);
+        }
+        catch {
+            setCopied(false);
+        }
+    }, [login?.userCode]);
+    const runConnectionAction = useCallback(async (connection, action) => {
+        setBusyConnectionId(connection.id);
+        setFeedback(null);
+        try {
+            if (action === 'disconnect' && !window.confirm('Disconnect this ChatGPT connection? Agents bound to it will be unavailable until you reconnect.'))
+                return;
+            if (action === 'remove' && !window.confirm('Remove this ChatGPT connection and its stored credentials? This cannot be undone.'))
+                return;
+            if (action === 'remove') {
+                await removeModelConnection(connection.id, context);
+                onConnectionUnavailable?.(connection.id);
+                setConnections((current) => current.filter((item) => item.id !== connection.id));
+                setSelectedConnectionId((current) => current === connection.id ? '' : current);
+                setFeedback({ type: 'success', message: 'ChatGPT connection removed.' });
+                window.setTimeout(() => connectButtonRef.current?.focus(), 0);
+                return;
+            }
+            const next = action === 'verify'
+                ? await verifyModelConnection(connection.id, context)
+                : action === 'refresh'
+                    ? await refreshModelConnection(connection.id, context)
+                    : await disconnectModelConnection(connection.id, context);
+            if (next.lifecycleStatus !== 'active')
+                onConnectionUnavailable?.(connection.id);
+            setConnections((current) => current.map((item) => item.id === next.id ? next : item));
+            setFeedback({
+                type: 'success',
+                message: action === 'disconnect' ? 'ChatGPT connection disconnected.' : 'ChatGPT connection verified.',
+            });
+        }
+        catch (error) {
+            const apiError = error;
+            setFeedback({
+                type: 'error',
+                message: apiError.code
+                    ? modelConnectionFailureMessage(apiError.code, apiError.message)
+                    : apiError.message,
+            });
+        }
+        finally {
+            setBusyConnectionId(null);
+        }
+    }, [context, onConnectionUnavailable]);
+    const saveConnectionName = useCallback(async (connection) => {
+        const displayName = connectionNameDraft.trim();
+        if (!displayName || busyConnectionId)
+            return;
+        setBusyConnectionId(connection.id);
+        setFeedback(null);
+        try {
+            const next = await renameModelConnection(connection.id, displayName, context);
+            setConnections((current) => current.map((item) => item.id === next.id ? next : item));
+            setRenamingConnectionId(null);
+            setConnectionNameDraft('');
+            setFeedback({ type: 'success', message: 'Model account renamed.' });
+        }
+        catch (error) {
+            setFeedback({ type: 'error', message: error.message || 'Unable to rename this model account.' });
+        }
+        finally {
+            setBusyConnectionId(null);
+        }
+    }, [busyConnectionId, connectionNameDraft, context]);
+    const connectionLibrary = (_jsxs("div", { className: `${managerStyles.library} ${libraryPortalTarget ? managerStyles.libraryExternal : ''}`.trim(), "aria-label": "Connection list", children: [cloudAccessAvailable && effectiveEligible === true ? (_jsxs("button", { ref: connectButtonRef, type: "button", className: "tf-button-primary tf-button-compact", onClick: () => { void beginAuthorization(); }, disabled: Boolean(busyConnectionId || login), children: [busyConnectionId === 'new' ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Plug, { size: 14 }), "Connect ChatGPT"] })) : null, _jsx("div", { className: managerStyles.libraryList, "aria-busy": loading, children: !cloudAccessAvailable ? (_jsxs("div", { className: managerStyles.libraryState, children: [_jsx(CircleSlash, { size: 18 }), _jsx("span", { children: cloudAccessPending ? 'Checking Taskforce Cloud sign-in…' : 'Taskforce Cloud sign-in required.' })] })) : effectiveEligible === false ? (_jsxs("div", { className: managerStyles.libraryState, children: [_jsx(CircleSlash, { size: 18 }), _jsx("span", { children: "Connected accounts are not enabled." })] })) : effectiveEligible === null || loading ? (_jsxs("div", { className: managerStyles.libraryState, children: [_jsx(Loader2, { size: 16, className: styles.spinner }), _jsx("span", { children: "Loading connections\u2026" })] })) : connections.length === 0 ? (_jsxs("div", { className: managerStyles.libraryState, children: [_jsx(Plug, { size: 18 }), _jsx("span", { children: "No connections yet." })] })) : connections.map((connection) => {
+                    const selected = connection.id === selectedConnectionId;
+                    return (_jsxs("button", { type: "button", className: `${managerStyles.libraryCard} ${selected ? managerStyles.libraryCardSelected : ''}`.trim(), "aria-pressed": selected, "aria-label": `Open ${connectionAccountLabel(connection)}`, onClick: () => {
+                            setSelectedConnectionId(connection.id);
+                            setRenamingConnectionId(null);
+                            setConnectionNameDraft('');
+                        }, children: [_jsx("span", { className: `${managerStyles.libraryCardIcon} ${managerStyles.libraryCardLogo}`.trim(), "aria-hidden": "true", children: _jsx("img", { src: CHATGPT_LOGO_URL, alt: "" }) }), _jsxs("span", { className: managerStyles.libraryCardBody, children: [_jsx("strong", { children: connectionAccountLabel(connection) }), _jsxs("span", { children: ["OpenAI \u00B7 ", connection.displayMetadata.planLabel || 'ChatGPT'] })] }), _jsx("span", { className: connectionStatusClass(connection.lifecycleStatus), children: connectionStatusLabel(connection.lifecycleStatus) })] }, connection.id));
+                }) })] }));
+    let mainContent;
+    if (!cloudAccessAvailable) {
+        mainContent = (_jsxs("div", { className: styles.taskforceModelConnectionsEmpty, children: [_jsx(CircleSlash, { size: 28 }), _jsx("strong", { children: cloudAccessPending ? 'Checking Taskforce Cloud sign-in' : cloudAuthConfigured ? 'Taskforce Cloud sign-in required' : 'Taskforce Cloud connection required' }), _jsx("span", { children: cloudAccessPending
+                        ? 'Connection management will be available after your sign-in status is resolved.'
+                        : cloudAuthConfigured
+                            ? 'Sign in to Taskforce Cloud to manage connected model accounts from this local runtime.'
+                            : 'Connect this local runtime to a Taskforce Cloud environment to manage connected model accounts.' })] }));
+    }
+    else if (effectiveEligible === false) {
+        mainContent = (_jsxs("div", { className: styles.taskforceModelConnectionsEmpty, children: [_jsx(CircleSlash, { size: 28 }), _jsx("strong", { children: "Connected accounts are not enabled" }), _jsx("span", { children: "Contact a Taskforce administrator to enable subscription-backed models for this account." })] }));
+    }
+    else if (effectiveEligible === null) {
+        mainContent = feedback?.type === 'error' ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: feedback.message }), _jsxs("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => { void loadConnections(); }, disabled: loading, children: [_jsx(RefreshCw, { size: 14 }), " Retry"] })] })) : (_jsxs("div", { className: styles.taskforceModelConnectionsLoading, children: [_jsx(Loader2, { size: 18, className: styles.spinner }), " Checking connection access"] }));
+    }
+    else {
+        const connection = selectedConnection;
+        const busy = connection ? busyConnectionId === connection.id : false;
+        const canAuthorize = connection?.lifecycleStatus === 'pending'
+            || connection?.lifecycleStatus === 'reconnect_required'
+            || connection?.lifecycleStatus === 'disconnected';
+        mainContent = (_jsxs(_Fragment, { children: [_jsx("header", { className: styles.taskforceModelConnectionsHeader, children: _jsxs("div", { children: [_jsx("span", { className: "tf-heading-section", children: login ? 'Add connection' : connection ? 'Connection details' : 'Connections' }), _jsx("p", { className: "tf-text-secondary", children: "Authorize accounts used by your Taskforce Agents in this environment." })] }) }), feedback ? (_jsxs("div", { className: feedback.type === 'error' ? styles.taskforceAgentTestError : styles.taskforceAgentTestNotice, role: feedback.type === 'error' ? 'alert' : 'status', children: [feedback.type === 'error' ? _jsx(AlertTriangle, { size: 14 }) : _jsx(Check, { size: 14 }), _jsx("span", { children: feedback.message }), feedback.returnToAgent ? (_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: onReturnToAgent, children: "Return to Agent" })) : null] })) : null, login ? (_jsxs("section", { className: `${styles.taskforceModelConnectionCard} ${styles.taskforceModelConnectionLogin}`, children: [_jsxs("div", { className: styles.taskforceModelConnectionCardHeader, children: [_jsxs("div", { children: [_jsx("strong", { children: "Authorize ChatGPT" }), _jsx("span", { children: "Enter this one-time code in the browser window." })] }), _jsxs("span", { className: "tf-chip-warning", children: [_jsx(Loader2, { size: 12, className: styles.spinner }), " Waiting"] })] }), _jsxs("div", { className: styles.taskforceModelConnectionCodeRow, children: [_jsx("code", { children: login.userCode }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: () => { void copyCode(); }, title: copied ? 'Authorization code copied' : 'Copy authorization code', "aria-label": copied ? 'Authorization code copied' : 'Copy authorization code', children: copied ? _jsx(Check, { size: 15 }) : _jsx(Copy, { size: 15 }) }), _jsx("span", { role: "status", "aria-live": "polite", children: copied ? 'Code copied.' : '' }), _jsxs("a", { className: "tf-button-secondary tf-button-compact", href: login.verificationUrl, target: "_blank", rel: "noreferrer", children: [_jsx(ExternalLink, { size: 14 }), " Open ChatGPT"] }), _jsxs("button", { type: "button", className: "tf-button-ghost tf-button-compact", onClick: () => { void cancelLogin(); }, children: [_jsx(X, { size: 14 }), " Cancel"] })] })] })) : loading ? (_jsxs("div", { className: styles.taskforceModelConnectionsLoading, children: [_jsx(Loader2, { size: 18, className: styles.spinner }), " Loading connections"] })) : !connection ? (_jsxs("div", { className: styles.taskforceModelConnectionsEmpty, children: [_jsx(Plug, { size: 28 }), _jsx("strong", { children: connections.length === 0 ? 'No connected accounts' : 'Select a connection' }), _jsx("span", { children: connections.length === 0
+                                ? 'Connect ChatGPT to run eligible Codex Agents with your subscription.'
+                                : 'Choose an account from the Connection Library to view and manage it.' })] })) : (_jsxs("section", { className: styles.taskforceModelConnectionCard, children: [_jsxs("div", { className: styles.taskforceModelConnectionCardHeader, children: [_jsxs("div", { className: styles.taskforceModelConnectionIdentity, children: [_jsx("span", { className: styles.taskforceModelConnectionLogo, children: _jsx("img", { src: CHATGPT_LOGO_URL, alt: "" }) }), _jsxs("div", { className: styles.taskforceModelConnectionIdentityText, children: [renamingConnectionId === connection.id ? (_jsxs("div", { className: styles.taskforceModelConnectionNameEditor, children: [_jsx("input", { className: styles.input, value: connectionNameDraft, onChange: (event) => setConnectionNameDraft(event.target.value), "aria-label": "Model account name", maxLength: 80, autoFocus: true }), _jsx("button", { type: "button", className: "tf-control-icon", "aria-label": "Save model account name", title: "Save name", onClick: () => { void saveConnectionName(connection); }, disabled: busy || !connectionNameDraft.trim(), children: busy ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Check, { size: 14 }) }), _jsx("button", { type: "button", className: "tf-control-icon", "aria-label": "Cancel model account rename", title: "Cancel", onClick: () => {
+                                                                setRenamingConnectionId(null);
+                                                                setConnectionNameDraft('');
+                                                            }, disabled: busy, children: _jsx(X, { size: 14 }) })] })) : (_jsxs("div", { className: styles.taskforceModelConnectionNameRow, children: [_jsx("strong", { children: connectionAccountLabel(connection) }), _jsx("button", { type: "button", className: "tf-control-icon", "aria-label": `Rename ${connectionAccountLabel(connection)}`, title: "Rename model account", onClick: () => {
+                                                                setRenamingConnectionId(connection.id);
+                                                                setConnectionNameDraft(connectionAccountLabel(connection));
+                                                            }, children: _jsx(Pencil, { size: 13 }) })] })), _jsx("span", { children: "OpenAI \u00B7 ChatGPT/Codex subscription" })] })] }), _jsx("span", { className: connectionStatusClass(connection.lifecycleStatus), children: connectionStatusLabel(connection.lifecycleStatus) })] }), _jsxs("div", { className: styles.taskforceModelConnectionMeta, children: [_jsx("span", { children: connection.displayMetadata.planLabel || 'Subscription plan' }), _jsx("span", { children: connectionLastChecked(connection) })] }), connection.failureCode ? (_jsx("span", { className: "tf-text-warning", children: modelConnectionFailureMessage(connection.failureCode) })) : null, _jsxs("div", { className: styles.taskforceModelConnectionActions, children: [canAuthorize ? (_jsxs("button", { type: "button", className: "tf-button-primary tf-button-compact", onClick: () => { void beginAuthorization(connection); }, disabled: Boolean(busyConnectionId || login), children: [busy ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(RotateCcw, { size: 14 }), connection.lifecycleStatus === 'pending' ? 'Authorize' : 'Reconnect'] })) : null, connection.lifecycleStatus === 'active' ? (_jsxs(_Fragment, { children: [_jsxs("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => { void runConnectionAction(connection, 'verify'); }, disabled: busy, children: [_jsx(Check, { size: 14 }), " Verify"] }), _jsxs("button", { type: "button", className: "tf-button-ghost tf-button-compact", onClick: () => { void runConnectionAction(connection, 'refresh'); }, disabled: busy, title: "Refresh ChatGPT account status", children: [_jsx(RefreshCw, { size: 14 }), " Refresh"] }), _jsxs("button", { type: "button", className: "tf-button-ghost tf-button-compact", onClick: () => { void runConnectionAction(connection, 'disconnect'); }, disabled: busy, children: [_jsx(LogOut, { size: 14 }), " Disconnect"] })] })) : null, (connection.lifecycleStatus === 'pending'
+                                    || connection.lifecycleStatus === 'reconnect_required'
+                                    || connection.lifecycleStatus === 'disconnected'
+                                    || connection.lifecycleStatus === 'revoked') ? (_jsxs("button", { type: "button", className: "tf-button-destructive tf-button-compact", onClick: () => { void runConnectionAction(connection, 'remove'); }, disabled: busy, children: [_jsx(Trash2, { size: 14 }), " Remove"] })) : null] })] }))] }));
+    }
+    return (_jsxs("div", { className: `${styles.taskforceModelConnectionsRoot} ${libraryPortalTarget ? styles.taskforceModelConnectionsRootExternalLibrary : ''}`.trim(), children: [libraryPortalTarget ? createPortal(connectionLibrary, libraryPortalTarget) : connectionLibrary, _jsx("div", { className: styles.taskforceModelConnectionsWorkspace, children: mainContent })] }));
+}

package/dist/components/features/agentConnections/modelConnectionsApi.d.ts

@@ -0,0 +1,65 @@
+export type ModelConnectionLifecycleStatus = 'pending' | 'active' | 'reconnect_required' | 'revoked' | 'disconnected';
+export type ModelConnection = {
+    id: string;
+    providerKey: string;
+    authenticationType: string;
+    lifecycleStatus: ModelConnectionLifecycleStatus;
+    displayMetadata: {
+        displayName?: string;
+        accountEmail?: string;
+        accountLabel?: string;
+        planLabel?: string;
+    };
+    lastVerifiedAt: string | null;
+    lastRefreshedAt: string | null;
+    failureCode: string | null;
+    createdAt: string;
+    updatedAt: string;
+};
+export type DeviceCodeLoginSession = {
+    id: string;
+    connectionId: string;
+    status: 'pending' | 'active' | 'failed' | 'cancelled' | 'expired';
+    userCode: string;
+    verificationUrl: string;
+    expiresAt: string;
+    failureCode?: string;
+};
+export type AgentConnectionBinding = {
+    bound: boolean;
+    available: boolean;
+    providerKey?: string;
+    modelSource?: string;
+    ownerIsCaller?: boolean;
+    connectionId?: string;
+    reasonCode?: string;
+};
+export type ModelConnectionsSnapshot = {
+    eligible: boolean;
+    connections: ModelConnection[];
+};
+export declare class ModelConnectionsApiError extends Error {
+    readonly code?: string | undefined;
+    readonly status?: number | undefined;
+    constructor(message: string, code?: string | undefined, status?: number | undefined);
+}
+export type ModelConnectionsApiContext = {
+    apiBaseUrl?: string;
+    workspaceId?: string;
+    resolveApiUrl?: (path: string) => string;
+};
+export declare function listModelConnections(context: ModelConnectionsApiContext): Promise<ModelConnection[]>;
+export declare function loadModelConnectionsSnapshot(context: ModelConnectionsApiContext): Promise<ModelConnectionsSnapshot>;
+export declare function createOpenAiCodexConnection(context: ModelConnectionsApiContext): Promise<ModelConnection>;
+export declare function startDeviceCodeLogin(connectionId: string, context: ModelConnectionsApiContext): Promise<DeviceCodeLoginSession>;
+export declare function getDeviceCodeLogin(connectionId: string, sessionId: string, context: ModelConnectionsApiContext): Promise<DeviceCodeLoginSession>;
+export declare function cancelDeviceCodeLogin(connectionId: string, sessionId: string, context: ModelConnectionsApiContext): Promise<DeviceCodeLoginSession>;
+export declare const verifyModelConnection: (connectionId: string, context: ModelConnectionsApiContext) => Promise<ModelConnection>;
+export declare const refreshModelConnection: (connectionId: string, context: ModelConnectionsApiContext) => Promise<ModelConnection>;
+export declare const disconnectModelConnection: (connectionId: string, context: ModelConnectionsApiContext) => Promise<ModelConnection>;
+export declare function renameModelConnection(connectionId: string, displayName: string, context: ModelConnectionsApiContext): Promise<ModelConnection>;
+export declare function removeModelConnection(connectionId: string, context: ModelConnectionsApiContext): Promise<void>;
+export declare function inspectAgentConnectionBinding(agentId: string, context: ModelConnectionsApiContext): Promise<AgentConnectionBinding>;
+export declare function bindAgentConnection(agentId: string, connectionId: string, context: ModelConnectionsApiContext): Promise<AgentConnectionBinding>;
+export declare function clearAgentConnectionBinding(agentId: string, context: ModelConnectionsApiContext): Promise<void>;
+export declare function modelConnectionFailureMessage(code: string | null | undefined, fallback?: string): string;