@taskforcehq/taskforce 0.3.328 → 0.3.330

package/dist/components/features/TaskforceAgentsModule.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { AlertTriangle, Beaker, Bot, BriefcaseBusiness, CheckCircle, ChevronLeft, Database, ExternalLink, Loader2, MessageSquare, Pencil, Plug, Plus, RotateCcw, Save, Send, Sparkles, X } from 'lucide-react';
+import { AlertTriangle, Beaker, Bot, BriefcaseBusiness, Check, CheckCircle, ChevronLeft, Copy, Database, ExternalLink, Loader2, Pencil, Plug, Plus, RotateCcw, Save, Send, Sparkles, X } from 'lucide-react';
 import styles from '../../Taskforce.module.css';
-import { AI_PROFILE_COLOR_TOKENS, assignedAiProfileColor } from '../../shared/aiProfileColors.js';
-import { COLOR_PALETTE } from '../../shared/colorPalette.js';
-import { DEFAULT_TASKFORCE_AGENT_MODEL_KEY, DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY, TASKFORCE_AGENT_PROVIDER_OPTIONS, labelForTaskforceAgentModel, labelForTaskforceAgentProvider, modelsForTaskforceAgentProvider, normalizeTaskforceAgentModelKey, normalizeTaskforceAgentProviderKey, } from '../../shared/taskforceAgentModels';
+import { AI_PROFILE_SIGNATURE_COLOR_OPTIONS, assignedAiProfileColor } from '../../shared/aiProfileColors.js';
+import { DEFAULT_TASKFORCE_AGENT_MODEL_KEY, DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY, TASKFORCE_AGENT_MODEL_OPTIONS, TASKFORCE_AGENT_PROVIDER_OPTIONS, isTaskforceAgentModelVisible, labelForTaskforceAgentModel, labelForTaskforceAgentProvider, normalizeTaskforceAgentProviderKey, } from '../../shared/taskforceAgentModels';
 import { dispatchTaskforceAgentsMutated, TASKFORCE_AGENTS_MUTATED_EVENT } from '../../utils/taskforceAgentEvents';
 import { dispatchTaskforceTasksMutated } from '../../utils/taskEvents';
 import { buildVersionedAvatarUrl } from '../../utils/avatarDisplay';
@@ -23,10 +22,48 @@ import { AVATAR_ART_STYLE_PRESETS, buildTaskforceAgentDefinitionFromDraft, creat
 import { SkillManagerPanel } from './agentSkills/SkillManagerPanel.js';
 import { EffectiveConfigurationSummary, FutureLibrarySummary, FutureWorkspacePanel, ToolAccessSelector, } from './agentCapabilities/AgentCapabilitiesPrototype.js';
 import { applyCloudWorkflowCompletionProjection, } from './workflowManager/workflowManagerApi.js';
+import { ModelConnectionsPanel } from './agentConnections/ModelConnectionsPanel.js';
+import { bindAgentConnection, clearAgentConnectionBinding, inspectAgentConnectionBinding, listModelConnections, ModelConnectionsApiError, } from './agentConnections/modelConnectionsApi.js';
 const DEFAULT_SYSTEM_PROMPT = 'Be concise and actionable.';
 const DEFAULT_AGENT_NAME = 'New Taskforce Agent';
 const TEST_PROMPT_PLACEHOLDER = 'Message this agent...';
 const AGENT_ROSTER_REFRESH_INTERVAL_MS = 10_000;
+const AGENT_MODEL_SOURCE_OPTIONS = [
+    { key: 'taskforce_managed', label: 'Taskforce Managed' },
+];
+const CONNECTION_SOURCE_PREFIX = 'connection:';
+const LOCAL_AGENT_BINDING_SYNC_RETRIES = 20;
+const LOCAL_AGENT_BINDING_SYNC_DELAY_MS = 250;
+async function bindAgentConnectionAfterLocalSync(agentId, connectionId, context, waitForCloudSync) {
+    for (let attempt = 0;; attempt += 1) {
+        try {
+            return await bindAgentConnection(agentId, connectionId, context);
+        }
+        catch (error) {
+            const retryable = waitForCloudSync
+                && error instanceof ModelConnectionsApiError
+                && error.code === 'TASKFORCE_AGENT_NOT_FOUND'
+                && attempt < LOCAL_AGENT_BINDING_SYNC_RETRIES;
+            if (!retryable)
+                throw error;
+            await new Promise((resolve) => window.setTimeout(resolve, LOCAL_AGENT_BINDING_SYNC_DELAY_MS));
+        }
+    }
+}
+function modelConnectionDisplayName(connection) {
+    return String(connection.displayMetadata.displayName
+        || connection.displayMetadata.accountLabel
+        || connection.displayMetadata.accountEmail
+        || 'ChatGPT subscription');
+}
+function modelSourceGroupForOption(model) {
+    return model?.source === 'personal_byom' || model?.source === 'subscription_dev'
+        ? 'personal_connection'
+        : 'taskforce_managed';
+}
+function modelMatchesSourceGroup(model, sourceGroup) {
+    return modelSourceGroupForOption(model) === sourceGroup;
+}
 const AGENT_BUILDER_TABS = [
     { id: 'agents', label: 'Agents' },
     { id: 'roles', label: 'Roles' },
@@ -100,17 +137,18 @@ function formatModelAvailability(availability) {
     return 'Unavailable';
 }
 const SENSITIVE_TOOL_ARG_PATTERN = /(token|secret|password|credential|api[-_]?key|access[-_]?key)/i;
-function sanitizeToolLogValue(value) {
+const MAX_COPIED_TOOL_RESULT_CHARS = 20_000;
+function sanitizeToolLogValue(value, truncateStrings = true) {
     if (Array.isArray(value))
-        return value.map((item) => sanitizeToolLogValue(item));
+        return value.map((item) => sanitizeToolLogValue(item, truncateStrings));
     if (!value || typeof value !== 'object') {
         if (typeof value !== 'string')
             return value;
-        return value.length > 240 ? `${value.slice(0, 237).trim()}...` : value;
+        return truncateStrings && value.length > 240 ? `${value.slice(0, 237).trim()}...` : value;
     }
     return Object.fromEntries(Object.entries(value).map(([key, entry]) => [
         key,
-        SENSITIVE_TOOL_ARG_PATTERN.test(key) ? '[redacted]' : sanitizeToolLogValue(entry),
+        SENSITIVE_TOOL_ARG_PATTERN.test(key) ? '[redacted]' : sanitizeToolLogValue(entry, truncateStrings),
     ]));
 }
 function formatToolLogJson(value) {
@@ -124,6 +162,20 @@ function formatToolLogResult(value) {
         return 'No result text returned.';
     return text.length > 320 ? `${text.slice(0, 317).trim()}...` : text;
 }
+function formatToolActivityClipboard(toolCall) {
+    const rawResult = String(toolCall.resultText || 'No result text returned.');
+    const result = rawResult.length > MAX_COPIED_TOOL_RESULT_CHARS
+        ? `${rawResult.slice(0, MAX_COPIED_TOOL_RESULT_CHARS)}\n[Result truncated after ${MAX_COPIED_TOOL_RESULT_CHARS.toLocaleString()} characters]`
+        : rawResult;
+    return [
+        `Tool: ${toolCall.name}`,
+        `Status: ${toolCall.ok ? 'ok' : 'failed'}`,
+        'Arguments',
+        JSON.stringify(sanitizeToolLogValue(toolCall.arguments || {}, false), null, 2),
+        'Result',
+        result,
+    ].join('\n');
+}
 function formatToolActivitySummary(toolActivity) {
     const count = toolActivity.length;
     if (count === 0)
@@ -210,7 +262,7 @@ function formatConversationOption(summary, fallbackContext = null) {
     const label = count > 0 ? `${title} (${count})` : title;
     return taskContext ? `${formatTaskContextLabel(taskContext)} · ${label}` : label;
 }
-export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true, onCloseAgentRosterTray, launchContext = null, onClearLaunchContext, onOpenTaskContext, taskReferences, surface = 'module', runtimeMode = 'local', cloudAuthConfigured = false, authSessionResolved = true, isAuthenticated = false, resolveCloudAuthUrl, theme = 'dark', rememberedAgentId, rememberedConversationId, rememberedConversationByAgentId, rememberedSelectionReady = true, onRememberSelection, onRenderDrawerHeader, onOpenConversation, }) {
+export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true, onCloseAgentRosterTray, launchContext = null, onClearLaunchContext, onOpenTaskContext, taskReferences, surface = 'module', runtimeMode = 'local', cloudAuthConfigured = false, authSessionResolved = true, isAuthenticated = false, resolveCloudAuthUrl, theme = 'dark', rememberedAgentId, rememberedConversationId, rememberedConversationByAgentId, rememberedSelectionReady = true, onRememberSelection, onRenderDrawerHeader, }) {
     const logIdRef = useRef(1);
     const initialAgentWorkspaceRef = useRef(null);
     const loadedAgentWorkspaceRef = useRef(null);
@@ -220,6 +272,18 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     const conversationEndRef = useRef(null);
     const conversationRenameRunIdRef = useRef(0);
     const draftTestRunIdRef = useRef(0);
+    const conversationHistoryRunIdRef = useRef(0);
+    const conversationMutationRevisionRef = useRef(0);
+    const conversationCreateRunIdRef = useRef(0);
+    const conversationCreateScope = [
+        workspaceId,
+        String(launchContext?.taskId || ''),
+        String(launchContext?.taskReference || ''),
+        String(launchContext?.taskTitle || ''),
+    ].join('\n');
+    const conversationCreateScopeRef = useRef(conversationCreateScope);
+    conversationCreateScopeRef.current = conversationCreateScope;
+    const conversationHistoryLoadRef = useRef(null);
     const builderTabRefs = useRef({
         agents: null,
         roles: null,
@@ -228,12 +292,26 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         resources: null,
     });
     const [activeBuilderTab, setActiveBuilderTab] = useState('agents');
+    const activateBuilderTab = useCallback((tab, focus = false) => {
+        setActiveBuilderTab(tab);
+        if (focus)
+            window.setTimeout(() => builderTabRefs.current[tab]?.focus(), 0);
+    }, []);
+    const [connectionRefreshKey, setConnectionRefreshKey] = useState(0);
     const [roleLibraryPortalTarget, setRoleLibraryPortalTarget] = useState(null);
     const [skillLibraryPortalTarget, setSkillLibraryPortalTarget] = useState(null);
+    const [connectionLibraryPortalTarget, setConnectionLibraryPortalTarget] = useState(null);
     const [agents, setAgents] = useState([]);
+    const [availableModelOptions, setAvailableModelOptions] = useState(() => (runtimeMode === 'local'
+        ? TASKFORCE_AGENT_MODEL_OPTIONS.filter(isTaskforceAgentModelVisible)
+        : []));
     const [selectedAgentId, setSelectedAgentId] = useState(null);
     const [agentName, setAgentName] = useState('');
     const [modelProvider, setModelProvider] = useState('taskforce_hq');
+    const [modelSourceGroup, setModelSourceGroup] = useState('taskforce_managed');
+    const [modelConnections, setModelConnections] = useState([]);
+    const [selectedConnectionId, setSelectedConnectionId] = useState('');
+    const [agentConnectionBinding, setAgentConnectionBinding] = useState(null);
     const [providerKey, setProviderKey] = useState(DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY);
     const [modelKey, setModelKey] = useState(DEFAULT_TASKFORCE_AGENT_MODEL_KEY);
     const [modelTier, setModelTier] = useState('balanced');
@@ -248,7 +326,6 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     }, []);
     const [signatureColor, setSignatureColor] = useState('');
     const [signatureColorDirty, setSignatureColorDirty] = useState(false);
-    const [signatureColorReset, setSignatureColorReset] = useState(false);
     const [prompt, setPrompt] = useState('');
     const [conversationId, setConversationId] = useState(null);
     const [conversationSummaries, setConversationSummaries] = useState([]);
@@ -259,6 +336,7 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     const [savingConversationTitle, setSavingConversationTitle] = useState(false);
     const [result, setResult] = useState(null);
     const [toolActivity, setToolActivity] = useState([]);
+    const [toolCopyStatus, setToolCopyStatus] = useState(null);
     const [promptStatus, setPromptStatus] = useState('');
     const [logs, setLogs] = useState(() => [
         {
@@ -275,7 +353,11 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     const [draftTestToolActivity, setDraftTestToolActivity] = useState([]);
     const [draftTestError, setDraftTestError] = useState('');
     const [testingDraft, setTestingDraft] = useState(false);
+    const [testPanelOpen, setTestPanelOpen] = useState(false);
     const [loadingAgents, setLoadingAgents] = useState(false);
+    const [modelCatalogError, setModelCatalogError] = useState('');
+    const [modelCatalogRefreshKey, setModelCatalogRefreshKey] = useState(0);
+    const cloudModelCatalogActiveRef = useRef(false);
     const [loadingConversationList, setLoadingConversationList] = useState(false);
     const [loadingConversation, setLoadingConversation] = useState(false);
     const [savingAgent, setSavingAgent] = useState(false);
@@ -290,9 +372,66 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     const [agentProfileTrayOpen, setAgentProfileTrayOpen] = useState(false);
     const [avatarSyncingAgentIds, setAvatarSyncingAgentIds] = useState(() => new Set());
     const pendingCloudAvatarRevisionByAgentIdRef = useRef(new Map());
-    const configuredProviderOptions = useMemo(() => TASKFORCE_AGENT_PROVIDER_OPTIONS.filter((provider) => modelsForTaskforceAgentProvider(provider.key).length > 0), []);
-    const modelOptions = useMemo(() => modelsForTaskforceAgentProvider(providerKey), [providerKey]);
+    const bindingMutationAgentIdRef = useRef(null);
+    const bindingInspectionGenerationRef = useRef(0);
+    const configuredModelSourceOptions = useMemo(() => {
+        const options = AGENT_MODEL_SOURCE_OPTIONS
+            .filter((source) => availableModelOptions.some((model) => modelMatchesSourceGroup(model, source.key)))
+            .map((source) => ({ key: source.key, label: source.label }));
+        const activeConnections = modelConnections.filter((connection) => (connection.lifecycleStatus === 'active'
+            && availableModelOptions.some((model) => (model.source === 'subscription_dev'
+                && model.providerKey === connection.providerKey))));
+        for (const connection of activeConnections) {
+            options.push({
+                key: `${CONNECTION_SOURCE_PREFIX}${connection.id}`,
+                label: `${modelConnectionDisplayName(connection)} · ${labelForTaskforceAgentProvider(connection.providerKey)}`,
+            });
+        }
+        if (modelSourceGroup === 'personal_connection' && selectedConnectionId
+            && !activeConnections.some((connection) => connection.id === selectedConnectionId)) {
+            const unavailable = modelConnections.find((connection) => connection.id === selectedConnectionId);
+            options.push({
+                key: `${CONNECTION_SOURCE_PREFIX}${selectedConnectionId}`,
+                label: `${unavailable ? modelConnectionDisplayName(unavailable) : 'Connected account'} (unavailable)`,
+                disabled: true,
+            });
+        }
+        else if (modelSourceGroup === 'personal_connection' && !selectedConnectionId) {
+            options.push({
+                key: agentConnectionBinding?.bound && agentConnectionBinding.ownerIsCaller === false
+                    ? 'connected-account-private'
+                    : 'connected-account-unavailable',
+                label: agentConnectionBinding?.bound && agentConnectionBinding.ownerIsCaller === false
+                    ? 'Connected account managed by another user'
+                    : 'Connected account unavailable',
+                disabled: true,
+            });
+        }
+        return options;
+    }, [agentConnectionBinding?.bound, agentConnectionBinding?.ownerIsCaller, availableModelOptions, modelConnections, modelSourceGroup, selectedConnectionId]);
+    const modelSourceSelectionKey = modelSourceGroup === 'taskforce_managed'
+        ? 'taskforce_managed'
+        : selectedConnectionId
+            ? `${CONNECTION_SOURCE_PREFIX}${selectedConnectionId}`
+            : agentConnectionBinding?.bound && agentConnectionBinding.ownerIsCaller === false
+                ? 'connected-account-private'
+                : 'connected-account-unavailable';
+    const selectedModelConnection = useMemo(() => modelConnections.find((connection) => connection.id === selectedConnectionId) || null, [modelConnections, selectedConnectionId]);
+    const sourceModelOptions = useMemo(() => availableModelOptions.filter((model) => (modelMatchesSourceGroup(model, modelSourceGroup)
+        && (modelSourceGroup === 'taskforce_managed'
+            || !selectedModelConnection
+            || model.providerKey === selectedModelConnection.providerKey))), [availableModelOptions, modelSourceGroup, selectedModelConnection]);
+    const configuredProviderOptions = useMemo(() => TASKFORCE_AGENT_PROVIDER_OPTIONS.filter((provider) => (sourceModelOptions.some((model) => model.providerKey === provider.key)
+        || provider.key === providerKey)), [providerKey, sourceModelOptions]);
+    const modelOptions = useMemo(() => sourceModelOptions.filter((model) => model.providerKey === providerKey), [providerKey, sourceModelOptions]);
+    const normalizeAvailableModelKey = useCallback((value, provider) => {
+        const normalizedProvider = normalizeTaskforceAgentProviderKey(provider);
+        const providerModels = availableModelOptions.filter((model) => model.providerKey === normalizedProvider);
+        const key = String(value || '').trim();
+        return key || providerModels[0]?.key || '';
+    }, [availableModelOptions]);
     const selectedModel = useMemo(() => modelOptions.find((model) => model.key === modelKey) || null, [modelKey, modelOptions]);
+    const subscriptionConnectionsEligible = useMemo(() => (availableModelOptions.some((model) => model.source === 'subscription_dev')), [availableModelOptions]);
     const selectedAgent = useMemo(() => agents.find((agent) => agent.id === selectedAgentId) || null, [agents, selectedAgentId]);
     const normalizedRememberedAgentId = useMemo(() => String(rememberedAgentId || '').trim(), [rememberedAgentId]);
     const normalizedRememberedConversationId = useMemo(() => String(rememberedConversationId || '').trim(), [rememberedConversationId]);
@@ -313,6 +452,11 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     const shouldUseCloudAgentRuntime = runtimeMode === 'local' && cloudAuthConfigured;
     const canUseCloudAgentRuntime = !shouldUseCloudAgentRuntime
         || (authSessionResolved && isAuthenticated);
+    const modelConnectionCloudAccessAvailable = runtimeMode === 'cloud'
+        || (cloudAuthConfigured && authSessionResolved && isAuthenticated && Boolean(resolveCloudAuthUrl));
+    const modelConnectionCloudAccessPending = runtimeMode === 'local'
+        && cloudAuthConfigured
+        && !authSessionResolved;
     const selectedAgentAvatarUrl = useMemo(() => getAgentAvatarUrl(selectedAgent), [selectedAgent]);
     const selectedAgentAvatarSourceUrl = useMemo(() => getAgentAvatarSourceUrl(selectedAgent), [selectedAgent]);
     const isSelectedAgentAvatarSyncing = Boolean(selectedAgentId && avatarSyncingAgentIds.has(selectedAgentId));
@@ -388,21 +532,30 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         setTestingDraft(false);
     }, []);
     const applyAgent = useCallback((agent) => {
+        const switchingAgents = selectedAgentIdRef.current !== agent.id;
         conversationRenameRunIdRef.current += 1;
+        conversationCreateRunIdRef.current += 1;
+        if (switchingAgents)
+            bindingInspectionGenerationRef.current += 1;
         configurationDraftDirtyRef.current = false;
         selectedAgentIdRef.current = agent.id;
         setSelectedAgentId(agent.id);
         setAgentName(agent.name);
         setModelProvider('taskforce_hq');
+        const agentModel = availableModelOptions.find((model) => model.key === agent.modelKey);
+        setModelSourceGroup(modelSourceGroupForOption(agentModel || { source: agent.definition?.model.modelSource }));
+        if (switchingAgents) {
+            setSelectedConnectionId('');
+            setAgentConnectionBinding(null);
+        }
         setProviderKey(normalizeTaskforceAgentProviderKey(agent.providerKey));
-        setModelKey(normalizeTaskforceAgentModelKey(agent.modelKey, agent.providerKey));
+        setModelKey(normalizeAvailableModelKey(agent.modelKey, agent.providerKey));
         setModelTier(agent.modelTier);
         setDefinitionDraft(createTaskforceAgentEditorDraft(agent.definition, {
             systemPrompt: agent.systemPrompt,
         }));
         setSignatureColor(agent.color || assignedAiProfileColor(agent.id));
         setSignatureColorDirty(false);
-        setSignatureColorReset(false);
         signatureColorEditPendingRef.current = false;
         setConversationId(null);
         setConversationSummaries([]);
@@ -415,7 +568,7 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         setToolActivity([]);
         setConfigFeedback(null);
         resetDraftTest();
-    }, [resetDraftTest]);
+    }, [availableModelOptions, normalizeAvailableModelKey, resetDraftTest]);
     const selectAgent = useCallback((agent) => {
         applyAgent(agent);
         rememberSelection(agent.id, normalizedRememberedConversationByAgentId[agent.id] || null);
@@ -447,11 +600,13 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     }, []);
     const resetAgentDraft = useCallback(() => {
         conversationRenameRunIdRef.current += 1;
+        conversationCreateRunIdRef.current += 1;
         configurationDraftDirtyRef.current = false;
         selectedAgentIdRef.current = null;
         setSelectedAgentId(null);
         setAgentName('');
         setModelProvider('taskforce_hq');
+        setModelSourceGroup('taskforce_managed');
         setProviderKey(DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY);
         setModelKey(DEFAULT_TASKFORCE_AGENT_MODEL_KEY);
         setModelTier('balanced');
@@ -460,7 +615,6 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         }));
         setSignatureColor('');
         setSignatureColorDirty(false);
-        setSignatureColorReset(false);
         signatureColorEditPendingRef.current = false;
         setConversationId(null);
         setConversationSummaries([]);
@@ -510,7 +664,7 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         window.addEventListener('beforeunload', handleBeforeUnload);
         return () => window.removeEventListener('beforeunload', handleBeforeUnload);
     }, []);
-    const loadConversation = useCallback(async (agentId, nextConversationId) => {
+    const loadConversation = useCallback(async (agentId, nextConversationId, isCurrent = () => selectedAgentIdRef.current === agentId) => {
         setLoadingConversation(true);
         try {
             const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(agentId)}/conversation?workspaceId=${encodeURIComponent(workspaceId)}&conversationId=${encodeURIComponent(nextConversationId)}`, {
@@ -520,6 +674,8 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 ? await res.clone().text().catch(() => '')
                 : '';
             const payload = await res.json().catch(() => ({}));
+            if (!isCurrent())
+                return;
             if (!res.ok || payload?.success === false) {
                 const fallback = res.status === 404
                     ? 'Taskforce agent conversation API route is not available. Restart the app server so the latest routes are active.'
@@ -527,8 +683,6 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 appendLog('error', String(payload?.error || responseText || fallback));
                 return;
             }
-            if (selectedAgentIdRef.current !== agentId)
-                return;
             const nextConversation = payload?.conversation || null;
             applyConversation(nextConversation);
             if (nextConversation)
@@ -537,13 +691,16 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             setToolActivity([]);
         }
         catch (err) {
-            appendLog('error', String(err?.message || err || 'Unable to load saved agent conversation.'));
+            if (isCurrent()) {
+                appendLog('error', String(err?.message || err || 'Unable to load saved agent conversation.'));
+            }
         }
         finally {
-            setLoadingConversation(false);
+            if (isCurrent())
+                setLoadingConversation(false);
         }
     }, [appendLog, applyConversation, rememberSelection, upsertConversationSummary, workspaceId]);
-    const loadConversationHistory = useCallback(async (agentId) => {
+    const loadConversationHistory = useCallback(async (agentId, isCurrent) => {
         setLoadingConversationList(true);
         setLoadingConversation(true);
         try {
@@ -554,6 +711,8 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 ? await res.clone().text().catch(() => '')
                 : '';
             const payload = await res.json().catch(() => ({}));
+            if (!isCurrent())
+                return;
             if (!res.ok || payload?.success === false) {
                 const fallback = res.status === 404
                     ? 'Taskforce agent conversation API route is not available. Restart the app server so the latest routes are active.'
@@ -561,8 +720,6 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 appendLog('error', String(payload?.error || responseText || fallback));
                 return;
             }
-            if (selectedAgentIdRef.current !== agentId)
-                return;
             const summaries = Array.isArray(payload?.conversations) ? payload.conversations : [];
             setConversationSummaries(summaries);
             if (summaries.length > 0) {
@@ -576,7 +733,7 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                     : null;
                 const nextConversationId = restoredConversation?.id || taskConversation?.id || (taskLaunchContext ? null : summaries[0].id);
                 if (nextConversationId) {
-                    await loadConversation(agentId, nextConversationId);
+                    await loadConversation(agentId, nextConversationId, isCurrent);
                 }
                 else {
                     applyConversation(null);
@@ -591,13 +748,45 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             }
         }
         catch (err) {
-            appendLog('error', String(err?.message || err || 'Unable to load saved agent conversations.'));
+            if (isCurrent()) {
+                appendLog('error', String(err?.message || err || 'Unable to load saved agent conversations.'));
+            }
         }
         finally {
-            setLoadingConversationList(false);
-            setLoadingConversation(false);
+            if (isCurrent()) {
+                setLoadingConversationList(false);
+                setLoadingConversation(false);
+            }
         }
     }, [appendLog, applyConversation, loadConversation, normalizedRememberedAgentId, normalizedRememberedConversationByAgentId, normalizedRememberedConversationId, rememberSelection, taskLaunchContext, workspaceId]);
+    const startConversationHistoryLoad = useCallback((agentId, force = false) => {
+        const current = conversationHistoryLoadRef.current;
+        if (current?.agentId === agentId
+            && current.loader === loadConversationHistory
+            && !force) {
+            return current.promise || Promise.resolve();
+        }
+        const historyRunId = ++conversationHistoryRunIdRef.current;
+        const mutationRevision = conversationMutationRevisionRef.current;
+        const isCurrent = () => (selectedAgentIdRef.current === agentId
+            && conversationHistoryRunIdRef.current === historyRunId
+            && conversationMutationRevisionRef.current === mutationRevision);
+        const promise = loadConversationHistory(agentId, isCurrent).finally(() => {
+            if (conversationHistoryLoadRef.current?.promise === promise) {
+                conversationHistoryLoadRef.current = {
+                    agentId,
+                    loader: loadConversationHistory,
+                    promise: null,
+                };
+            }
+        });
+        conversationHistoryLoadRef.current = {
+            agentId,
+            loader: loadConversationHistory,
+            promise,
+        };
+        return promise;
+    }, [loadConversationHistory]);
     const loadAgents = useCallback(async (options) => {
         const quiet = options?.quiet === true;
         if (!quiet) {
@@ -623,6 +812,17 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 return;
             }
             const nextAgents = Array.isArray(payload?.agents) ? payload.agents : [];
+            const cloudModelCatalogExpected = runtimeMode === 'local'
+                && cloudAuthConfigured
+                && authSessionResolved
+                && isAuthenticated
+                && Boolean(resolveCloudAuthUrl);
+            if (Array.isArray(payload?.modelCatalog) && !cloudModelCatalogExpected) {
+                setAvailableModelOptions(payload.modelCatalog);
+            }
+            else if (runtimeMode === 'cloud') {
+                setAvailableModelOptions([]);
+            }
             loadedAgentWorkspaceRef.current = workspaceId;
             setAgents((current) => {
                 const currentById = new Map(current.map((agent) => [agent.id, agent]));
@@ -677,13 +877,129 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             if (!quiet)
                 setLoadingAgents(false);
         }
-    }, [appendLog, workspaceId]);
+    }, [appendLog, authSessionResolved, cloudAuthConfigured, isAuthenticated, resolveCloudAuthUrl, runtimeMode, workspaceId]);
     useEffect(() => {
         resetDraftTest();
     }, [resetDraftTest, workspaceId]);
     useEffect(() => {
         void loadAgents();
     }, [loadAgents]);
+    useEffect(() => {
+        if (runtimeMode !== 'local')
+            return;
+        const localModelCatalog = TASKFORCE_AGENT_MODEL_OPTIONS.filter(isTaskforceAgentModelVisible);
+        if (!cloudAuthConfigured
+            || !authSessionResolved
+            || !isAuthenticated
+            || !resolveCloudAuthUrl) {
+            if (cloudModelCatalogActiveRef.current)
+                setAvailableModelOptions(localModelCatalog);
+            cloudModelCatalogActiveRef.current = false;
+            setModelCatalogError('');
+            return;
+        }
+        cloudModelCatalogActiveRef.current = true;
+        setAvailableModelOptions([]);
+        setModelCatalogError('');
+        let cancelled = false;
+        void (async () => {
+            try {
+                const response = await fetch(resolveCloudAuthUrl('/api/taskforce/agents/model-catalog'), {
+                    credentials: 'include',
+                });
+                const payload = await response.json().catch(() => ({}));
+                if (!response.ok || payload?.success === false || !Array.isArray(payload?.modelCatalog)) {
+                    throw new Error('Cloud model catalog unavailable.');
+                }
+                if (!cancelled)
+                    setAvailableModelOptions(payload.modelCatalog);
+            }
+            catch {
+                if (!cancelled) {
+                    setModelCatalogError('Unable to load models from Taskforce Cloud. Check your connection and try again.');
+                }
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [authSessionResolved, cloudAuthConfigured, isAuthenticated, modelCatalogRefreshKey, resolveCloudAuthUrl, runtimeMode, workspaceId]);
+    useEffect(() => {
+        if (!subscriptionConnectionsEligible || !modelConnectionCloudAccessAvailable) {
+            setModelConnections([]);
+            return;
+        }
+        let cancelled = false;
+        void listModelConnections({ workspaceId, resolveApiUrl: resolveCloudAuthUrl })
+            .then((connections) => {
+            if (!cancelled)
+                setModelConnections(connections);
+        })
+            .catch(() => {
+            if (!cancelled)
+                setModelConnections([]);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [activeBuilderTab, connectionRefreshKey, modelConnectionCloudAccessAvailable, resolveCloudAuthUrl, subscriptionConnectionsEligible, workspaceId]);
+    useEffect(() => {
+        const usesConnectedAccount = selectedAgent?.definition?.model.modelSource === 'subscription_dev';
+        if (!selectedAgentId || !usesConnectedAccount || !modelConnectionCloudAccessAvailable) {
+            setAgentConnectionBinding(null);
+            if (!usesConnectedAccount)
+                setSelectedConnectionId('');
+            return;
+        }
+        if (bindingMutationAgentIdRef.current === selectedAgentId)
+            return;
+        const generation = ++bindingInspectionGenerationRef.current;
+        let cancelled = false;
+        void inspectAgentConnectionBinding(selectedAgentId, { workspaceId, resolveApiUrl: resolveCloudAuthUrl })
+            .then((binding) => {
+            if (cancelled
+                || generation !== bindingInspectionGenerationRef.current
+                || bindingMutationAgentIdRef.current === selectedAgentId
+                || configurationDraftDirtyRef.current)
+                return;
+            setAgentConnectionBinding(binding);
+            setSelectedConnectionId(binding.ownerIsCaller ? String(binding.connectionId || '') : '');
+        })
+            .catch(() => {
+            if (cancelled
+                || generation !== bindingInspectionGenerationRef.current
+                || bindingMutationAgentIdRef.current === selectedAgentId
+                || configurationDraftDirtyRef.current)
+                return;
+            setAgentConnectionBinding(null);
+            setSelectedConnectionId('');
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [modelConnectionCloudAccessAvailable, resolveCloudAuthUrl, selectedAgent?.definition?.model.modelSource, selectedAgentId, workspaceId]);
+    useEffect(() => {
+        if (availableModelOptions.length === 0)
+            return;
+        const currentModel = availableModelOptions.find((model) => model.key === modelKey);
+        if (currentModel) {
+            const currentSourceGroup = modelSourceGroupForOption(currentModel);
+            if (currentSourceGroup !== modelSourceGroup)
+                setModelSourceGroup(currentSourceGroup);
+            if (currentModel.providerKey !== providerKey)
+                setProviderKey(currentModel.providerKey);
+            return;
+        }
+        if (selectedAgentId && modelKey)
+            return;
+        const nextModel = sourceModelOptions.find((model) => model.providerKey === providerKey)
+            || sourceModelOptions[0]
+            || availableModelOptions[0];
+        setModelSourceGroup(modelSourceGroupForOption(nextModel));
+        setProviderKey(nextModel.providerKey);
+        setModelKey(nextModel.key);
+        setModelTier(nextModel.defaultTier);
+    }, [availableModelOptions, modelKey, modelSourceGroup, providerKey, selectedAgentId, sourceModelOptions]);
     useEffect(() => {
         if (!rememberedSelectionReady
             || loadedAgentWorkspaceRef.current !== workspaceId
@@ -720,12 +1036,12 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             const eventAgentId = String(detail?.agentId || '').trim();
             const activeAgentId = selectedAgentIdRef.current;
             if (activeAgentId && (!eventAgentId || eventAgentId === activeAgentId)) {
-                void loadConversationHistory(activeAgentId);
+                void startConversationHistoryLoad(activeAgentId, true);
             }
         };
         window.addEventListener(TASKFORCE_AGENTS_MUTATED_EVENT, handleAgentsMutated);
         return () => window.removeEventListener(TASKFORCE_AGENTS_MUTATED_EVENT, handleAgentsMutated);
-    }, [loadAgents, loadConversationHistory, shouldUseCloudAvatarGeneration, workspaceId]);
+    }, [loadAgents, shouldUseCloudAvatarGeneration, startConversationHistoryLoad, workspaceId]);
     useEffect(() => {
         const handleAiProfilesMutated = (event) => {
             const detail = event.detail;
@@ -768,8 +1084,8 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
     useEffect(() => {
         if (!selectedAgentId)
             return;
-        void loadConversationHistory(selectedAgentId);
-    }, [loadConversationHistory, selectedAgentId]);
+        void startConversationHistoryLoad(selectedAgentId);
+    }, [selectedAgentId, startConversationHistoryLoad]);
     useEffect(() => {
         if (avatarSyncingAgentIds.size === 0)
             return;
@@ -817,15 +1133,26 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         providerKey,
         modelKey,
         tier: selectedModel?.defaultTier || modelTier,
+        connectionScope: selectedModel?.source === 'subscription_dev'
+            ? (modelConnectionCloudAccessAvailable ? 'personal' : 'local_dev')
+            : undefined,
     })), [
         agentName,
         definitionDraft,
         modelKey,
         modelTier,
+        modelConnectionCloudAccessAvailable,
         providerKey,
         selectedAgent?.definition,
         selectedModel?.defaultTier,
+        selectedModel?.source,
     ]);
+    const handleConnectionActivated = useCallback(async (_connection) => {
+        setConnectionRefreshKey((current) => current + 1);
+    }, []);
+    const handleConnectionUnavailable = useCallback((connectionId) => {
+        setModelConnections((current) => current.filter((connection) => connection.id !== connectionId));
+    }, []);
     const handleSaveAgent = async () => {
         const nextAgentName = agentName.trim();
         const nextPurpose = definitionDraft.purpose.trim();
@@ -833,6 +1160,17 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             return;
         const isNewAgent = !selectedAgentId;
         const definition = buildCurrentDraftDefinition();
+        const usesConnectedAccount = definition.model.modelSource === 'subscription_dev';
+        const preservesPrivateAssignment = Boolean(selectedAgentId
+            && agentConnectionBinding?.bound
+            && agentConnectionBinding.ownerIsCaller === false
+            && selectedAgent?.definition?.model.modelSource === 'subscription_dev'
+            && selectedAgent.providerKey === definition.model.providerKey);
+        const connectionIdForSave = selectedConnectionId;
+        if (usesConnectedAccount && !connectionIdForSave && !preservesPrivateAssignment) {
+            setConfigFeedback({ type: 'error', message: 'Select a connected model account before saving this Agent.' });
+            return;
+        }
         setSavingAgent(true);
         setConfigFeedback(null);
         try {
@@ -852,7 +1190,6 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                         expectedDefinitionHash: selectedAgent?.definitionHash,
                     } : {}),
                     ...(signatureColorDirty && signatureColor ? { signatureColor } : {}),
-                    ...(signatureColorReset ? { resetSignatureColor: true } : {}),
                 }),
             });
             const payload = await res.json().catch(() => ({}));
@@ -879,19 +1216,66 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 setAgentName(savedAgent.name);
                 setModelProvider('taskforce_hq');
                 setProviderKey(normalizeTaskforceAgentProviderKey(savedAgent.providerKey));
-                setModelKey(normalizeTaskforceAgentModelKey(savedAgent.modelKey, savedAgent.providerKey));
+                setModelKey(normalizeAvailableModelKey(savedAgent.modelKey, savedAgent.providerKey));
                 setModelTier(savedAgent.modelTier);
                 setDefinitionDraft(createTaskforceAgentEditorDraft(savedAgent.definition, {
                     systemPrompt: savedAgent.systemPrompt,
                 }));
                 setSignatureColor(savedAgent.color || assignedAiProfileColor(savedAgent.id));
                 setSignatureColorDirty(false);
-                setSignatureColorReset(false);
                 signatureColorEditPendingRef.current = false;
             }
-            const message = `Saved ${savedAgent.name}.`;
-            appendLog('success', message);
-            setConfigFeedback({ type: 'success', message });
+            let assignmentError = '';
+            if (usesConnectedAccount && connectionIdForSave) {
+                const mutationGeneration = ++bindingInspectionGenerationRef.current;
+                bindingMutationAgentIdRef.current = savedAgent.id;
+                try {
+                    const binding = await bindAgentConnectionAfterLocalSync(savedAgent.id, connectionIdForSave, { workspaceId, resolveApiUrl: resolveCloudAuthUrl }, runtimeMode === 'local');
+                    if (selectedAgentIdRef.current === savedAgent.id
+                        && bindingInspectionGenerationRef.current === mutationGeneration) {
+                        setAgentConnectionBinding(binding);
+                        setSelectedConnectionId(connectionIdForSave);
+                    }
+                }
+                catch (error) {
+                    assignmentError = error.message || 'The selected model account could not be assigned.';
+                }
+                finally {
+                    if (bindingMutationAgentIdRef.current === savedAgent.id) {
+                        bindingMutationAgentIdRef.current = null;
+                    }
+                }
+            }
+            else if (!usesConnectedAccount && agentConnectionBinding?.bound && agentConnectionBinding.ownerIsCaller) {
+                const mutationGeneration = ++bindingInspectionGenerationRef.current;
+                bindingMutationAgentIdRef.current = savedAgent.id;
+                try {
+                    await clearAgentConnectionBinding(savedAgent.id, {
+                        workspaceId,
+                        resolveApiUrl: resolveCloudAuthUrl,
+                    });
+                    if (selectedAgentIdRef.current === savedAgent.id
+                        && bindingInspectionGenerationRef.current === mutationGeneration) {
+                        setAgentConnectionBinding(null);
+                        setSelectedConnectionId('');
+                    }
+                }
+                catch {
+                    // The stale binding cannot authorize managed-model execution and can be cleaned up later.
+                }
+                finally {
+                    if (bindingMutationAgentIdRef.current === savedAgent.id) {
+                        bindingMutationAgentIdRef.current = null;
+                    }
+                }
+            }
+            const message = assignmentError
+                ? `Saved ${savedAgent.name}, but the model account could not be assigned. ${assignmentError}`
+                : `Saved ${savedAgent.name}.`;
+            appendLog(assignmentError ? 'error' : 'success', message);
+            if (selectedAgentIdRef.current === savedAgent.id) {
+                setConfigFeedback({ type: assignmentError ? 'error' : 'success', message });
+            }
             dispatchTaskforceAgentsMutated({
                 workspaceId,
                 agentId: savedAgent.id,
@@ -1219,17 +1603,38 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         }
     };
     const handleNewAgentDraft = () => requestAgentNavigation({ type: 'new' });
+    const handleModelSourceChange = (nextSourceKey) => {
+        configurationDraftDirtyRef.current = true;
+        const nextConnectionId = nextSourceKey.startsWith(CONNECTION_SOURCE_PREFIX)
+            ? nextSourceKey.slice(CONNECTION_SOURCE_PREFIX.length)
+            : '';
+        const nextSourceGroup = nextConnectionId
+            ? 'personal_connection'
+            : 'taskforce_managed';
+        const nextConnection = nextConnectionId
+            ? modelConnections.find((connection) => connection.id === nextConnectionId) || null
+            : null;
+        const nextModels = availableModelOptions.filter((model) => modelMatchesSourceGroup(model, nextSourceGroup));
+        const nextModel = nextModels.find((model) => !nextConnection || model.providerKey === nextConnection.providerKey) || null;
+        setModelSourceGroup(nextSourceGroup);
+        setSelectedConnectionId(nextConnectionId);
+        if (!nextModel)
+            return;
+        setProviderKey(nextModel.providerKey);
+        setModelKey(nextModel.key);
+        setModelTier(nextModel.defaultTier);
+    };
     const handleProviderChange = (nextProviderKeyRaw) => {
         configurationDraftDirtyRef.current = true;
         const nextProviderKey = normalizeTaskforceAgentProviderKey(nextProviderKeyRaw);
-        const nextModels = modelsForTaskforceAgentProvider(nextProviderKey);
+        const nextModels = sourceModelOptions.filter((model) => model.providerKey === nextProviderKey);
         setProviderKey(nextProviderKey);
         setModelKey(nextModels[0]?.key || '');
         setModelTier(nextModels[0]?.defaultTier || 'balanced');
     };
     const handleModelChange = (nextModelKeyRaw) => {
         configurationDraftDirtyRef.current = true;
-        const nextModelKey = normalizeTaskforceAgentModelKey(nextModelKeyRaw, providerKey);
+        const nextModelKey = normalizeAvailableModelKey(nextModelKeyRaw, providerKey);
         const nextModel = modelOptions.find((model) => model.key === nextModelKey);
         setModelKey(nextModelKey);
         if (nextModel)
@@ -1316,10 +1721,20 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             appendLog('info', 'Started a new unsaved chat.');
             return;
         }
+        const targetAgentId = selectedAgentId;
+        const targetCreateScope = conversationCreateScope;
+        const createRunId = ++conversationCreateRunIdRef.current;
+        const isCurrentCreate = () => (selectedAgentIdRef.current === targetAgentId
+            && conversationCreateRunIdRef.current === createRunId
+            && conversationCreateScopeRef.current === targetCreateScope);
+        await startConversationHistoryLoad(targetAgentId);
+        if (!isCurrentCreate())
+            return;
+        const mutationRevision = ++conversationMutationRevisionRef.current;
         setLoadingConversation(true);
         setToolActivity([]);
         try {
-            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(selectedAgentId)}/conversation/new`, {
+            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(targetAgentId)}/conversation/new`, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
                 credentials: 'include',
@@ -1333,29 +1748,37 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 }),
             });
             const payload = await res.json().catch(() => ({}));
+            if (!isCurrentCreate()
+                || conversationMutationRevisionRef.current !== mutationRevision)
+                return;
             if (!res.ok || payload?.success === false) {
                 appendLog('error', String(payload?.error || 'Unable to start a new chat.'));
                 return;
             }
             setPrompt('');
             const nextConversation = payload?.conversation || null;
+            conversationMutationRevisionRef.current += 1;
             applyConversation(nextConversation);
-            rememberSelection(selectedAgentId, nextConversation?.id || null);
+            rememberSelection(targetAgentId, nextConversation?.id || null);
             if (nextConversation)
                 upsertConversationSummary(nextConversation);
             dispatchTaskforceAgentsMutated({
                 workspaceId,
-                agentId: selectedAgentId,
+                agentId: targetAgentId,
                 conversationId: payload?.conversation?.id || null,
                 reason: 'conversation-create',
             });
             appendLog('info', 'Started a new saved chat.');
         }
         catch (err) {
-            appendLog('error', String(err?.message || err || 'Unable to start a new chat.'));
+            if (isCurrentCreate()) {
+                appendLog('error', String(err?.message || err || 'Unable to start a new chat.'));
+            }
         }
         finally {
-            setLoadingConversation(false);
+            if (isCurrentCreate()) {
+                setLoadingConversation(false);
+            }
         }
     };
     const handleDraftTest = async () => {
@@ -1370,6 +1793,11 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 : 'Cloud sign-in is still loading. Try again in a moment.');
             return;
         }
+        if (draftDefinition.model.modelSource === 'subscription_dev'
+            && (!selectedModelConnection || selectedModelConnection.lifecycleStatus !== 'active')) {
+            setDraftTestError('Select an active connected model account before testing this Agent.');
+            return;
+        }
         setTestingDraft(true);
         const runId = ++draftTestRunIdRef.current;
         setDraftTestResult(null);
@@ -1389,6 +1817,9 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                     prompt: nextPrompt,
                     messages: [{ role: 'user', content: nextPrompt }],
                     draftDefinition,
+                    ...(draftDefinition.model.modelSource === 'subscription_dev'
+                        ? { connectionId: selectedConnectionId }
+                        : {}),
                 }),
             });
             const payload = await res.json().catch(() => ({}));
@@ -1433,6 +1864,12 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 setTestingDraft(false);
         }
     };
+    const handleDraftTestKeyDown = (event) => {
+        if (event.key !== 'Enter' || event.shiftKey || event.nativeEvent.isComposing)
+            return;
+        event.preventDefault();
+        void handleDraftTest();
+    };
     const handleTestModelGateway = async () => {
         const nextPrompt = prompt.trim();
         const nextSystemPrompt = systemPrompt.trim();
@@ -1460,35 +1897,49 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
         setToolActivity([]);
         appendLog('info', `Started test prompt for ${nextAgentName}.`);
         try {
-            const res = await fetch('/api/taskforce/agents/model-gateway/test', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                credentials: 'include',
-                body: JSON.stringify({
-                    workspaceId,
-                    agentId: selectedAgentId,
-                    conversationId,
-                    agentName: nextAgentName,
-                    providerKey,
-                    modelKey,
-                    prompt: nextPrompt,
-                    messages: nextMessages,
-                    system: nextSystemPrompt,
-                    tier: selectedModel?.defaultTier || modelTier,
-                    ...(activeTaskContext ? {
-                        taskId: activeTaskContext.taskId,
-                        taskReference: activeTaskContext.taskReference,
-                        taskTitle: activeTaskContext.taskTitle,
-                    } : {}),
-                }),
-            });
-            const payload = await res.json().catch(() => ({}));
+            let res;
+            let payload;
+            let syncAttempt = 0;
+            for (;;) {
+                res = await fetch('/api/taskforce/agents/model-gateway/test', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    credentials: 'include',
+                    body: JSON.stringify({
+                        workspaceId,
+                        agentId: selectedAgentId,
+                        conversationId,
+                        agentName: nextAgentName,
+                        providerKey,
+                        modelKey,
+                        prompt: nextPrompt,
+                        messages: nextMessages,
+                        system: nextSystemPrompt,
+                        tier: selectedModel?.defaultTier || modelTier,
+                        ...(activeTaskContext ? {
+                            taskId: activeTaskContext.taskId,
+                            taskReference: activeTaskContext.taskReference,
+                            taskTitle: activeTaskContext.taskTitle,
+                        } : {}),
+                    }),
+                });
+                payload = await res.json().catch(() => ({}));
+                const awaitingCloudSync = runtimeMode === 'local'
+                    && payload?.code === 'AGENT_NOT_AVAILABLE_IN_CLOUD'
+                    && syncAttempt < LOCAL_AGENT_BINDING_SYNC_RETRIES;
+                if (!awaitingCloudSync)
+                    break;
+                syncAttempt += 1;
+                setPromptStatus('Waiting for this Agent to synchronize with Taskforce Cloud...');
+                await new Promise((resolve) => window.setTimeout(resolve, LOCAL_AGENT_BINDING_SYNC_DELAY_MS));
+            }
             if (!res.ok || payload?.success === false) {
                 const message = String(payload?.error || 'Model gateway test failed.');
                 setPromptStatus(message);
                 appendLog('error', message);
                 return;
             }
+            setPromptStatus('');
             const nextResult = payload?.result || null;
             setResult(nextResult);
             const mcpToolCalls = Array.isArray(payload?.mcpToolCalls)
@@ -1521,6 +1972,7 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                 nextToolActivity.forEach((toolCall) => {
                     if ((toolCall.name === 'add_comment'
                         || toolCall.name === 'add_task_checklist_item'
+                        || toolCall.name === 'update_task_checklist_item'
                         || toolCall.name === 'replace_task_checklist'
                         || toolCall.name === 'complete_workflow_step') && toolCall.ok) {
                         dispatchTaskforceTasksMutated({
@@ -1539,6 +1991,9 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                             ...(toolCall.name === 'complete_workflow_step' && installedWorkflowTask
                                 ? { authoritativeTask: installedWorkflowTask }
                                 : {}),
+                            ...(toolCall.name === 'complete_workflow_step' && workflowCompletion?.assignmentSnapshot
+                                ? { authoritativeWorkflowAssignment: workflowCompletion.assignmentSnapshot }
+                                : {}),
                         });
                     }
                 });
@@ -1594,7 +2049,27 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
             return;
         void loadConversation(selectedAgentId, nextConversationId);
     };
-    const renderToolActivityList = (items) => (_jsx("div", { className: styles.taskforceAgentToolActivityList, children: items.map((toolCall) => (_jsxs("details", { className: `${styles.taskforceAgentToolCall} ${toolCall.ok ? '' : styles.taskforceAgentToolCallFailed}`.trim(), children: [_jsxs("summary", { children: [toolCall.ok ? _jsx(CheckCircle, { size: 13 }) : _jsx(AlertTriangle, { size: 13 }), _jsx("span", { className: styles.taskforceAgentToolCallName, children: toolCall.name }), _jsx("span", { className: styles.taskforceAgentToolCallStatus, children: toolCall.ok ? 'ok' : 'failed' })] }), _jsxs("div", { className: styles.taskforceAgentToolDetailsGrid, children: [_jsx("span", { children: "Arguments" }), _jsx("pre", { children: formatToolLogJson(toolCall.arguments) }), _jsx("span", { children: "Result" }), _jsx("pre", { children: formatToolLogResult(toolCall.resultText) })] })] }, toolCall.id))) }));
+    const handleCopyToolActivity = async (toolCall) => {
+        if (!navigator.clipboard?.writeText) {
+            setToolCopyStatus({ id: toolCall.id, status: 'failed' });
+            return;
+        }
+        try {
+            await navigator.clipboard.writeText(formatToolActivityClipboard(toolCall));
+            setToolCopyStatus({ id: toolCall.id, status: 'copied' });
+            window.setTimeout(() => {
+                setToolCopyStatus((current) => current?.id === toolCall.id ? null : current);
+            }, 1600);
+        }
+        catch {
+            setToolCopyStatus({ id: toolCall.id, status: 'failed' });
+        }
+    };
+    const renderToolActivityList = (items) => (_jsx("div", { className: styles.taskforceAgentToolActivityList, children: items.map((toolCall) => (_jsxs("details", { className: `${styles.taskforceAgentToolCall} ${toolCall.ok ? '' : styles.taskforceAgentToolCallFailed}`.trim(), children: [_jsxs("summary", { children: [toolCall.ok ? _jsx(CheckCircle, { size: 13 }) : _jsx(AlertTriangle, { size: 13 }), _jsx("span", { className: styles.taskforceAgentToolCallName, children: toolCall.name }), _jsx("span", { className: styles.taskforceAgentToolCallStatus, children: toolCall.ok ? 'ok' : 'failed' })] }), _jsxs("div", { className: styles.taskforceAgentToolDetailsGrid, children: [_jsxs("button", { type: "button", className: styles.taskforceAgentToolCopyButton, onClick: () => { void handleCopyToolActivity(toolCall); }, "aria-label": `Copy ${toolCall.name} tool call details`, title: "Copy diagnostic details, including the full result up to 20,000 characters", children: [toolCopyStatus?.id === toolCall.id && toolCopyStatus.status === 'copied'
+                                    ? _jsx(Check, { size: 13 })
+                                    : _jsx(Copy, { size: 13 }), _jsx("span", { "aria-live": "polite", children: toolCopyStatus?.id === toolCall.id
+                                        ? (toolCopyStatus.status === 'copied' ? 'Copied' : 'Copy failed')
+                                        : 'Copy' })] }), _jsx("span", { children: "Arguments" }), _jsx("pre", { children: formatToolLogJson(toolCall.arguments) }), _jsx("span", { children: "Result preview" }), _jsx("pre", { children: formatToolLogResult(toolCall.resultText) })] })] }, toolCall.id))) }));
     const renderToolActivityDetails = (items, label = 'Tool Activity') => (_jsxs("details", { className: styles.taskforceAgentToolActivity, children: [_jsxs("summary", { children: [_jsx("span", { children: label }), _jsx("strong", { children: formatToolActivitySummary(items) })] }), renderToolActivityList(items)] }));
     const activeLibrary = activeBuilderTab === 'agents'
         ? { icon: _jsx(Bot, { size: 14 }), title: 'Agent Roster', empty: 'No agents configured yet.' }
@@ -1607,7 +2082,9 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                     : { icon: _jsx(Database, { size: 14 }), title: 'Resource Library', empty: 'Resource Collections are not available yet.' };
     const builderTabs = (_jsxs("div", { className: styles.taskforceAgentBuilderNavigation, children: [_jsx("div", { className: styles.taskforceAgentBuilderTabs, role: "tablist", "aria-label": "Taskforce Agent builders", children: AGENT_BUILDER_TABS.map((tab, index) => {
                     const active = activeBuilderTab === tab.id;
-                    return (_jsx("button", { ref: (element) => { builderTabRefs.current[tab.id] = element; }, type: "button", className: `${styles.taskforceAgentBuilderTab} ${active ? styles.taskforceAgentBuilderTabActive : ''}`.trim(), role: "tab", "aria-selected": active, "aria-controls": `taskforce-agent-builder-${tab.id}`, id: `taskforce-agent-builder-tab-${tab.id}`, tabIndex: active ? 0 : -1, onClick: () => setActiveBuilderTab(tab.id), onKeyDown: (event) => {
+                    return (_jsx("button", { ref: (element) => { builderTabRefs.current[tab.id] = element; }, type: "button", className: `${styles.taskforceAgentBuilderTab} ${active ? styles.taskforceAgentBuilderTabActive : ''}`.trim(), role: "tab", "aria-selected": active, "aria-controls": `taskforce-agent-builder-${tab.id}`, id: `taskforce-agent-builder-tab-${tab.id}`, tabIndex: active ? 0 : -1, onClick: () => {
+                            setActiveBuilderTab(tab.id);
+                        }, onKeyDown: (event) => {
                             let nextIndex = index;
                             if (event.key === 'ArrowRight')
                                 nextIndex = (index + 1) % AGENT_BUILDER_TABS.length;
@@ -1625,7 +2102,8 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                             builderTabRefs.current[nextTab.id]?.focus();
                         }, children: tab.label }, tab.id));
                 }) }), activeBuilderTab === 'agents' ? (_jsxs("button", { type: "button", className: `${styles.secondaryHeaderBtn} ${styles.taskforceAgentBuilderCreateBtn}`.trim(), onClick: handleNewAgentDraft, children: [_jsx(Plus, { size: 14 }), "New Agent"] })) : null] }));
-    const libraryTray = (_jsxs("aside", { className: `${styles.docTrayPanel} ${agentRosterTrayOpen ? styles.docTrayPanelOpen : ''}`.trim(), "aria-hidden": !agentRosterTrayOpen, "aria-label": activeLibrary.title, children: [_jsxs("div", { className: styles.taskforceAgentRosterHeader, children: [_jsxs("span", { className: styles.taskforceAgentRosterTitle, children: [activeLibrary.icon, activeLibrary.title] }), activeBuilderTab === 'agents' && loadingAgents && _jsx(Loader2, { size: 14, className: styles.spinner }), onCloseAgentRosterTray ? (_jsx("button", { type: "button", className: "tf-control-icon", onClick: onCloseAgentRosterTray, title: `Collapse ${activeLibrary.title.toLowerCase()}`, "aria-label": `Collapse ${activeLibrary.title.toLowerCase()}`, children: _jsx(ChevronLeft, { size: 16 }) })) : null] }), _jsx("div", { className: `${styles.taskforceAgentRosterContent} tf-scrollbar tf-tray-scroll-viewport`, children: activeBuilderTab === 'roles' ? (_jsx("div", { ref: setRoleLibraryPortalTarget, className: styles.taskforceAgentLibraryPortal })) : activeBuilderTab === 'skills' ? (_jsx("div", { ref: setSkillLibraryPortalTarget, className: styles.taskforceAgentLibraryPortal })) : activeBuilderTab === 'connections' ? (_jsx(FutureLibrarySummary, { kind: "connections" })) : activeBuilderTab === 'resources' ? (_jsx(FutureLibrarySummary, { kind: "resources" })) : activeBuilderTab === 'agents' && agents.length > 0 ? (_jsx("div", { className: styles.taskforceAgentList, children: agents.map((agent) => {
+    const libraryTrayVisible = agentRosterTrayOpen;
+    const libraryTray = (_jsxs("aside", { className: `${styles.docTrayPanel} ${libraryTrayVisible ? styles.docTrayPanelOpen : ''}`.trim(), "aria-hidden": !libraryTrayVisible, "aria-label": activeLibrary.title, children: [_jsxs("div", { className: styles.taskforceAgentRosterHeader, children: [_jsxs("span", { className: styles.taskforceAgentRosterTitle, children: [activeLibrary.icon, activeLibrary.title] }), activeBuilderTab === 'agents' && loadingAgents && _jsx(Loader2, { size: 14, className: styles.spinner }), onCloseAgentRosterTray ? (_jsx("button", { type: "button", className: "tf-control-icon", onClick: onCloseAgentRosterTray, title: `Collapse ${activeLibrary.title.toLowerCase()}`, "aria-label": `Collapse ${activeLibrary.title.toLowerCase()}`, children: _jsx(ChevronLeft, { size: 16 }) })) : null] }), _jsx("div", { className: `${styles.taskforceAgentRosterContent} tf-scrollbar tf-tray-scroll-viewport`, children: activeBuilderTab === 'roles' ? (_jsx("div", { ref: setRoleLibraryPortalTarget, className: styles.taskforceAgentLibraryPortal })) : activeBuilderTab === 'skills' ? (_jsx("div", { ref: setSkillLibraryPortalTarget, className: styles.taskforceAgentLibraryPortal })) : activeBuilderTab === 'connections' ? (_jsx("div", { ref: setConnectionLibraryPortalTarget, className: styles.taskforceAgentLibraryPortal })) : activeBuilderTab === 'resources' ? (_jsx(FutureLibrarySummary, { kind: "resources" })) : activeBuilderTab === 'agents' && agents.length > 0 ? (_jsx("div", { className: styles.taskforceAgentList, children: agents.map((agent) => {
                         const avatarUrl = getAgentAvatarUrl(agent);
                         const color = agent.color || assignedAiProfileColor(agent.id);
                         return (_jsx(AiIdentityRosterCard, { name: agent.name, username: agent.username, subtitle: "Taskforce Agent", avatar: avatarUrl
@@ -1663,57 +2141,33 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                                             setPromptStatus('');
                                     }, onKeyDown: handlePromptKeyDown, disabled: testing || loadingConversation || !selectedAgentId, placeholder: testing ? 'Waiting for response...' : TEST_PROMPT_PLACEHOLDER, maxLength: 4000 })] }), _jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => { void handleTestModelGateway(); }, disabled: testing || loadingConversation || !prompt.trim() || !modelKey || !selectedAgentId, children: [testing ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Send, { size: 14 }), "Send"] }), promptStatus ? (_jsx("div", { className: styles.taskforceAgentDrawerPromptStatus, role: "status", children: promptStatus })) : null] }), _jsxs("div", { className: styles.taskforceAgentDrawerMetrics, "aria-label": "Response metrics", children: [_jsxs("span", { children: [_jsx("strong", { children: "Usage" }), formatModelGatewayUsage(result)] }), _jsxs("span", { children: [_jsx("strong", { children: "Latency" }), formatModelGatewayLatency(result)] })] })] }));
     }
-    return (_jsxs("div", { className: `${styles.standalonePage} ${styles.standaloneContent} ${styles.taskforceAgentsModuleRoot} ${agentRosterTrayOpen ? styles.taskforceAgentsModuleTrayOpen : ''}`.trim(), children: [libraryTray, _jsxs("div", { className: `${styles.taskforceAgentsModuleMain} tf-scrollbar`, children: [_jsxs("div", { className: styles.settingsContent, style: { maxWidth: 1180, margin: '0 auto', width: '100%' }, children: [builderTabs, _jsx("div", { className: `${styles.settingGroup} ${styles.taskforceAgentBuilderPanel}`, hidden: activeBuilderTab !== 'agents', children: _jsxs("div", { className: styles.taskforceAgentTestGrid, role: "tabpanel", id: "taskforce-agent-builder-agents", "aria-labelledby": "taskforce-agent-builder-tab-agents", children: [_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.taskforceAgentAvatarPanel, children: [_jsxs("div", { className: styles.taskforceAgentAvatarEditControl, children: [_jsx(EditableAvatarButton, { label: selectedAgent ? `Edit ${selectedAgent.name} photo` : 'Photo editing is unavailable until agent creation', imageUrl: selectedAgentAvatarUrl, fallback: _jsx(Bot, { size: 28 }), accentColor: signatureColor || selectedAgent?.color, size: 88, editBadgeSize: 28, editIconSize: 14, disabled: !selectedAgentId, loading: Boolean(selectedAgentId && generatingAvatarAgentIds.has(selectedAgentId)), loadingLabel: `Generating ${selectedAgent?.name || 'agent'} photo`, error: Boolean(selectedAgentGenerationFeedback?.error), errorLabel: selectedAgentGenerationFeedback?.error || 'Agent photo generation failed', onClick: () => {
+    return (_jsxs("div", { className: `${styles.standalonePage} ${styles.standaloneContent} ${styles.taskforceAgentsModuleRoot} ${libraryTrayVisible ? styles.taskforceAgentsModuleTrayOpen : ''}`.trim(), children: [libraryTray, _jsxs("div", { className: `${styles.taskforceAgentsModuleMain} tf-scrollbar`, children: [_jsxs("div", { className: styles.settingsContent, style: { maxWidth: 1180, margin: '0 auto', width: '100%' }, children: [builderTabs, _jsx("div", { className: `${styles.settingGroup} ${styles.taskforceAgentBuilderPanel}`, hidden: activeBuilderTab !== 'agents', children: _jsxs("div", { className: styles.taskforceAgentTestGrid, role: "tabpanel", id: "taskforce-agent-builder-agents", "aria-labelledby": "taskforce-agent-builder-tab-agents", children: [_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.taskforceAgentAvatarPanel, children: [_jsxs("div", { className: styles.taskforceAgentAvatarEditControl, children: [_jsx(EditableAvatarButton, { label: selectedAgent ? `Edit ${selectedAgent.name} photo` : 'Photo editing is unavailable until agent creation', imageUrl: selectedAgentAvatarUrl, fallback: _jsx(Bot, { size: 28 }), accentColor: signatureColor || selectedAgent?.color, size: 88, editBadgeSize: 28, editIconSize: 14, disabled: !selectedAgentId, loading: Boolean(selectedAgentId && generatingAvatarAgentIds.has(selectedAgentId)), loadingLabel: `Generating ${selectedAgent?.name || 'agent'} photo`, error: Boolean(selectedAgentGenerationFeedback?.error), errorLabel: selectedAgentGenerationFeedback?.error || 'Agent photo generation failed', onClick: () => {
                                                                         setAgentAvatarError(null);
                                                                         setAgentAvatarNotice(null);
                                                                         setAvatarEditorOpen(true);
-                                                                    } }), isSelectedAgentAvatarSyncing ? _jsx(Loader2, { size: 16, className: `${styles.spinner} ${styles.taskforceAgentAvatarSyncIcon}` }) : null] }), _jsxs("div", { className: styles.taskforceAgentAvatarCopy, children: [_jsx("strong", { children: agentName.trim() || selectedAgent?.name || DEFAULT_AGENT_NAME }), _jsx("span", { className: styles.taskforceAgentAvatarRole, children: "Taskforce Agent" }), isSelectedAgentAvatarSyncing ? _jsx("small", { children: "Syncing avatar..." }) : null] }), _jsxs("div", { className: styles.taskforceAgentToolbar, children: [configFeedback ? (_jsxs("span", { className: configFeedback.type === 'error' ? 'tf-chip-danger' : 'tf-chip-success', role: configFeedback.type === 'error' ? 'alert' : 'status', "aria-label": "Agent configuration status", children: [configFeedback.type === 'error' ? _jsx(AlertTriangle, { size: 12 }) : _jsx(CheckCircle, { size: 12 }), configFeedback.message] })) : null, _jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => { void handleSaveAgent(); }, disabled: savingAgent || !agentName.trim() || !definitionDraft.purpose.trim() || !modelKey, children: [savingAgent ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Save, { size: 14 }), "Save"] })] })] }), selectedAgent?.configurationState && selectedAgent.configurationState !== 'valid' ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsxs("span", { children: ["This Agent configuration is ", selectedAgent.configurationState.replace(/-/g, ' '), ".", selectedAgent.configurationIssues?.[0]?.message
+                                                                    } }), isSelectedAgentAvatarSyncing ? _jsx(Loader2, { size: 16, className: `${styles.spinner} ${styles.taskforceAgentAvatarSyncIcon}` }) : null] }), _jsxs("div", { className: styles.taskforceAgentAvatarCopy, children: [_jsx("strong", { children: agentName.trim() || selectedAgent?.name || DEFAULT_AGENT_NAME }), _jsx("span", { className: styles.taskforceAgentAvatarRole, children: "Taskforce Agent" }), isSelectedAgentAvatarSyncing ? _jsx("small", { children: "Syncing avatar..." }) : null] }), _jsxs("div", { className: styles.taskforceAgentToolbar, children: [configFeedback ? (_jsxs("span", { className: configFeedback.type === 'error' ? 'tf-chip-danger' : 'tf-chip-success', role: configFeedback.type === 'error' ? 'alert' : 'status', "aria-label": "Agent configuration status", children: [configFeedback.type === 'error' ? _jsx(AlertTriangle, { size: 12 }) : _jsx(CheckCircle, { size: 12 }), configFeedback.message] })) : null, _jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, "aria-expanded": testPanelOpen, "aria-controls": "taskforce-agent-test-panel", title: "Uses the current draft, including unsaved changes. Test messages are not saved and cannot modify tasks.", onClick: () => setTestPanelOpen((open) => !open), children: [_jsx(Beaker, { size: 14 }), "Test Agent"] }), _jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => { void handleSaveAgent(); }, disabled: savingAgent || !agentName.trim() || !definitionDraft.purpose.trim() || !modelKey || !selectedModel, children: [savingAgent ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Save, { size: 14 }), "Save"] })] })] }), testPanelOpen ? (_jsxs("section", { id: "taskforce-agent-test-panel", className: styles.taskforceAgentHeaderTestPanel, "aria-label": "Isolated Agent test", children: [_jsxs("div", { className: styles.taskforceAgentTestComposer, children: [_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Test Prompt" }), _jsx("textarea", { className: styles.input, value: draftTestPrompt, onChange: (event) => setDraftTestPrompt(event.target.value), onKeyDown: handleDraftTestKeyDown, placeholder: "Ask the draft agent a representative question...", rows: 4, disabled: testingDraft })] }), _jsx("button", { type: "button", className: `tf-control-icon ${styles.taskforceAgentTestSendButton}`, "aria-label": "Send test prompt", title: "Send test prompt", onClick: () => { void handleDraftTest(); }, disabled: testingDraft || !draftTestPrompt.trim() || !definitionDraft.purpose.trim() || !modelKey, children: testingDraft ? _jsx(Loader2, { size: 15, className: styles.spinner }) : _jsx(Send, { size: 15 }) })] }), !canUseCloudAgentRuntime ? (_jsx("p", { className: styles.taskforceAgentTestRestriction, children: authSessionResolved
+                                                                ? 'Sign in to Taskforce Cloud to run agent tests.'
+                                                                : 'Checking Taskforce Cloud sign-in...' })) : null, draftTestError ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: draftTestError })] })) : null, testingDraft ? (_jsxs("div", { className: styles.taskforceAgentTestPending, role: "status", children: [_jsx(Loader2, { size: 15, className: styles.spinner }), _jsx("span", { children: "Testing agent..." })] })) : null, draftTestResult ? (_jsxs("div", { className: styles.taskforceAgentTestResult, role: "status", "aria-live": "polite", children: [_jsxs("div", { className: styles.taskforceAgentTestResultHeader, children: [_jsxs("span", { children: [_jsx(CheckCircle, { size: 14 }), " Test completed"] }), _jsxs("span", { children: [formatModelGatewayLatency(draftTestResult), " \u00B7 ", formatModelGatewayUsage(draftTestResult)] })] }), _jsx("div", { className: styles.taskforceAgentTestResponse, children: _jsx(Markdown, { variant: "conversation", children: draftTestResult.text }) }), _jsxs("details", { className: styles.taskforceAgentToolActivity, children: [_jsxs("summary", { children: [_jsx("span", { children: "Response Details" }), _jsx("strong", { children: labelForTaskforceAgentModel(draftTestSnapshot?.modelKey || modelKey) })] }), _jsxs("div", { className: styles.taskforceAgentMetaGrid, children: [_jsxs("div", { children: [_jsx("span", { children: "Tested agent" }), _jsx("strong", { children: draftTestSnapshot?.agentName || agentName.trim() || DEFAULT_AGENT_NAME })] }), _jsxs("div", { children: [_jsx("span", { children: "Provider" }), _jsx("strong", { children: labelForTaskforceAgentProvider(draftTestSnapshot?.providerKey || providerKey) })] }), _jsxs("div", { children: [_jsx("span", { children: "Runtime model" }), _jsx("code", { children: draftTestResult.modelId || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Test prompt" }), _jsx("strong", { children: draftTestSnapshot?.prompt || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Tested purpose" }), _jsx("strong", { children: draftTestSnapshot?.definition.purpose || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Tested working guidelines" }), _jsx("strong", { children: draftTestSnapshot?.definition.behavior.workingGuidelines || 'None' })] }), _jsxs("div", { children: [_jsx("span", { children: "Stop reason" }), _jsx("strong", { children: draftTestResult.stopReason || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Input tokens" }), _jsx("strong", { children: draftTestResult.usage?.inputTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Output tokens" }), _jsx("strong", { children: draftTestResult.usage?.outputTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Total tokens" }), _jsx("strong", { children: draftTestResult.usage?.totalTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Latency" }), _jsx("strong", { children: formatModelGatewayLatency(draftTestResult) })] })] }), draftTestToolActivity.length > 0
+                                                                            ? renderToolActivityDetails(draftTestToolActivity, 'Managed Tool Activity')
+                                                                            : null] })] })) : null] })) : null, selectedAgent?.configurationState && selectedAgent.configurationState !== 'valid' ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsxs("span", { children: ["This Agent configuration is ", selectedAgent.configurationState.replace(/-/g, ' '), ".", selectedAgent.configurationIssues?.[0]?.message
                                                                     ? ` ${selectedAgent.configurationIssues[0].message}`
-                                                                    : ' Repair the highlighted configuration before testing it.'] })] })) : null, _jsxs("div", { className: styles.topRow, children: [_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Agent Name" }), _jsx("input", { className: styles.input, value: agentName, onChange: (event) => {
+                                                                    : ' Repair the highlighted configuration before testing it.'] })] })) : null, modelCatalogError ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: modelCatalogError }), _jsxs("button", { type: "button", className: `${styles.secondaryHeaderBtn} ${styles.taskforceAgentRetryButton}`, onClick: () => setModelCatalogRefreshKey((current) => current + 1), children: [_jsx(RotateCcw, { size: 14 }), "Retry"] })] })) : null, _jsxs("div", { className: styles.topRow, children: [_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Agent Name" }), _jsx("input", { className: styles.input, value: agentName, onChange: (event) => {
                                                                         configurationDraftDirtyRef.current = true;
                                                                         setAgentName(event.target.value);
-                                                                    }, placeholder: DEFAULT_AGENT_NAME, required: true, maxLength: 80 })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Platform" }), _jsx("div", { className: styles.taskforceAgentReadonlyField, children: formatAgentProvider(modelProvider) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Provider" }), _jsx("select", { className: styles.select, value: providerKey, onChange: (event) => handleProviderChange(event.target.value), children: configuredProviderOptions.map((provider) => (_jsx("option", { value: provider.key, children: provider.label }, provider.key))) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Model" }), _jsx("select", { className: styles.select, value: modelKey, onChange: (event) => handleModelChange(event.target.value), disabled: modelOptions.length === 0, children: modelOptions.length > 0 ? (modelOptions.map((model) => (_jsx("option", { value: model.key, children: model.label }, model.key)))) : (_jsxs("option", { value: "", children: ["No configured ", labelForTaskforceAgentProvider(providerKey), " models yet"] })) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Default Tier" }), _jsx("div", { className: styles.taskforceAgentReadonlyField, children: selectedModel ? formatModelTier(selectedModel.defaultTier) : 'No configured tier' })] })] }), _jsxs("div", { className: styles.taskforceAgentSignatureColorField, children: [_jsxs("div", { children: [_jsx("span", { className: styles.label, children: "Signature Color" }), _jsx("small", { children: "Identifies this agent across Taskforce." })] }), _jsxs("div", { className: styles.aiProfileColorPicker, "aria-label": "Signature color options", children: [AI_PROFILE_COLOR_TOKENS.map((token) => {
-                                                                    const color = COLOR_PALETTE[token];
-                                                                    return (_jsx("button", { type: "button", className: styles.aiProfileColorOption, style: { backgroundColor: color }, "aria-label": `Use ${token}`, "aria-pressed": signatureColor.toLowerCase() === color.toLowerCase(), onClick: () => {
-                                                                            configurationDraftDirtyRef.current = true;
-                                                                            setSignatureColor(color);
-                                                                            setSignatureColorDirty(true);
-                                                                            setSignatureColorReset(false);
-                                                                            signatureColorEditPendingRef.current = true;
-                                                                        } }, token));
-                                                                }), selectedAgent ? (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => {
+                                                                    }, placeholder: DEFAULT_AGENT_NAME, required: true, maxLength: 80 })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Platform" }), _jsx("div", { className: styles.taskforceAgentReadonlyField, "aria-label": "Platform", children: formatAgentProvider(modelProvider) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Model Source" }), _jsx("select", { className: styles.select, value: modelSourceSelectionKey, onChange: (event) => handleModelSourceChange(event.target.value), children: configuredModelSourceOptions.map((source) => (_jsx("option", { value: source.key, disabled: source.disabled, children: source.label }, source.key))) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Provider" }), _jsx("select", { className: styles.select, value: providerKey, onChange: (event) => handleProviderChange(event.target.value), children: configuredProviderOptions.map((provider) => (_jsx("option", { value: provider.key, children: provider.label }, provider.key))) })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Model" }), _jsxs("select", { className: styles.select, value: modelKey, onChange: (event) => handleModelChange(event.target.value), disabled: modelOptions.length === 0, children: [!selectedModel && modelKey ? (_jsxs("option", { value: modelKey, disabled: true, children: [labelForTaskforceAgentModel(modelKey), " (unavailable)"] })) : null, modelOptions.map((model) => (_jsx("option", { value: model.key, children: model.label }, model.key))), modelOptions.length === 0 && !modelKey ? (_jsxs("option", { value: "", children: ["No configured ", labelForTaskforceAgentProvider(providerKey), " models yet"] })) : null] })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Default Tier" }), _jsx("div", { className: styles.taskforceAgentReadonlyField, children: selectedModel ? formatModelTier(selectedModel.defaultTier) : 'No configured tier' })] })] }), _jsxs("div", { className: styles.taskforceAgentSignatureColorField, children: [_jsx("span", { className: styles.label, title: "Identifies this agent across Taskforce.", "aria-label": "Signature Color. Identifies this agent across Taskforce.", children: "Signature Color" }), _jsx("div", { className: styles.aiProfileColorPicker, "aria-label": "Signature color options", children: AI_PROFILE_SIGNATURE_COLOR_OPTIONS.map(({ name, value: color }) => {
+                                                                return (_jsx("button", { type: "button", className: styles.aiProfileColorOption, style: { backgroundColor: color }, "aria-label": `Use ${name}`, "aria-pressed": signatureColor.toLowerCase() === color.toLowerCase(), onClick: () => {
                                                                         configurationDraftDirtyRef.current = true;
-                                                                        setSignatureColor(assignedAiProfileColor(selectedAgent.id));
-                                                                        setSignatureColorDirty(false);
-                                                                        setSignatureColorReset(true);
+                                                                        setSignatureColor(color);
+                                                                        setSignatureColorDirty(true);
                                                                         signatureColorEditPendingRef.current = true;
-                                                                    }, children: "Reset" })) : null] })] }), _jsxs("div", { className: styles.taskforceAgentBehaviorGrid, children: [_jsxs("label", { className: `${styles.field} ${styles.taskforceAgentBehaviorWide}`, children: [_jsx("span", { className: styles.label, children: "Purpose" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "What should this agent help with?" }), _jsx("textarea", { className: styles.input, "aria-label": "Purpose", value: definitionDraft.purpose, onChange: (event) => {
+                                                                    } }, color));
+                                                            }) })] }), _jsxs("div", { className: styles.taskforceAgentBehaviorGrid, children: [_jsxs("label", { className: `${styles.field} ${styles.taskforceAgentBehaviorWide}`, children: [_jsx("span", { className: styles.label, children: "Purpose" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "What should this agent help with?" }), _jsx("textarea", { className: styles.input, "aria-label": "Purpose", value: definitionDraft.purpose, onChange: (event) => {
                                                                         configurationDraftDirtyRef.current = true;
                                                                         setDefinitionDraft((current) => ({
                                                                             ...current,
                                                                             purpose: event.target.value,
                                                                         }));
-                                                                    }, maxLength: 1000, rows: 3, required: true })] }), _jsx("div", { className: styles.taskforceAgentBehaviorWide, children: _jsx(AgentBehaviorAssignments, { workspaceId: workspaceId, roleRef: definitionDraft.roleRef, skillRefs: definitionDraft.skillRefs, onRoleRefChange: (roleRef) => {
-                                                                    configurationDraftDirtyRef.current = true;
-                                                                    setDefinitionDraft((current) => ({
-                                                                        ...current,
-                                                                        roleRef,
-                                                                    }));
-                                                                }, onSkillRefsChange: (skillRefs) => {
-                                                                    configurationDraftDirtyRef.current = true;
-                                                                    setDefinitionDraft((current) => ({
-                                                                        ...current,
-                                                                        skillRefs,
-                                                                    }));
-                                                                }, onManageRoles: () => setActiveBuilderTab('roles'), onManageSkills: () => setActiveBuilderTab('skills') }) }), _jsx("div", { className: styles.taskforceAgentBehaviorWide, children: _jsx(ToolAccessSelector, { selectedKeys: definitionDraft.requestedCapabilities, hasCustomOverrides: Boolean(selectedAgent?.definition?.toolPolicy.toolOverrides?.length
-                                                                    && !definitionDraft.toolAccessChanged), onChange: (requestedCapabilities) => {
-                                                                    configurationDraftDirtyRef.current = true;
-                                                                    setDefinitionDraft((current) => ({
-                                                                        ...current,
-                                                                        requestedCapabilities,
-                                                                        toolAccessChanged: true,
-                                                                    }));
-                                                                } }) }), _jsx("div", { className: styles.taskforceAgentBehaviorWide, children: _jsx(EffectiveConfigurationSummary, { hasRole: Boolean(definitionDraft.roleRef), directSkillCount: definitionDraft.skillRefs.length, toolKeys: definitionDraft.requestedCapabilities }) }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Personality and Voice" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "How should this agent behave or portray itself?" }), _jsxs("select", { className: styles.select, "aria-label": "Personality and Voice", value: definitionDraft.personalitySelection, onChange: (event) => {
+                                                                    }, maxLength: 1000, rows: 3, required: true })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Personality and Voice" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "How should this agent behave or portray itself?" }), _jsxs("select", { className: styles.select, "aria-label": "Personality and Voice", value: definitionDraft.personalitySelection, onChange: (event) => {
                                                                         configurationDraftDirtyRef.current = true;
                                                                         setDefinitionDraft((current) => ({
                                                                             ...current,
@@ -1764,13 +2218,29 @@ export function TaskforceAgentsModule({ workspaceId, agentRosterTrayOpen = true,
                                                                             ...current,
                                                                             avatarArtStyleCustom: event.target.value,
                                                                         }));
-                                                                    }, maxLength: 4000, rows: 3, placeholder: "Describe medium, palette, lighting, period, or atmosphere." })] })) : null] }), _jsxs("details", { className: styles.taskforceAgentToolActivity, children: [_jsxs("summary", { children: [_jsx("span", { children: "Technical model details" }), _jsx("strong", { children: selectedModel ? formatModelAvailability(selectedModel.availability) : 'Unavailable' })] }), _jsxs("div", { className: styles.taskforceAgentMetaGrid, children: [_jsxs("div", { children: [_jsx("span", { children: "Model ID" }), _jsx("code", { children: selectedModel?.runtimeModelId || 'No configured model' })] }), _jsxs("div", { children: [_jsx("span", { children: "Max Output" }), _jsx("strong", { children: formatMaxOutputTokens(selectedModel?.defaultMaxTokens) })] })] })] })] }), _jsx("div", { className: styles.taskforceAgentOutputStack, children: _jsxs("section", { className: styles.taskforceAgentOutputPanel, "aria-labelledby": "taskforce-agent-test-title", children: [_jsx("div", { className: styles.settingTitleRow, children: _jsxs("div", { className: styles.taskforceAgentTestTitle, children: [_jsx("span", { className: styles.taskforceAgentBuilderEmptyIcon, "aria-hidden": "true", children: _jsx(Beaker, { size: 18 }) }), _jsxs("div", { children: [_jsx("h4", { id: "taskforce-agent-test-title", className: styles.settingSubTitle, children: "Test Agent" }), _jsx("p", { children: "Run one isolated prompt against the current draft, including unsaved changes." })] })] }) }), _jsxs("div", { className: styles.taskforceAgentTestNotice, children: [_jsx(CheckCircle, { size: 14, "aria-hidden": "true" }), _jsx("span", { children: "Test messages are not saved to conversations and cannot write to task-scoped tools." })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Test Prompt" }), _jsx("textarea", { className: styles.input, value: draftTestPrompt, onChange: (event) => setDraftTestPrompt(event.target.value), placeholder: "Ask the draft agent a representative question...", rows: 5, disabled: testingDraft })] }), _jsxs("div", { className: styles.taskforceAgentTestActions, children: [_jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: resetDraftTest, disabled: testingDraft || (!draftTestPrompt && !draftTestResult && !draftTestError), children: [_jsx(RotateCcw, { size: 14 }), "Reset"] }), selectedAgentId && onOpenConversation ? (_jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => onOpenConversation(selectedAgentId), disabled: testingDraft, children: [_jsx(MessageSquare, { size: 14 }), "Open in Conversation"] })) : null, _jsxs("button", { type: "button", className: styles.primaryUpdateBtn, onClick: () => { void handleDraftTest(); }, disabled: testingDraft || !draftTestPrompt.trim() || !definitionDraft.purpose.trim() || !modelKey, children: [testingDraft ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Beaker, { size: 14 }), testingDraft ? 'Testing...' : 'Run Test'] })] }), !canUseCloudAgentRuntime ? (_jsx("p", { className: styles.taskforceAgentTestRestriction, children: authSessionResolved
-                                                            ? 'Sign in to Taskforce Cloud to run agent tests.'
-                                                            : 'Checking Taskforce Cloud sign-in...' })) : null, draftTestError ? (_jsxs("div", { className: styles.taskforceAgentTestError, role: "alert", children: [_jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: draftTestError })] })) : null, testingDraft ? (_jsxs("div", { className: styles.taskforceAgentTestPending, role: "status", children: [_jsx(Loader2, { size: 15, className: styles.spinner }), _jsx("span", { children: "Running isolated test..." })] })) : null, draftTestResult ? (_jsxs("div", { className: styles.taskforceAgentTestResult, role: "status", "aria-live": "polite", children: [_jsxs("div", { className: styles.taskforceAgentTestResultHeader, children: [_jsxs("span", { children: [_jsx(CheckCircle, { size: 14 }), " Test completed"] }), _jsxs("span", { children: [formatModelGatewayLatency(draftTestResult), " \u00B7 ", formatModelGatewayUsage(draftTestResult)] })] }), _jsx("div", { className: styles.taskforceAgentTestResponse, children: _jsx(Markdown, { variant: "conversation", children: draftTestResult.text }) }), _jsxs("details", { className: styles.taskforceAgentToolActivity, children: [_jsxs("summary", { children: [_jsx("span", { children: "Response Details" }), _jsx("strong", { children: labelForTaskforceAgentModel(draftTestSnapshot?.modelKey || modelKey) })] }), _jsxs("div", { className: styles.taskforceAgentMetaGrid, children: [_jsxs("div", { children: [_jsx("span", { children: "Tested agent" }), _jsx("strong", { children: draftTestSnapshot?.agentName || agentName.trim() || DEFAULT_AGENT_NAME })] }), _jsxs("div", { children: [_jsx("span", { children: "Provider" }), _jsx("strong", { children: labelForTaskforceAgentProvider(draftTestSnapshot?.providerKey || providerKey) })] }), _jsxs("div", { children: [_jsx("span", { children: "Runtime model" }), _jsx("code", { children: draftTestResult.modelId || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Test prompt" }), _jsx("strong", { children: draftTestSnapshot?.prompt || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Tested purpose" }), _jsx("strong", { children: draftTestSnapshot?.definition.purpose || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Tested working guidelines" }), _jsx("strong", { children: draftTestSnapshot?.definition.behavior.workingGuidelines || 'None' })] }), _jsxs("div", { children: [_jsx("span", { children: "Stop reason" }), _jsx("strong", { children: draftTestResult.stopReason || 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Input tokens" }), _jsx("strong", { children: draftTestResult.usage?.inputTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Output tokens" }), _jsx("strong", { children: draftTestResult.usage?.outputTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Total tokens" }), _jsx("strong", { children: draftTestResult.usage?.totalTokens ?? 'Not reported' })] }), _jsxs("div", { children: [_jsx("span", { children: "Latency" }), _jsx("strong", { children: formatModelGatewayLatency(draftTestResult) })] })] }), draftTestToolActivity.length > 0
-                                                                        ? renderToolActivityDetails(draftTestToolActivity, 'Managed Tool Activity')
-                                                                        : null] })] })) : null] }) })] }) }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-roles", "aria-labelledby": "taskforce-agent-builder-tab-roles", hidden: activeBuilderTab !== 'roles', children: activeBuilderTab === 'roles'
+                                                                    }, maxLength: 4000, rows: 3, placeholder: "Describe medium, palette, lighting, period, or atmosphere." })] })) : null] }), _jsxs("details", { className: styles.taskforceAgentToolActivity, children: [_jsxs("summary", { children: [_jsx("span", { children: "Technical model details" }), _jsx("strong", { children: selectedModel ? formatModelAvailability(selectedModel.availability) : 'Unavailable' })] }), _jsxs("div", { className: styles.taskforceAgentMetaGrid, children: [_jsxs("div", { children: [_jsx("span", { children: "Model ID" }), _jsx("code", { children: selectedModel?.runtimeModelId || 'No configured model' })] }), _jsxs("div", { children: [_jsx("span", { children: "Max Output" }), _jsx("strong", { children: formatMaxOutputTokens(selectedModel?.defaultMaxTokens) })] })] })] })] }), _jsxs("aside", { className: styles.taskforceAgentOutputStack, "aria-label": "Agent Role and Capabilities", children: [_jsx(AgentBehaviorAssignments, { workspaceId: workspaceId, roleRef: definitionDraft.roleRef, skillRefs: definitionDraft.skillRefs, onRoleRefChange: (roleRef) => {
+                                                        configurationDraftDirtyRef.current = true;
+                                                        setDefinitionDraft((current) => ({
+                                                            ...current,
+                                                            roleRef,
+                                                        }));
+                                                    }, onSkillRefsChange: (skillRefs) => {
+                                                        configurationDraftDirtyRef.current = true;
+                                                        setDefinitionDraft((current) => ({
+                                                            ...current,
+                                                            skillRefs,
+                                                        }));
+                                                    }, onManageRoles: () => setActiveBuilderTab('roles'), onManageSkills: () => setActiveBuilderTab('skills') }), _jsx(ToolAccessSelector, { selectedKeys: definitionDraft.requestedCapabilities, hasCustomOverrides: Boolean(selectedAgent?.definition?.toolPolicy.toolOverrides?.length
+                                                        && !definitionDraft.toolAccessChanged), onChange: (requestedCapabilities) => {
+                                                        configurationDraftDirtyRef.current = true;
+                                                        setDefinitionDraft((current) => ({
+                                                            ...current,
+                                                            requestedCapabilities,
+                                                            toolAccessChanged: true,
+                                                        }));
+                                                    } }), _jsx(EffectiveConfigurationSummary, { hasRole: Boolean(definitionDraft.roleRef), directSkillCount: definitionDraft.skillRefs.length, toolKeys: definitionDraft.requestedCapabilities })] })] }) }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-roles", "aria-labelledby": "taskforce-agent-builder-tab-roles", hidden: activeBuilderTab !== 'roles', children: activeBuilderTab === 'roles'
                                     ? (_jsx(RoleManagerPanel, { workspaceId: workspaceId, libraryPortalTarget: roleLibraryPortalTarget }))
-                                    : null }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-skills", "aria-labelledby": "taskforce-agent-builder-tab-skills", hidden: activeBuilderTab !== 'skills', children: _jsx(SkillManagerPanel, { workspaceId: workspaceId, active: activeBuilderTab === 'skills', libraryPortalTarget: skillLibraryPortalTarget }, workspaceId) }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-connections", "aria-labelledby": "taskforce-agent-builder-tab-connections", hidden: activeBuilderTab !== 'connections', children: activeBuilderTab === 'connections' ? _jsx(FutureWorkspacePanel, { kind: "connections" }) : null }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-resources", "aria-labelledby": "taskforce-agent-builder-tab-resources", hidden: activeBuilderTab !== 'resources', children: activeBuilderTab === 'resources' ? _jsx(FutureWorkspacePanel, { kind: "resources" }) : null })] }), _jsx(Modal, { isOpen: Boolean(pendingAgentNavigation), onClose: () => setPendingAgentNavigation(null), title: "Discard unsaved changes?", size: "sm", theme: theme, closeOnOverlayClick: false, footer: (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "tf-button-secondary", onClick: () => setPendingAgentNavigation(null), "data-modal-initial-focus": true, children: "Keep editing" }), _jsx("button", { type: "button", className: "tf-button-destructive", onClick: discardDraftAndNavigate, children: "Discard changes" })] })), children: _jsx("p", { children: "Your unsaved Agent changes will be lost." }) }), _jsx(AvatarImageManagerModal, { isOpen: avatarEditorOpen, theme: theme, title: "Edit Agent Profile Photo", currentImageUrl: selectedAgentAvatarUrl, editorImageUrl: selectedAgentAvatarSourceUrl, fallbackInitial: (selectedAgent?.name || 'Agent').charAt(0).toUpperCase(), accept: "image/png,image/jpeg,image/webp,image/gif", busy: agentAvatarBusy, generating: Boolean(selectedAgentId && generatingAvatarAgentIds.has(selectedAgentId)), generateLabel: selectedAgent?.avatarUrl ? 'Regenerate' : 'Generate', hasPendingImage: false, canRemove: Boolean(selectedAgent?.avatarUrl), error: agentAvatarError || selectedAgentGenerationFeedback?.error || null, notice: agentAvatarNotice || selectedAgentGenerationFeedback?.notice || null, onClose: () => {
+                                    : null }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-skills", "aria-labelledby": "taskforce-agent-builder-tab-skills", hidden: activeBuilderTab !== 'skills', children: _jsx(SkillManagerPanel, { workspaceId: workspaceId, active: activeBuilderTab === 'skills', libraryPortalTarget: skillLibraryPortalTarget }, workspaceId) }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-connections", "aria-labelledby": "taskforce-agent-builder-tab-connections", hidden: activeBuilderTab !== 'connections', children: activeBuilderTab === 'connections' ? (_jsx(ModelConnectionsPanel, { workspaceId: workspaceId, active: true, runtimeMode: runtimeMode, eligible: subscriptionConnectionsEligible, cloudAccessAvailable: modelConnectionCloudAccessAvailable, cloudAccessPending: modelConnectionCloudAccessPending, cloudAuthConfigured: cloudAuthConfigured, resolveCloudAuthUrl: resolveCloudAuthUrl, onConnectionActivated: handleConnectionActivated, onConnectionUnavailable: handleConnectionUnavailable, onReturnToAgent: () => activateBuilderTab('agents', true), libraryPortalTarget: connectionLibraryPortalTarget })) : null }), _jsx("section", { className: styles.taskforceAgentBuilderPanel, role: "tabpanel", id: "taskforce-agent-builder-resources", "aria-labelledby": "taskforce-agent-builder-tab-resources", hidden: activeBuilderTab !== 'resources', children: activeBuilderTab === 'resources' ? _jsx(FutureWorkspacePanel, { kind: "resources" }) : null })] }), _jsx(Modal, { isOpen: Boolean(pendingAgentNavigation), onClose: () => setPendingAgentNavigation(null), title: "Discard unsaved changes?", size: "sm", theme: theme, closeOnOverlayClick: false, footer: (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "tf-button-secondary", onClick: () => setPendingAgentNavigation(null), "data-modal-initial-focus": true, children: "Keep editing" }), _jsx("button", { type: "button", className: "tf-button-destructive", onClick: discardDraftAndNavigate, children: "Discard changes" })] })), children: _jsx("p", { children: "Your unsaved Agent changes will be lost." }) }), _jsx(AvatarImageManagerModal, { isOpen: avatarEditorOpen, theme: theme, title: "Edit Agent Profile Photo", currentImageUrl: selectedAgentAvatarUrl, editorImageUrl: selectedAgentAvatarSourceUrl, fallbackInitial: (selectedAgent?.name || 'Agent').charAt(0).toUpperCase(), accept: "image/png,image/jpeg,image/webp,image/gif", busy: agentAvatarBusy, generating: Boolean(selectedAgentId && generatingAvatarAgentIds.has(selectedAgentId)), generateLabel: selectedAgent?.avatarUrl ? 'Regenerate' : 'Generate', hasPendingImage: false, canRemove: Boolean(selectedAgent?.avatarUrl), error: agentAvatarError || selectedAgentGenerationFeedback?.error || null, notice: agentAvatarNotice || selectedAgentGenerationFeedback?.notice || null, onClose: () => {
                             if (agentAvatarBusy)
                                 return;
                             setAvatarEditorOpen(false);