@taskforcehq/taskforce 0.3.324 → 0.3.327

package/dist/components/features/TaskforceAgentsModule.js

@@ -0,0 +1,1782 @@
+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 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 { dispatchTaskforceAgentsMutated, TASKFORCE_AGENTS_MUTATED_EVENT } from '../../utils/taskforceAgentEvents';
+import { dispatchTaskforceTasksMutated } from '../../utils/taskEvents';
+import { buildVersionedAvatarUrl } from '../../utils/avatarDisplay';
+import { resolveCloudAssetDisplayUrl, withTaskforceCloudHint } from '../../utils/cloudAssetDisplay';
+import { dispatchTaskforceAiProfilesMutated, TASKFORCE_AI_PROFILES_MUTATED_EVENT, } from '../../utils/aiProfileEvents';
+import { AiIdentityRosterCard } from '../ui/AiIdentityRosterCard.js';
+import { EditableAvatarButton } from '../ui/EditableAvatarButton.js';
+import { useFallbackImageUrl } from '../ui/useFallbackImageUrl.js';
+import { Modal } from '../ui/Modal.js';
+import { AvatarImageManagerModal } from '../views/standalone/modals/AvatarImageManagerModal.js';
+import { prepareAvatarUploadFile } from '../../utils/avatarUpload.js';
+import { Markdown } from '../ui/Markdown.js';
+import { RoleManagerPanel } from './agentRoles/RoleManagerPanel.js';
+import { AgentBehaviorAssignments } from './taskforceAgentAssignments/AgentBehaviorAssignments.js';
+import { AVATAR_ART_STYLE_PRESETS, buildTaskforceAgentDefinitionFromDraft, createTaskforceAgentEditorDraft, CUSTOM_PRESET_VALUE, DEFAULT_AVATAR_ART_STYLE_LABEL, hasUnsavedAvatarPresentation, PERSONALITY_PRESETS, RESPONSE_STYLE_PRESETS, } from './taskforceAgentEditorModel.js';
+import { SkillManagerPanel } from './agentSkills/SkillManagerPanel.js';
+import { EffectiveConfigurationSummary, FutureLibrarySummary, FutureWorkspacePanel, ToolAccessSelector, } from './agentCapabilities/AgentCapabilitiesPrototype.js';
+import { applyCloudWorkflowCompletionProjection, } from './workflowManager/workflowManagerApi.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_BUILDER_TABS = [
+    { id: 'agents', label: 'Agents' },
+    { id: 'roles', label: 'Roles' },
+    { id: 'skills', label: 'Skills' },
+    { id: 'connections', label: 'Connections' },
+    { id: 'resources', label: 'Resources' },
+];
+function formatModelGatewayUsage(result) {
+    const totalTokens = result?.usage?.totalTokens;
+    return totalTokens === undefined || totalTokens === null
+        ? 'Not reported'
+        : `${totalTokens} tokens`;
+}
+function formatModelGatewayLatency(result) {
+    return result?.latencyMs === undefined || result?.latencyMs === null
+        ? 'Not reported'
+        : `${result.latencyMs} ms`;
+}
+function getAgentAvatarUrl(agent) {
+    if (!agent?.avatarUrl)
+        return '';
+    return buildVersionedAvatarUrl(agent.avatarUrl, agent.avatarRevision, agent.avatarUpdatedAt);
+}
+function getAgentAvatarSourceUrl(agent) {
+    if (!agent?.avatarSourceUrl)
+        return '';
+    return buildVersionedAvatarUrl(agent.avatarSourceUrl, agent.avatarRevision, agent.avatarUpdatedAt);
+}
+function AgentAvatarImage({ src, fallbackSize }) {
+    const { activeImageUrl, handleImageError } = useFallbackImageUrl(src);
+    return activeImageUrl
+        ? _jsx("img", { src: activeImageUrl, alt: "", onError: handleImageError })
+        : _jsx(Bot, { size: fallbackSize });
+}
+function fileToDataUrl(file) {
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = () => resolve(String(reader.result || ''));
+        reader.onerror = () => reject(new Error('Failed to read image file.'));
+        reader.readAsDataURL(file);
+    });
+}
+function normalizedAvatarRevision(value) {
+    if (value === null || value === undefined || value === '')
+        return null;
+    const revision = Number(value);
+    return Number.isFinite(revision) ? Math.max(0, Math.floor(revision)) : null;
+}
+function compactResponseText(value) {
+    const text = String(value || '').replace(/\s+/g, ' ').trim();
+    return text.length > 260 ? `${text.slice(0, 257).trim()}...` : text;
+}
+function isHtmlResponse(value) {
+    return /^\s*(?:<!doctype\s+html|<html\b)/i.test(String(value || ''));
+}
+function formatAgentProvider(_provider) {
+    return 'Taskforce HQ';
+}
+function formatModelTier(tier) {
+    if (tier === 'fast')
+        return 'Fast';
+    if (tier === 'advanced')
+        return 'Advanced';
+    return 'Balanced';
+}
+function formatModelAvailability(availability) {
+    if (availability === 'verified')
+        return 'Verified';
+    if (availability === 'configured')
+        return 'Configured';
+    return 'Unavailable';
+}
+const SENSITIVE_TOOL_ARG_PATTERN = /(token|secret|password|credential|api[-_]?key|access[-_]?key)/i;
+function sanitizeToolLogValue(value) {
+    if (Array.isArray(value))
+        return value.map((item) => sanitizeToolLogValue(item));
+    if (!value || typeof value !== 'object') {
+        if (typeof value !== 'string')
+            return value;
+        return 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),
+    ]));
+}
+function formatToolLogJson(value) {
+    const sanitized = sanitizeToolLogValue(value || {});
+    const text = JSON.stringify(sanitized, null, 2);
+    return text.length > 700 ? `${text.slice(0, 697).trim()}...` : text;
+}
+function formatToolLogResult(value) {
+    const text = String(value || '').replace(/\s+/g, ' ').trim();
+    if (!text)
+        return 'No result text returned.';
+    return text.length > 320 ? `${text.slice(0, 317).trim()}...` : text;
+}
+function formatToolActivitySummary(toolActivity) {
+    const count = toolActivity.length;
+    if (count === 0)
+        return 'No tools used';
+    const failedCount = toolActivity.filter((toolCall) => !toolCall.ok).length;
+    const toolLabel = count === 1 ? 'tool' : 'tools';
+    return failedCount > 0
+        ? `${count} ${toolLabel} used, ${failedCount} failed`
+        : `${count} ${toolLabel} used`;
+}
+function formatToolActivityLogMessage(toolActivity) {
+    const count = toolActivity.length;
+    const failedCount = toolActivity.filter((toolCall) => !toolCall.ok).length;
+    const toolLabel = count === 1 ? 'tool' : 'tools';
+    return failedCount > 0
+        ? `Used ${count} Taskforce ${toolLabel}; ${failedCount} failed.`
+        : `Used ${count} Taskforce ${toolLabel}.`;
+}
+function formatMaxOutputTokens(tokens) {
+    return typeof tokens === 'number' && Number.isFinite(tokens)
+        ? `${tokens.toLocaleString()} tokens`
+        : 'Not configured';
+}
+function formatConversationRole(message, fallbackAgentLabel) {
+    return message.role === 'user' ? 'You' : (message.agentName || fallbackAgentLabel);
+}
+function summarizeConversation(conversation) {
+    return {
+        id: conversation.id,
+        workspaceId: conversation.workspaceId,
+        agentId: conversation.agentId,
+        taskId: conversation.taskId,
+        taskReference: conversation.taskReference,
+        taskTitle: conversation.taskTitle,
+        context: conversation.context,
+        title: conversation.title || conversation.messages.find((message) => message.role === 'user')?.content || 'Agent chat',
+        messageCount: conversation.messages.length,
+        modelProvider: conversation.modelProvider,
+        modelId: conversation.modelId,
+        usage: conversation.usage,
+        latencyMs: conversation.latencyMs,
+        createdAt: conversation.createdAt,
+        updatedAt: conversation.updatedAt,
+    };
+}
+function resolveConversationTaskContext(conversation) {
+    const context = conversation?.context?.type === 'task' ? conversation.context : null;
+    const taskId = String(context?.taskId || conversation?.taskId || '').trim();
+    if (!taskId)
+        return null;
+    const taskReference = String(context?.taskReference || conversation?.taskReference || '').trim();
+    const taskTitle = String(context?.taskTitle || conversation?.taskTitle || '').trim();
+    return {
+        type: 'task',
+        taskId,
+        taskReference,
+        taskTitle,
+    };
+}
+function mergeTaskContext(context, fallback) {
+    if (!context)
+        return null;
+    if (!fallback || fallback.taskId !== context.taskId)
+        return context;
+    return {
+        type: 'task',
+        taskId: context.taskId,
+        taskReference: context.taskReference || fallback.taskReference,
+        taskTitle: context.taskTitle || fallback.taskTitle,
+    };
+}
+function formatTaskContextLabel(context) {
+    const reference = String(context.taskReference || '').trim();
+    const title = String(context.taskTitle || '').trim();
+    if (reference)
+        return `${reference}${title ? ` · ${title}` : ''}`;
+    return title || 'Linked task';
+}
+function formatConversationOption(summary, fallbackContext = null) {
+    const title = String(summary.title || 'Agent chat').trim() || 'Agent chat';
+    const count = Number(summary.messageCount || 0);
+    const ownTaskContext = resolveConversationTaskContext(summary);
+    const taskContext = ownTaskContext ? mergeTaskContext(ownTaskContext, 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, }) {
+    const logIdRef = useRef(1);
+    const initialAgentWorkspaceRef = useRef(null);
+    const loadedAgentWorkspaceRef = useRef(null);
+    const selectedAgentIdRef = useRef(null);
+    const signatureColorEditPendingRef = useRef(false);
+    const configurationDraftDirtyRef = useRef(false);
+    const conversationEndRef = useRef(null);
+    const conversationRenameRunIdRef = useRef(0);
+    const draftTestRunIdRef = useRef(0);
+    const builderTabRefs = useRef({
+        agents: null,
+        roles: null,
+        skills: null,
+        connections: null,
+        resources: null,
+    });
+    const [activeBuilderTab, setActiveBuilderTab] = useState('agents');
+    const [roleLibraryPortalTarget, setRoleLibraryPortalTarget] = useState(null);
+    const [skillLibraryPortalTarget, setSkillLibraryPortalTarget] = useState(null);
+    const [agents, setAgents] = useState([]);
+    const [selectedAgentId, setSelectedAgentId] = useState(null);
+    const [agentName, setAgentName] = useState('');
+    const [modelProvider, setModelProvider] = useState('taskforce_hq');
+    const [providerKey, setProviderKey] = useState(DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY);
+    const [modelKey, setModelKey] = useState(DEFAULT_TASKFORCE_AGENT_MODEL_KEY);
+    const [modelTier, setModelTier] = useState('balanced');
+    const [definitionDraft, setDefinitionDraft] = useState(() => (createTaskforceAgentEditorDraft(null, { systemPrompt: DEFAULT_SYSTEM_PROMPT })));
+    const systemPrompt = definitionDraft.workingGuidelines;
+    const setSystemPrompt = useCallback((value) => {
+        configurationDraftDirtyRef.current = true;
+        setDefinitionDraft((current) => ({
+            ...current,
+            workingGuidelines: value,
+        }));
+    }, []);
+    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([]);
+    const [conversationMessages, setConversationMessages] = useState([]);
+    const [renamingConversation, setRenamingConversation] = useState(false);
+    const [conversationTitleDraft, setConversationTitleDraft] = useState('');
+    const [conversationRenameError, setConversationRenameError] = useState('');
+    const [savingConversationTitle, setSavingConversationTitle] = useState(false);
+    const [result, setResult] = useState(null);
+    const [toolActivity, setToolActivity] = useState([]);
+    const [promptStatus, setPromptStatus] = useState('');
+    const [logs, setLogs] = useState(() => [
+        {
+            id: logIdRef.current++,
+            type: 'info',
+            message: 'Ready to run this agent through the server-side model gateway.',
+            timestamp: new Date().toLocaleTimeString(),
+        }
+    ]);
+    const [testing, setTesting] = useState(false);
+    const [draftTestPrompt, setDraftTestPrompt] = useState('');
+    const [draftTestResult, setDraftTestResult] = useState(null);
+    const [draftTestSnapshot, setDraftTestSnapshot] = useState(null);
+    const [draftTestToolActivity, setDraftTestToolActivity] = useState([]);
+    const [draftTestError, setDraftTestError] = useState('');
+    const [testingDraft, setTestingDraft] = useState(false);
+    const [loadingAgents, setLoadingAgents] = useState(false);
+    const [loadingConversationList, setLoadingConversationList] = useState(false);
+    const [loadingConversation, setLoadingConversation] = useState(false);
+    const [savingAgent, setSavingAgent] = useState(false);
+    const [configFeedback, setConfigFeedback] = useState(null);
+    const [pendingAgentNavigation, setPendingAgentNavigation] = useState(null);
+    const [generatingAvatarAgentIds, setGeneratingAvatarAgentIds] = useState(() => new Set());
+    const [avatarGenerationFeedbackByAgentId, setAvatarGenerationFeedbackByAgentId] = useState({});
+    const [avatarEditorOpen, setAvatarEditorOpen] = useState(false);
+    const [agentAvatarBusy, setAgentAvatarBusy] = useState(false);
+    const [agentAvatarError, setAgentAvatarError] = useState(null);
+    const [agentAvatarNotice, setAgentAvatarNotice] = useState(null);
+    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 selectedModel = useMemo(() => modelOptions.find((model) => model.key === modelKey) || null, [modelKey, modelOptions]);
+    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]);
+    const normalizedRememberedConversationByAgentId = useMemo(() => {
+        const normalized = {};
+        Object.entries(rememberedConversationByAgentId || {}).forEach(([agentId, conversationId]) => {
+            const normalizedAgentId = String(agentId || '').trim();
+            const normalizedConversationId = String(conversationId || '').trim();
+            if (!normalizedAgentId || !normalizedConversationId)
+                return;
+            normalized[normalizedAgentId] = normalizedConversationId;
+        });
+        return normalized;
+    }, [rememberedConversationByAgentId]);
+    const shouldUseCloudAvatarGeneration = runtimeMode === 'local' && cloudAuthConfigured;
+    const canUseCloudAvatarGeneration = !shouldUseCloudAvatarGeneration
+        || (authSessionResolved && isAuthenticated && Boolean(resolveCloudAuthUrl));
+    const shouldUseCloudAgentRuntime = runtimeMode === 'local' && cloudAuthConfigured;
+    const canUseCloudAgentRuntime = !shouldUseCloudAgentRuntime
+        || (authSessionResolved && isAuthenticated);
+    const selectedAgentAvatarUrl = useMemo(() => getAgentAvatarUrl(selectedAgent), [selectedAgent]);
+    const selectedAgentAvatarSourceUrl = useMemo(() => getAgentAvatarSourceUrl(selectedAgent), [selectedAgent]);
+    const isSelectedAgentAvatarSyncing = Boolean(selectedAgentId && avatarSyncingAgentIds.has(selectedAgentId));
+    const selectedAgentGenerationFeedback = selectedAgentId
+        ? avatarGenerationFeedbackByAgentId[selectedAgentId] || null
+        : null;
+    const selectedConversationSummary = useMemo(() => conversationSummaries.find((conversation) => conversation.id === conversationId) || null, [conversationId, conversationSummaries]);
+    const taskLaunchContext = useMemo(() => {
+        const taskId = String(launchContext?.taskId || '').trim();
+        if (!taskId)
+            return null;
+        const taskReference = String(launchContext?.taskReference || '').trim();
+        const taskTitle = String(launchContext?.taskTitle || '').trim();
+        return {
+            type: 'task',
+            taskId,
+            taskReference,
+            taskTitle,
+        };
+    }, [launchContext?.taskId, launchContext?.taskReference, launchContext?.taskTitle]);
+    const selectedConversationTaskContext = useMemo(() => resolveConversationTaskContext(selectedConversationSummary), [selectedConversationSummary]);
+    const activeTaskContext = conversationId
+        ? (selectedConversationTaskContext ? mergeTaskContext(selectedConversationTaskContext, taskLaunchContext) : null)
+        : taskLaunchContext;
+    const activeTaskContextLabel = activeTaskContext ? formatTaskContextLabel(activeTaskContext) : '';
+    const canClearActiveTaskContext = Boolean(activeTaskContext && taskLaunchContext && !conversationId);
+    const conversationOwnerAgent = useMemo(() => {
+        const agentId = String(selectedConversationSummary?.agentId || selectedAgentId || '').trim();
+        return agents.find((agent) => agent.id === agentId) || null;
+    }, [agents, selectedAgentId, selectedConversationSummary?.agentId]);
+    const conversationAgentLabel = conversationOwnerAgent?.name || selectedAgent?.name || agentName.trim() || DEFAULT_AGENT_NAME;
+    const conversationAgentColor = conversationOwnerAgent?.color
+        || selectedAgent?.color
+        || (conversationOwnerAgent?.id
+            ? assignedAiProfileColor(conversationOwnerAgent.id)
+            : selectedAgent?.id
+                ? assignedAiProfileColor(selectedAgent.id)
+                : undefined);
+    const lastEmittedSelectionRef = useRef('');
+    const rememberSelection = useCallback((agentId, nextConversationId) => {
+        if (!onRememberSelection)
+            return;
+        const normalizedAgentId = String(agentId || '').trim();
+        const normalizedConversationId = String(nextConversationId || '').trim();
+        const nextKey = `${normalizedAgentId}:${normalizedConversationId}`;
+        if (lastEmittedSelectionRef.current === nextKey)
+            return;
+        lastEmittedSelectionRef.current = nextKey;
+        onRememberSelection({
+            agentId: normalizedAgentId || null,
+            conversationId: normalizedConversationId || null,
+        });
+    }, [onRememberSelection]);
+    const appendLog = useCallback((type, message, nextToolActivity) => {
+        setLogs((current) => [
+            ...current,
+            {
+                id: logIdRef.current++,
+                type,
+                message,
+                timestamp: new Date().toLocaleTimeString(),
+                ...(nextToolActivity && nextToolActivity.length > 0 ? { toolActivity: nextToolActivity } : {}),
+            },
+        ]);
+    }, []);
+    const resetDraftTest = useCallback(() => {
+        draftTestRunIdRef.current += 1;
+        setDraftTestPrompt('');
+        setDraftTestResult(null);
+        setDraftTestSnapshot(null);
+        setDraftTestToolActivity([]);
+        setDraftTestError('');
+        setTestingDraft(false);
+    }, []);
+    const applyAgent = useCallback((agent) => {
+        conversationRenameRunIdRef.current += 1;
+        configurationDraftDirtyRef.current = false;
+        selectedAgentIdRef.current = agent.id;
+        setSelectedAgentId(agent.id);
+        setAgentName(agent.name);
+        setModelProvider('taskforce_hq');
+        setProviderKey(normalizeTaskforceAgentProviderKey(agent.providerKey));
+        setModelKey(normalizeTaskforceAgentModelKey(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([]);
+        setConversationMessages([]);
+        setRenamingConversation(false);
+        setConversationTitleDraft('');
+        setConversationRenameError('');
+        setSavingConversationTitle(false);
+        setResult(null);
+        setToolActivity([]);
+        setConfigFeedback(null);
+        resetDraftTest();
+    }, [resetDraftTest]);
+    const selectAgent = useCallback((agent) => {
+        applyAgent(agent);
+        rememberSelection(agent.id, normalizedRememberedConversationByAgentId[agent.id] || null);
+    }, [applyAgent, normalizedRememberedConversationByAgentId, rememberSelection]);
+    const applyConversation = useCallback((conversation) => {
+        conversationRenameRunIdRef.current += 1;
+        const messages = Array.isArray(conversation?.messages) ? conversation.messages : [];
+        const lastAssistantMessage = [...messages].reverse().find((message) => message.role === 'assistant');
+        setConversationId(conversation?.id || null);
+        setConversationMessages(messages);
+        setRenamingConversation(false);
+        setConversationTitleDraft('');
+        setConversationRenameError('');
+        setSavingConversationTitle(false);
+        setResult(lastAssistantMessage ? {
+            text: lastAssistantMessage.content,
+            provider: conversation?.modelProvider || 'taskforce_hq',
+            modelId: conversation?.modelId || 'Not reported',
+            latencyMs: conversation?.latencyMs ?? null,
+            usage: conversation?.usage || null,
+        } : null);
+    }, []);
+    const upsertConversationSummary = useCallback((conversation) => {
+        const summary = summarizeConversation(conversation);
+        setConversationSummaries((current) => {
+            const withoutExisting = current.filter((candidate) => candidate.id !== summary.id);
+            return [summary, ...withoutExisting];
+        });
+    }, []);
+    const resetAgentDraft = useCallback(() => {
+        conversationRenameRunIdRef.current += 1;
+        configurationDraftDirtyRef.current = false;
+        selectedAgentIdRef.current = null;
+        setSelectedAgentId(null);
+        setAgentName('');
+        setModelProvider('taskforce_hq');
+        setProviderKey(DEFAULT_TASKFORCE_AGENT_PROVIDER_KEY);
+        setModelKey(DEFAULT_TASKFORCE_AGENT_MODEL_KEY);
+        setModelTier('balanced');
+        setDefinitionDraft(createTaskforceAgentEditorDraft(null, {
+            systemPrompt: DEFAULT_SYSTEM_PROMPT,
+        }));
+        setSignatureColor('');
+        setSignatureColorDirty(false);
+        setSignatureColorReset(false);
+        signatureColorEditPendingRef.current = false;
+        setConversationId(null);
+        setConversationSummaries([]);
+        setConversationMessages([]);
+        setRenamingConversation(false);
+        setConversationTitleDraft('');
+        setConversationRenameError('');
+        setSavingConversationTitle(false);
+        setResult(null);
+        setToolActivity([]);
+        setConfigFeedback(null);
+        resetDraftTest();
+        rememberSelection(null, null);
+    }, [rememberSelection, resetDraftTest]);
+    const performAgentNavigation = useCallback((target) => {
+        if (target.type === 'new') {
+            resetAgentDraft();
+            appendLog('info', 'Started a new Taskforce agent draft.');
+            return;
+        }
+        selectAgent(target.agent);
+    }, [appendLog, resetAgentDraft, selectAgent]);
+    const requestAgentNavigation = useCallback((target) => {
+        if (target.type === 'agent' && target.agent.id === selectedAgentIdRef.current)
+            return;
+        if (!configurationDraftDirtyRef.current) {
+            performAgentNavigation(target);
+            return;
+        }
+        setPendingAgentNavigation(target);
+    }, [performAgentNavigation]);
+    const discardDraftAndNavigate = useCallback(() => {
+        if (!pendingAgentNavigation)
+            return;
+        const target = pendingAgentNavigation;
+        setPendingAgentNavigation(null);
+        configurationDraftDirtyRef.current = false;
+        performAgentNavigation(target);
+    }, [pendingAgentNavigation, performAgentNavigation]);
+    useEffect(() => {
+        const handleBeforeUnload = (event) => {
+            if (!configurationDraftDirtyRef.current)
+                return;
+            event.preventDefault();
+            event.returnValue = '';
+        };
+        window.addEventListener('beforeunload', handleBeforeUnload);
+        return () => window.removeEventListener('beforeunload', handleBeforeUnload);
+    }, []);
+    const loadConversation = useCallback(async (agentId, nextConversationId) => {
+        setLoadingConversation(true);
+        try {
+            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(agentId)}/conversation?workspaceId=${encodeURIComponent(workspaceId)}&conversationId=${encodeURIComponent(nextConversationId)}`, {
+                credentials: 'include',
+            });
+            const responseText = typeof res.clone === 'function'
+                ? await res.clone().text().catch(() => '')
+                : '';
+            const payload = await res.json().catch(() => ({}));
+            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.'
+                    : `Unable to load saved agent conversation. HTTP ${res.status || 'unknown'}.`;
+                appendLog('error', String(payload?.error || responseText || fallback));
+                return;
+            }
+            if (selectedAgentIdRef.current !== agentId)
+                return;
+            const nextConversation = payload?.conversation || null;
+            applyConversation(nextConversation);
+            if (nextConversation)
+                upsertConversationSummary(nextConversation);
+            rememberSelection(agentId, nextConversation?.id || null);
+            setToolActivity([]);
+        }
+        catch (err) {
+            appendLog('error', String(err?.message || err || 'Unable to load saved agent conversation.'));
+        }
+        finally {
+            setLoadingConversation(false);
+        }
+    }, [appendLog, applyConversation, rememberSelection, upsertConversationSummary, workspaceId]);
+    const loadConversationHistory = useCallback(async (agentId) => {
+        setLoadingConversationList(true);
+        setLoadingConversation(true);
+        try {
+            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(agentId)}/conversations?workspaceId=${encodeURIComponent(workspaceId)}`, {
+                credentials: 'include',
+            });
+            const responseText = typeof res.clone === 'function'
+                ? await res.clone().text().catch(() => '')
+                : '';
+            const payload = await res.json().catch(() => ({}));
+            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.'
+                    : `Unable to load saved agent conversations. HTTP ${res.status || 'unknown'}.`;
+                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) {
+                const rememberedConversationIdForAgent = normalizedRememberedConversationByAgentId[agentId]
+                    || (agentId === normalizedRememberedAgentId ? normalizedRememberedConversationId : '');
+                const restoredConversation = rememberedConversationIdForAgent
+                    ? summaries.find((conversation) => conversation.id === rememberedConversationIdForAgent)
+                    : null;
+                const taskConversation = taskLaunchContext
+                    ? summaries.find((conversation) => resolveConversationTaskContext(conversation)?.taskId === taskLaunchContext.taskId)
+                    : null;
+                const nextConversationId = restoredConversation?.id || taskConversation?.id || (taskLaunchContext ? null : summaries[0].id);
+                if (nextConversationId) {
+                    await loadConversation(agentId, nextConversationId);
+                }
+                else {
+                    applyConversation(null);
+                    rememberSelection(agentId, null);
+                    setToolActivity([]);
+                }
+            }
+            else {
+                applyConversation(null);
+                rememberSelection(agentId, null);
+                setToolActivity([]);
+            }
+        }
+        catch (err) {
+            appendLog('error', String(err?.message || err || 'Unable to load saved agent conversations.'));
+        }
+        finally {
+            setLoadingConversationList(false);
+            setLoadingConversation(false);
+        }
+    }, [appendLog, applyConversation, loadConversation, normalizedRememberedAgentId, normalizedRememberedConversationByAgentId, normalizedRememberedConversationId, rememberSelection, taskLaunchContext, workspaceId]);
+    const loadAgents = useCallback(async (options) => {
+        const quiet = options?.quiet === true;
+        if (!quiet) {
+            setLoadingAgents(true);
+            setConfigFeedback(null);
+        }
+        try {
+            const res = await fetch(`/api/taskforce/agents?workspaceId=${encodeURIComponent(workspaceId)}`, {
+                credentials: 'include',
+            });
+            const responseText = typeof res.clone === 'function'
+                ? await res.clone().text().catch(() => '')
+                : '';
+            const payload = await res.json().catch(() => ({}));
+            if (!res.ok || payload?.success === false) {
+                const fallback = res.status === 404
+                    ? 'Taskforce agent API route is not available. Restart the app server so the latest routes are active.'
+                    : `Unable to load saved agents. HTTP ${res.status || 'unknown'}.`;
+                const message = String(payload?.error || responseText || fallback);
+                appendLog('error', message);
+                if (!quiet)
+                    setConfigFeedback({ type: 'error', message });
+                return;
+            }
+            const nextAgents = Array.isArray(payload?.agents) ? payload.agents : [];
+            loadedAgentWorkspaceRef.current = workspaceId;
+            setAgents((current) => {
+                const currentById = new Map(current.map((agent) => [agent.id, agent]));
+                return nextAgents.map((agent) => {
+                    const pendingRevision = pendingCloudAvatarRevisionByAgentIdRef.current.get(agent.id);
+                    const refreshedRevision = normalizedAvatarRevision(agent.avatarRevision);
+                    if (pendingRevision === undefined || (refreshedRevision !== null && refreshedRevision >= pendingRevision)) {
+                        return agent;
+                    }
+                    const optimisticAgent = currentById.get(agent.id);
+                    if (!optimisticAgent)
+                        return agent;
+                    return {
+                        ...agent,
+                        profileId: optimisticAgent.profileId || agent.profileId || null,
+                        avatarUrl: optimisticAgent.avatarUrl,
+                        avatarSourceUrl: optimisticAgent.avatarSourceUrl,
+                        avatarRevision: optimisticAgent.avatarRevision,
+                        avatarUpdatedAt: optimisticAgent.avatarUpdatedAt,
+                    };
+                });
+            });
+            setAvatarSyncingAgentIds((current) => {
+                let next = null;
+                for (const agentId of current) {
+                    const pendingRevision = pendingCloudAvatarRevisionByAgentIdRef.current.get(agentId);
+                    const refreshedAgent = nextAgents.find((agent) => agent.id === agentId);
+                    const refreshedRevision = normalizedAvatarRevision(refreshedAgent?.avatarRevision);
+                    if (pendingRevision === undefined || refreshedRevision === null || refreshedRevision < pendingRevision)
+                        continue;
+                    next ??= new Set(current);
+                    next.delete(agentId);
+                    pendingCloudAvatarRevisionByAgentIdRef.current.delete(agentId);
+                }
+                return next || current;
+            });
+            const activeAgentId = selectedAgentIdRef.current;
+            const refreshedActiveAgent = activeAgentId
+                ? nextAgents.find((agent) => agent.id === activeAgentId)
+                : null;
+            if (refreshedActiveAgent && !signatureColorEditPendingRef.current) {
+                setSignatureColor(refreshedActiveAgent.color || assignedAiProfileColor(refreshedActiveAgent.id));
+            }
+        }
+        catch (err) {
+            const message = String(err?.message || err || 'Unable to load saved agents.');
+            appendLog('error', message);
+            if (!quiet)
+                setConfigFeedback({ type: 'error', message });
+        }
+        finally {
+            if (!quiet)
+                setLoadingAgents(false);
+        }
+    }, [appendLog, workspaceId]);
+    useEffect(() => {
+        resetDraftTest();
+    }, [resetDraftTest, workspaceId]);
+    useEffect(() => {
+        void loadAgents();
+    }, [loadAgents]);
+    useEffect(() => {
+        if (!rememberedSelectionReady
+            || loadedAgentWorkspaceRef.current !== workspaceId
+            || initialAgentWorkspaceRef.current === workspaceId)
+            return;
+        if (agents.length === 0) {
+            if (loadingAgents)
+                return;
+            rememberSelection(null, null);
+            return;
+        }
+        initialAgentWorkspaceRef.current = workspaceId;
+        const restoredAgent = agents.find((agent) => agent.id === normalizedRememberedAgentId);
+        if (configurationDraftDirtyRef.current)
+            return;
+        applyAgent(restoredAgent || agents[0]);
+    }, [agents, applyAgent, loadingAgents, normalizedRememberedAgentId, rememberedSelectionReady, rememberSelection, workspaceId]);
+    useEffect(() => {
+        const handleAgentsMutated = (event) => {
+            const detail = event.detail;
+            const eventWorkspaceId = String(detail?.workspaceId || '').trim() || 'default';
+            if (eventWorkspaceId !== workspaceId)
+                return;
+            const reason = detail?.reason;
+            const shouldRefreshAgents = reason === 'sync-apply'
+                || reason === 'agent-avatar-upload'
+                || reason === 'agent-avatar-remove'
+                || (reason === 'agent-avatar-generate' && !shouldUseCloudAvatarGeneration);
+            if (!shouldRefreshAgents)
+                return;
+            void loadAgents({ quiet: true });
+            if (reason !== 'sync-apply')
+                return;
+            const eventAgentId = String(detail?.agentId || '').trim();
+            const activeAgentId = selectedAgentIdRef.current;
+            if (activeAgentId && (!eventAgentId || eventAgentId === activeAgentId)) {
+                void loadConversationHistory(activeAgentId);
+            }
+        };
+        window.addEventListener(TASKFORCE_AGENTS_MUTATED_EVENT, handleAgentsMutated);
+        return () => window.removeEventListener(TASKFORCE_AGENTS_MUTATED_EVENT, handleAgentsMutated);
+    }, [loadAgents, loadConversationHistory, shouldUseCloudAvatarGeneration, workspaceId]);
+    useEffect(() => {
+        const handleAiProfilesMutated = (event) => {
+            const detail = event.detail;
+            const eventWorkspaceId = String(detail?.workspaceId || '').trim() || 'default';
+            if (eventWorkspaceId !== workspaceId)
+                return;
+            if (detail?.origin === 'taskforce-agents-module')
+                return;
+            const avatar = detail?.taskforceAgentAvatar;
+            const avatarAgentId = String(avatar?.agentId || '').trim();
+            if (avatar && avatarAgentId) {
+                const avatarRevision = normalizedAvatarRevision(avatar.avatarRevision) ?? 0;
+                if (shouldUseCloudAvatarGeneration) {
+                    pendingCloudAvatarRevisionByAgentIdRef.current.set(avatarAgentId, avatarRevision);
+                    setAvatarSyncingAgentIds((current) => new Set(current).add(avatarAgentId));
+                }
+                setAgents((current) => current.map((agent) => agent.id === avatarAgentId ? {
+                    ...agent,
+                    profileId: detail.profileId || agent.profileId || null,
+                    avatarUrl: avatar.avatarUrl,
+                    avatarSourceUrl: avatar.avatarSourceUrl,
+                    avatarRevision,
+                    avatarUpdatedAt: avatar.avatarUpdatedAt,
+                } : agent));
+            }
+            void loadAgents({ quiet: true });
+        };
+        window.addEventListener(TASKFORCE_AI_PROFILES_MUTATED_EVENT, handleAiProfilesMutated);
+        return () => window.removeEventListener(TASKFORCE_AI_PROFILES_MUTATED_EVENT, handleAiProfilesMutated);
+    }, [loadAgents, shouldUseCloudAvatarGeneration, workspaceId]);
+    useEffect(() => {
+        const interval = window.setInterval(() => {
+            void loadAgents({ quiet: true });
+        }, AGENT_ROSTER_REFRESH_INTERVAL_MS);
+        return () => window.clearInterval(interval);
+    }, [loadAgents]);
+    useEffect(() => {
+        selectedAgentIdRef.current = selectedAgentId;
+    }, [selectedAgentId]);
+    useEffect(() => {
+        if (!selectedAgentId)
+            return;
+        void loadConversationHistory(selectedAgentId);
+    }, [loadConversationHistory, selectedAgentId]);
+    useEffect(() => {
+        if (avatarSyncingAgentIds.size === 0)
+            return;
+        const interval = window.setInterval(() => {
+            void loadAgents();
+        }, 4000);
+        return () => window.clearInterval(interval);
+    }, [avatarSyncingAgentIds.size, loadAgents]);
+    useEffect(() => {
+        if (surface !== 'taskDrawer' || !onRenderDrawerHeader)
+            return;
+        onRenderDrawerHeader(_jsxs("div", { className: styles.taskforceAgentDrawerAgentHeader, children: [_jsxs("button", { type: "button", className: `${styles.taskforceAgentDrawerAgentAvatar} ${styles.taskforceAgentDrawerAgentAvatarButton} ${isSelectedAgentAvatarSyncing ? styles.taskforceAgentAvatarSyncing : ''}`.trim(), onClick: () => setAgentProfileTrayOpen((current) => !current), disabled: !selectedAgentId, title: selectedAgent ? `View ${selectedAgent.name} profile` : 'Select an agent to view profile', "aria-label": selectedAgent ? `View ${selectedAgent.name} profile` : 'View agent profile', "aria-expanded": agentProfileTrayOpen, children: [selectedAgentAvatarUrl
+                            ? _jsx(AgentAvatarImage, { src: selectedAgentAvatarUrl, fallbackSize: 16 })
+                            : _jsx(Bot, { size: 16 }), isSelectedAgentAvatarSyncing ? _jsx(Loader2, { size: 12, className: `${styles.spinner} ${styles.taskforceAgentAvatarSyncIcon}` }) : null] }), _jsx("label", { className: styles.taskforceAgentDrawerAgentPicker, children: _jsx("select", { className: styles.select, value: selectedAgentId || '', onChange: (event) => {
+                            const nextAgent = agents.find((agent) => agent.id === event.target.value);
+                            if (nextAgent)
+                                requestAgentNavigation({ type: 'agent', agent: nextAgent });
+                        }, disabled: !rememberedSelectionReady || loadingAgents || agents.length === 0 || testing, "aria-label": "Agent", children: agents.length > 0 ? (agents.map((agent) => (_jsx("option", { value: agent.id, children: agent.name }, agent.id)))) : (_jsx("option", { value: "", children: "No agents configured" })) }) })] }));
+        return () => onRenderDrawerHeader(null);
+    }, [
+        agents,
+        agentProfileTrayOpen,
+        isSelectedAgentAvatarSyncing,
+        loadingAgents,
+        onRenderDrawerHeader,
+        requestAgentNavigation,
+        selectedAgent,
+        selectedAgentAvatarUrl,
+        selectedAgentId,
+        surface,
+        testing,
+    ]);
+    useEffect(() => {
+        if (!taskLaunchContext)
+            return;
+        appendLog('info', `Task context attached: ${taskLaunchContext.taskReference}.`);
+    }, [appendLog, taskLaunchContext]);
+    useEffect(() => {
+        conversationEndRef.current?.scrollIntoView?.({ block: 'end' });
+    }, [conversationMessages.length, loadingConversation, testing]);
+    const buildCurrentDraftDefinition = useCallback(() => (buildTaskforceAgentDefinitionFromDraft({
+        baseDefinition: selectedAgent?.definition,
+        draft: definitionDraft,
+        name: agentName.trim() || DEFAULT_AGENT_NAME,
+        providerKey,
+        modelKey,
+        tier: selectedModel?.defaultTier || modelTier,
+    })), [
+        agentName,
+        definitionDraft,
+        modelKey,
+        modelTier,
+        providerKey,
+        selectedAgent?.definition,
+        selectedModel?.defaultTier,
+    ]);
+    const handleSaveAgent = async () => {
+        const nextAgentName = agentName.trim();
+        const nextPurpose = definitionDraft.purpose.trim();
+        if (!nextAgentName || !nextPurpose || !modelKey || savingAgent)
+            return;
+        const isNewAgent = !selectedAgentId;
+        const definition = buildCurrentDraftDefinition();
+        setSavingAgent(true);
+        setConfigFeedback(null);
+        try {
+            const url = selectedAgentId
+                ? `/api/taskforce/agents/${encodeURIComponent(selectedAgentId)}`
+                : '/api/taskforce/agents';
+            const res = await fetch(url, {
+                method: selectedAgentId ? 'PATCH' : 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                credentials: 'include',
+                body: JSON.stringify({
+                    workspaceId,
+                    definition,
+                    lifecycleStatus: selectedAgent?.lifecycleStatus
+                        || (selectedAgent?.enabled === false ? 'disabled' : 'active'),
+                    ...(selectedAgentId ? {
+                        expectedDefinitionHash: selectedAgent?.definitionHash,
+                    } : {}),
+                    ...(signatureColorDirty && signatureColor ? { signatureColor } : {}),
+                    ...(signatureColorReset ? { resetSignatureColor: true } : {}),
+                }),
+            });
+            const payload = await res.json().catch(() => ({}));
+            if (!res.ok || payload?.success === false || !payload?.agent) {
+                const message = payload?.code === 'TASKFORCE_AGENT_DEFINITION_CONFLICT'
+                    ? 'This Agent changed after you opened it. Your draft is preserved; reload the Agent before saving again.'
+                    : String(payload?.error || 'Unable to save agent.');
+                appendLog('error', message);
+                setConfigFeedback({ type: 'error', message });
+                return;
+            }
+            const savedAgent = payload.agent;
+            configurationDraftDirtyRef.current = false;
+            setAgents((current) => {
+                const exists = current.some((agent) => agent.id === savedAgent.id);
+                return exists
+                    ? current.map((agent) => agent.id === savedAgent.id ? savedAgent : agent)
+                    : [savedAgent, ...current];
+            });
+            if (isNewAgent) {
+                selectAgent(savedAgent);
+            }
+            else {
+                setAgentName(savedAgent.name);
+                setModelProvider('taskforce_hq');
+                setProviderKey(normalizeTaskforceAgentProviderKey(savedAgent.providerKey));
+                setModelKey(normalizeTaskforceAgentModelKey(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 });
+            dispatchTaskforceAgentsMutated({
+                workspaceId,
+                agentId: savedAgent.id,
+                reason: 'agent-save',
+            });
+            if (savedAgent.profileId) {
+                dispatchTaskforceAiProfilesMutated({
+                    workspaceId,
+                    profileId: savedAgent.profileId,
+                    reason: 'update',
+                    origin: 'taskforce-agents-module',
+                });
+            }
+            if (isNewAgent && !getAgentAvatarUrl(savedAgent)) {
+                void generateAvatarForAgent(savedAgent);
+            }
+        }
+        catch (err) {
+            const message = String(err?.message || err || 'Unable to save agent.');
+            appendLog('error', message);
+            setConfigFeedback({ type: 'error', message });
+        }
+        finally {
+            setSavingAgent(false);
+        }
+    };
+    async function generateAvatarForAgent(targetAgent) {
+        const targetAgentId = targetAgent.id;
+        if (!targetAgentId || generatingAvatarAgentIds.has(targetAgentId))
+            return false;
+        if (!canUseCloudAvatarGeneration) {
+            const message = authSessionResolved
+                ? 'Sign in to Taskforce Cloud to generate agent avatars.'
+                : 'Cloud sign-in is still loading. Try again in a moment.';
+            setAvatarGenerationFeedbackByAgentId((current) => ({
+                ...current,
+                [targetAgentId]: { error: message, notice: null },
+            }));
+            return false;
+        }
+        setGeneratingAvatarAgentIds((current) => new Set(current).add(targetAgentId));
+        setAgentAvatarError(null);
+        setAgentAvatarNotice(null);
+        setAvatarGenerationFeedbackByAgentId((current) => ({
+            ...current,
+            [targetAgentId]: { error: null, notice: null },
+        }));
+        try {
+            const avatarGenerationPath = `/api/taskforce/agents/${encodeURIComponent(targetAgentId)}/avatar/generate`;
+            const avatarGenerationUrl = shouldUseCloudAvatarGeneration && resolveCloudAuthUrl
+                ? resolveCloudAuthUrl(avatarGenerationPath)
+                : avatarGenerationPath;
+            const res = await fetch(avatarGenerationUrl, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                credentials: 'include',
+                body: JSON.stringify({ workspaceId }),
+            });
+            const responseText = typeof res.clone === 'function'
+                ? await res.clone().text().catch(() => '')
+                : '';
+            const payload = await res.json().catch(() => ({}));
+            if (!res.ok || payload?.success === false || !payload?.agent) {
+                const fallback = res.status
+                    ? `Unable to generate agent avatar. HTTP ${res.status}.`
+                    : 'Unable to generate agent avatar.';
+                const details = payload?.details && typeof payload.details === 'object'
+                    ? payload.details
+                    : null;
+                const diagnosticParts = [
+                    typeof details?.modelId === 'string' && details.modelId ? `model ${details.modelId}` : '',
+                    typeof details?.region === 'string' && details.region ? `region ${details.region}` : '',
+                ].filter(Boolean);
+                const diagnosticSuffix = diagnosticParts.length ? ` Tried ${diagnosticParts.join(' in ')}.` : '';
+                const responseError = isHtmlResponse(responseText)
+                    ? `${fallback} Please try again.`
+                    : compactResponseText(responseText);
+                const message = `${String(payload?.error || responseError || fallback)}${diagnosticSuffix}`;
+                setAvatarGenerationFeedbackByAgentId((current) => ({
+                    ...current,
+                    [targetAgentId]: { error: message, notice: null },
+                }));
+                return false;
+            }
+            const generatedAgent = payload.agent;
+            const generatedProfileId = typeof payload?.avatar?.profileId === 'string'
+                ? payload.avatar.profileId.trim()
+                : '';
+            const cloudResolvedAgent = shouldUseCloudAvatarGeneration && resolveCloudAuthUrl ? {
+                ...generatedAgent,
+                avatarUrl: generatedAgent.avatarUrl
+                    ? resolveCloudAssetDisplayUrl(generatedAgent.avatarUrl)
+                    : generatedAgent.avatarUrl,
+                avatarSourceUrl: generatedAgent.avatarSourceUrl
+                    ? resolveCloudAssetDisplayUrl(generatedAgent.avatarSourceUrl)
+                    : generatedAgent.avatarSourceUrl,
+            } : generatedAgent;
+            const updatedAgent = {
+                ...cloudResolvedAgent,
+                profileId: cloudResolvedAgent.profileId || generatedProfileId || targetAgent.profileId || null,
+            };
+            setAgents((current) => current.map((agent) => agent.id === updatedAgent.id ? {
+                ...agent,
+                ...updatedAgent,
+                profileId: updatedAgent.profileId || agent.profileId || null,
+            } : agent));
+            if (shouldUseCloudAvatarGeneration) {
+                const generatedRevision = normalizedAvatarRevision(updatedAgent.avatarRevision)
+                    ?? normalizedAvatarRevision(payload?.avatar?.avatarRevision)
+                    ?? 0;
+                pendingCloudAvatarRevisionByAgentIdRef.current.set(updatedAgent.id, generatedRevision);
+                setAvatarSyncingAgentIds((current) => new Set(current).add(updatedAgent.id));
+                setAvatarGenerationFeedbackByAgentId((current) => ({
+                    ...current,
+                    [targetAgentId]: {
+                        error: null,
+                        notice: `Generated photo for ${updatedAgent.name} was saved in Taskforce Cloud. The local copy will be retained when sync runs.`,
+                    },
+                }));
+            }
+            else {
+                setAvatarGenerationFeedbackByAgentId((current) => ({
+                    ...current,
+                    [targetAgentId]: { error: null, notice: `Generated photo for ${updatedAgent.name} was saved.` },
+                }));
+            }
+            dispatchTaskforceAgentsMutated({
+                workspaceId,
+                agentId: updatedAgent.id,
+                reason: 'agent-avatar-generate',
+            });
+            dispatchTaskforceAiProfilesMutated({
+                workspaceId,
+                profileId: typeof payload?.avatar?.profileId === 'string' ? payload.avatar.profileId : null,
+                reason: 'avatar',
+                origin: 'taskforce-agents-module',
+            });
+            return true;
+        }
+        catch (err) {
+            const message = String(err?.message || err || 'Unable to generate agent avatar.');
+            setAvatarGenerationFeedbackByAgentId((current) => ({
+                ...current,
+                [targetAgentId]: { error: message, notice: null },
+            }));
+            return false;
+        }
+        finally {
+            setGeneratingAvatarAgentIds((current) => {
+                const next = new Set(current);
+                next.delete(targetAgentId);
+                return next;
+            });
+        }
+    }
+    const handleGenerateAvatar = async () => {
+        if (!selectedAgentId || !selectedAgent)
+            return false;
+        if (hasUnsavedAvatarPresentation(selectedAgent.definition, definitionDraft)) {
+            setAgentAvatarError('Save the avatar description and art style before generating.');
+            setAgentAvatarNotice(null);
+            return false;
+        }
+        return generateAvatarForAgent(selectedAgent);
+    };
+    const applyAgentAvatarProfileUpdate = (updatedProfile) => {
+        const profileId = String(updatedProfile?.id || '').trim();
+        if (!profileId)
+            return;
+        setAgents((current) => current.map((agent) => agent.profileId === profileId ? {
+            ...agent,
+            avatarUrl: typeof updatedProfile.avatarUrl === 'string' ? updatedProfile.avatarUrl : null,
+            avatarSourceUrl: typeof updatedProfile.avatarSourceUrl === 'string' ? updatedProfile.avatarSourceUrl : null,
+            avatarRevision: Number.isFinite(Number(updatedProfile.avatarRevision))
+                ? Math.max(0, Math.floor(Number(updatedProfile.avatarRevision)))
+                : agent.avatarRevision,
+            avatarUpdatedAt: typeof updatedProfile.avatarUpdatedAt === 'string'
+                ? updatedProfile.avatarUpdatedAt
+                : agent.avatarUpdatedAt,
+        } : agent));
+    };
+    const handleAgentAvatarSelected = async (file, sourceFile, options) => {
+        const profileId = String(selectedAgent?.profileId || '').trim();
+        if (!selectedAgentId || !profileId) {
+            setAgentAvatarError('Save the agent before editing its profile photo.');
+            return false;
+        }
+        if (!file.type.startsWith('image/')) {
+            setAgentAvatarError('Agent profile photo must be an image file.');
+            return false;
+        }
+        setAgentAvatarBusy(true);
+        setAgentAvatarError(null);
+        setAgentAvatarNotice(null);
+        setAvatarGenerationFeedbackByAgentId((current) => {
+            const next = { ...current };
+            delete next[selectedAgentId];
+            return next;
+        });
+        const shouldMutateCloudProfile = shouldUseCloudAvatarGeneration
+            && avatarSyncingAgentIds.has(selectedAgentId)
+            && Boolean(resolveCloudAuthUrl);
+        try {
+            const preparedAvatar = await prepareAvatarUploadFile(file, { maxBytes: 5 * 1024 * 1024 });
+            if (preparedAvatar.exceededLimit) {
+                throw new Error(file.type === 'image/gif'
+                    ? 'Animated GIF agent photos must be 5 MB or smaller.'
+                    : 'Agent profile photo must be 5 MB or smaller.');
+            }
+            let preparedSourceFile = null;
+            if (sourceFile) {
+                const preparedSource = await prepareAvatarUploadFile(sourceFile, { maxBytes: 5 * 1024 * 1024 });
+                if (preparedSource.exceededLimit) {
+                    throw new Error(sourceFile.type === 'image/gif'
+                        ? 'Animated GIF agent source photos must be 5 MB or smaller.'
+                        : 'Agent profile source photo must be 5 MB or smaller.');
+                }
+                preparedSourceFile = preparedSource.file;
+            }
+            const displayFile = preparedAvatar.file;
+            const displayDataUrl = await fileToDataUrl(displayFile);
+            const sourceDataUrl = preparedSourceFile ? await fileToDataUrl(preparedSourceFile) : null;
+            const payload = {
+                profileId,
+                preserveExistingSource: options?.preserveExistingSource === true,
+                displayImage: {
+                    dataUrl: displayDataUrl,
+                    mimeType: displayFile.type || 'application/octet-stream',
+                    originalName: displayFile.name || 'display-avatar',
+                },
+            };
+            if (preparedSourceFile && sourceDataUrl) {
+                payload.sourceImage = {
+                    dataUrl: sourceDataUrl,
+                    mimeType: preparedSourceFile.type || 'application/octet-stream',
+                    originalName: preparedSourceFile.name || 'source-avatar',
+                };
+            }
+            const uploadPath = '/api/taskforce/workspace/ai-profiles/avatar/upload';
+            const uploadUrl = shouldMutateCloudProfile && resolveCloudAuthUrl
+                ? withTaskforceCloudHint(resolveCloudAuthUrl(uploadPath))
+                : uploadPath;
+            const res = await fetch(uploadUrl, {
+                method: 'POST',
+                credentials: 'include',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify(payload),
+            });
+            const data = await res.json().catch(() => ({}));
+            if (!res.ok || !data?.profile) {
+                throw new Error(String(data?.error || 'Failed to update agent profile photo.'));
+            }
+            const updatedProfile = shouldMutateCloudProfile && resolveCloudAuthUrl ? {
+                ...data.profile,
+                avatarUrl: data.profile.avatarUrl ? resolveCloudAuthUrl(data.profile.avatarUrl) : data.profile.avatarUrl,
+                avatarSourceUrl: data.profile.avatarSourceUrl ? resolveCloudAuthUrl(data.profile.avatarSourceUrl) : data.profile.avatarSourceUrl,
+            } : data.profile;
+            applyAgentAvatarProfileUpdate(updatedProfile);
+            const uploadedRevision = normalizedAvatarRevision(updatedProfile.avatarRevision);
+            if (shouldMutateCloudProfile && uploadedRevision !== null) {
+                pendingCloudAvatarRevisionByAgentIdRef.current.set(selectedAgentId, uploadedRevision);
+            }
+            if (!shouldMutateCloudProfile) {
+                dispatchTaskforceAgentsMutated({ workspaceId, agentId: selectedAgentId, reason: 'agent-avatar-upload' });
+                dispatchTaskforceAiProfilesMutated({ workspaceId, profileId, reason: 'avatar', origin: 'taskforce-agents-module' });
+            }
+            return true;
+        }
+        catch (error) {
+            setAgentAvatarError(String(error?.message || 'Failed to update agent profile photo.'));
+            return false;
+        }
+        finally {
+            setAgentAvatarBusy(false);
+        }
+    };
+    const handleAgentAvatarRemove = async () => {
+        const profileId = String(selectedAgent?.profileId || '').trim();
+        if (!selectedAgentId || !profileId)
+            return;
+        setAgentAvatarBusy(true);
+        setAgentAvatarError(null);
+        setAgentAvatarNotice(null);
+        setAvatarGenerationFeedbackByAgentId((current) => {
+            const next = { ...current };
+            delete next[selectedAgentId];
+            return next;
+        });
+        const shouldMutateCloudProfile = shouldUseCloudAvatarGeneration
+            && avatarSyncingAgentIds.has(selectedAgentId)
+            && Boolean(resolveCloudAuthUrl);
+        try {
+            const removePath = '/api/taskforce/workspace/ai-profiles/avatar';
+            const removeUrl = shouldMutateCloudProfile && resolveCloudAuthUrl
+                ? withTaskforceCloudHint(resolveCloudAuthUrl(removePath))
+                : removePath;
+            const res = await fetch(removeUrl, {
+                method: 'POST',
+                credentials: 'include',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ profileId, avatarUrl: null, avatarSourceUrl: null }),
+            });
+            const data = await res.json().catch(() => ({}));
+            if (!res.ok || !data?.profile) {
+                throw new Error(String(data?.error || 'Failed to remove agent profile photo.'));
+            }
+            applyAgentAvatarProfileUpdate(data.profile);
+            const removedRevision = normalizedAvatarRevision(data.profile.avatarRevision);
+            if (shouldMutateCloudProfile && removedRevision !== null) {
+                pendingCloudAvatarRevisionByAgentIdRef.current.set(selectedAgentId, removedRevision);
+            }
+            setAgentAvatarNotice(shouldMutateCloudProfile
+                ? 'Agent profile photo removed in Taskforce Cloud. The local copy will be retained when sync runs.'
+                : 'Agent profile photo removed.');
+            if (!shouldMutateCloudProfile) {
+                dispatchTaskforceAgentsMutated({ workspaceId, agentId: selectedAgentId, reason: 'agent-avatar-remove' });
+                dispatchTaskforceAiProfilesMutated({ workspaceId, profileId, reason: 'avatar', origin: 'taskforce-agents-module' });
+            }
+        }
+        catch (error) {
+            setAgentAvatarError(String(error?.message || 'Failed to remove agent profile photo.'));
+        }
+        finally {
+            setAgentAvatarBusy(false);
+        }
+    };
+    const handleNewAgentDraft = () => requestAgentNavigation({ type: 'new' });
+    const handleProviderChange = (nextProviderKeyRaw) => {
+        configurationDraftDirtyRef.current = true;
+        const nextProviderKey = normalizeTaskforceAgentProviderKey(nextProviderKeyRaw);
+        const nextModels = modelsForTaskforceAgentProvider(nextProviderKey);
+        setProviderKey(nextProviderKey);
+        setModelKey(nextModels[0]?.key || '');
+        setModelTier(nextModels[0]?.defaultTier || 'balanced');
+    };
+    const handleModelChange = (nextModelKeyRaw) => {
+        configurationDraftDirtyRef.current = true;
+        const nextModelKey = normalizeTaskforceAgentModelKey(nextModelKeyRaw, providerKey);
+        const nextModel = modelOptions.find((model) => model.key === nextModelKey);
+        setModelKey(nextModelKey);
+        if (nextModel)
+            setModelTier(nextModel.defaultTier);
+    };
+    const handleCancelConversationRename = () => {
+        if (savingConversationTitle)
+            return;
+        conversationRenameRunIdRef.current += 1;
+        setRenamingConversation(false);
+        setConversationTitleDraft('');
+        setConversationRenameError('');
+    };
+    const handleBeginConversationRename = () => {
+        if (!selectedAgentId || !conversationId || !selectedConversationSummary)
+            return;
+        conversationRenameRunIdRef.current += 1;
+        setConversationTitleDraft(selectedConversationSummary.title || 'Agent chat');
+        setConversationRenameError('');
+        setRenamingConversation(true);
+    };
+    const handleRenameConversation = async (event) => {
+        event.preventDefault();
+        const title = conversationTitleDraft.trim();
+        if (!selectedAgentId || !conversationId || savingConversationTitle)
+            return;
+        if (!title) {
+            setConversationRenameError('Chat name is required.');
+            return;
+        }
+        if (title === selectedConversationSummary?.title) {
+            handleCancelConversationRename();
+            return;
+        }
+        const targetAgentId = selectedAgentId;
+        const targetConversationId = conversationId;
+        const renameRunId = ++conversationRenameRunIdRef.current;
+        setSavingConversationTitle(true);
+        setConversationRenameError('');
+        try {
+            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(targetAgentId)}/conversations/${encodeURIComponent(targetConversationId)}`, {
+                method: 'PATCH',
+                headers: { 'Content-Type': 'application/json' },
+                credentials: 'include',
+                body: JSON.stringify({ workspaceId, title }),
+            });
+            const payload = await res.json().catch(() => ({}));
+            if (conversationRenameRunIdRef.current !== renameRunId
+                || selectedAgentIdRef.current !== targetAgentId)
+                return;
+            if (!res.ok || payload?.success === false || !payload?.conversation) {
+                setConversationRenameError(String(payload?.error || 'Unable to rename chat.'));
+                return;
+            }
+            upsertConversationSummary(payload.conversation);
+            setRenamingConversation(false);
+            setConversationTitleDraft('');
+            dispatchTaskforceAgentsMutated({
+                workspaceId,
+                agentId: targetAgentId,
+                conversationId: targetConversationId,
+                reason: 'conversation-update',
+            });
+        }
+        catch (error) {
+            if (conversationRenameRunIdRef.current !== renameRunId
+                || selectedAgentIdRef.current !== targetAgentId)
+                return;
+            setConversationRenameError(String(error?.message || error || 'Unable to rename chat.'));
+        }
+        finally {
+            if (conversationRenameRunIdRef.current === renameRunId) {
+                setSavingConversationTitle(false);
+            }
+        }
+    };
+    const handleNewConversation = async () => {
+        if (!selectedAgentId) {
+            setPrompt('');
+            setConversationMessages([]);
+            setResult(null);
+            setToolActivity([]);
+            setConversationId(null);
+            appendLog('info', 'Started a new unsaved chat.');
+            return;
+        }
+        setLoadingConversation(true);
+        setToolActivity([]);
+        try {
+            const res = await fetch(`/api/taskforce/agents/${encodeURIComponent(selectedAgentId)}/conversation/new`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                credentials: 'include',
+                body: JSON.stringify({
+                    workspaceId,
+                    ...(taskLaunchContext ? {
+                        taskId: taskLaunchContext.taskId,
+                        taskReference: taskLaunchContext.taskReference,
+                        taskTitle: taskLaunchContext.taskTitle,
+                    } : {}),
+                }),
+            });
+            const payload = await res.json().catch(() => ({}));
+            if (!res.ok || payload?.success === false) {
+                appendLog('error', String(payload?.error || 'Unable to start a new chat.'));
+                return;
+            }
+            setPrompt('');
+            const nextConversation = payload?.conversation || null;
+            applyConversation(nextConversation);
+            rememberSelection(selectedAgentId, nextConversation?.id || null);
+            if (nextConversation)
+                upsertConversationSummary(nextConversation);
+            dispatchTaskforceAgentsMutated({
+                workspaceId,
+                agentId: selectedAgentId,
+                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.'));
+        }
+        finally {
+            setLoadingConversation(false);
+        }
+    };
+    const handleDraftTest = async () => {
+        const nextPrompt = draftTestPrompt.trim();
+        const nextAgentName = agentName.trim() || DEFAULT_AGENT_NAME;
+        if (!nextPrompt || !definitionDraft.purpose.trim() || !modelKey || testingDraft)
+            return;
+        const draftDefinition = buildCurrentDraftDefinition();
+        if (!canUseCloudAgentRuntime) {
+            setDraftTestError(authSessionResolved
+                ? 'Sign in to Taskforce Cloud to test this agent.'
+                : 'Cloud sign-in is still loading. Try again in a moment.');
+            return;
+        }
+        setTestingDraft(true);
+        const runId = ++draftTestRunIdRef.current;
+        setDraftTestResult(null);
+        setDraftTestSnapshot(null);
+        setDraftTestToolActivity([]);
+        setDraftTestError('');
+        try {
+            const res = await fetch('/api/taskforce/agents/model-gateway/test', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                credentials: 'include',
+                body: JSON.stringify({
+                    workspaceId,
+                    agentName: nextAgentName,
+                    providerKey,
+                    modelKey,
+                    prompt: nextPrompt,
+                    messages: [{ role: 'user', content: nextPrompt }],
+                    draftDefinition,
+                }),
+            });
+            const payload = await res.json().catch(() => ({}));
+            if (draftTestRunIdRef.current !== runId)
+                return;
+            if (!res.ok || payload?.success === false) {
+                setDraftTestError(String(payload?.error || 'Agent test failed.'));
+                return;
+            }
+            setDraftTestResult(payload?.result || null);
+            setDraftTestSnapshot({
+                agentName: nextAgentName,
+                providerKey,
+                modelKey,
+                prompt: nextPrompt,
+                definition: draftDefinition,
+            });
+            const mcpToolCalls = Array.isArray(payload?.mcpToolCalls)
+                ? payload.mcpToolCalls
+                : [];
+            setDraftTestToolActivity(mcpToolCalls.reduce((activity, toolCall, index) => {
+                const toolName = String(toolCall?.name || '').trim();
+                if (!toolName)
+                    return activity;
+                activity.push({
+                    id: `draft-${index}-${toolName}`,
+                    name: toolName,
+                    arguments: toolCall.arguments,
+                    resultText: toolCall.text,
+                    ok: toolCall.ok !== false,
+                });
+                return activity;
+            }, []));
+        }
+        catch (error) {
+            if (draftTestRunIdRef.current !== runId)
+                return;
+            setDraftTestError(String(error?.message || error || 'Agent test failed.'));
+        }
+        finally {
+            if (draftTestRunIdRef.current === runId)
+                setTestingDraft(false);
+        }
+    };
+    const handleTestModelGateway = async () => {
+        const nextPrompt = prompt.trim();
+        const nextSystemPrompt = systemPrompt.trim();
+        const nextAgentName = agentName.trim() || DEFAULT_AGENT_NAME;
+        if (!nextPrompt || !modelKey || testing || loadingConversation)
+            return;
+        if (!canUseCloudAgentRuntime) {
+            const message = authSessionResolved
+                ? 'Sign in to Taskforce Cloud to chat with Taskforce agents.'
+                : 'Cloud sign-in is still loading. Try again in a moment.';
+            setPromptStatus(message);
+            appendLog('error', message);
+            return;
+        }
+        setTesting(true);
+        setResult(null);
+        setPromptStatus('');
+        const startedAt = Date.now();
+        const nextMessages = [
+            ...conversationMessages,
+            { role: 'user', content: nextPrompt },
+        ];
+        setConversationMessages(nextMessages);
+        setPrompt('');
+        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(() => ({}));
+            if (!res.ok || payload?.success === false) {
+                const message = String(payload?.error || 'Model gateway test failed.');
+                setPromptStatus(message);
+                appendLog('error', message);
+                return;
+            }
+            const nextResult = payload?.result || null;
+            setResult(nextResult);
+            const mcpToolCalls = Array.isArray(payload?.mcpToolCalls)
+                ? payload.mcpToolCalls
+                : [];
+            const nextToolActivity = mcpToolCalls.reduce((activity, toolCall, index) => {
+                const toolName = String(toolCall?.name || '').trim();
+                if (!toolName)
+                    return activity;
+                activity.push({
+                    id: `${startedAt}-${index}-${toolName}`,
+                    name: toolName,
+                    arguments: toolCall.arguments,
+                    resultText: toolCall.text,
+                    ok: toolCall.ok !== false,
+                });
+                return activity;
+            }, []);
+            setToolActivity(nextToolActivity);
+            if (nextToolActivity.length > 0) {
+                const hasToolError = nextToolActivity.some((toolCall) => !toolCall.ok);
+                appendLog(hasToolError ? 'error' : 'success', formatToolActivityLogMessage(nextToolActivity), nextToolActivity);
+            }
+            const workflowCompletion = payload?.workflowCompletion;
+            let installedWorkflowTask = workflowCompletion?.taskSnapshot || null;
+            if (workflowCompletion?.executionId && workflowCompletion.assignmentSnapshot) {
+                installedWorkflowTask = await applyCloudWorkflowCompletionProjection(workflowCompletion, { workspaceId, runtimeMode });
+            }
+            if (mcpToolCalls.length > 0) {
+                nextToolActivity.forEach((toolCall) => {
+                    if ((toolCall.name === 'add_comment'
+                        || toolCall.name === 'add_task_checklist_item'
+                        || toolCall.name === 'replace_task_checklist'
+                        || toolCall.name === 'complete_workflow_step') && toolCall.ok) {
+                        dispatchTaskforceTasksMutated({
+                            workspaceId,
+                            taskId: (toolCall.name === 'complete_workflow_step'
+                                ? workflowCompletion?.taskId
+                                : null)
+                                || activeTaskContext?.taskId
+                                || String(toolCall.arguments?.taskId || toolCall.arguments?.id || '').trim()
+                                || null,
+                            reason: toolCall.name === 'add_comment'
+                                ? 'agent-comment'
+                                : toolCall.name === 'complete_workflow_step'
+                                    ? 'workflow-step'
+                                    : 'agent-checklist',
+                            ...(toolCall.name === 'complete_workflow_step' && installedWorkflowTask
+                                ? { authoritativeTask: installedWorkflowTask }
+                                : {}),
+                        });
+                    }
+                });
+            }
+            if (payload?.conversation) {
+                applyConversation(payload.conversation);
+                rememberSelection(selectedAgentId, payload.conversation.id || conversationId || null);
+                upsertConversationSummary(payload.conversation);
+                dispatchTaskforceAgentsMutated({
+                    workspaceId,
+                    agentId: selectedAgentId,
+                    conversationId: payload.conversation.id || conversationId,
+                    reason: 'conversation-update',
+                });
+            }
+            else {
+                setConversationMessages(nextResult?.text
+                    ? [...nextMessages, {
+                            role: 'assistant',
+                            content: String(nextResult.text),
+                            agentId: selectedAgentId || undefined,
+                            agentName: nextAgentName,
+                            providerKey,
+                            providerLabel: labelForTaskforceAgentProvider(providerKey),
+                            modelKey,
+                            modelLabel: labelForTaskforceAgentModel(modelKey),
+                            modelId: String(nextResult.modelId || ''),
+                            ...(nextToolActivity.length > 0 ? {
+                                toolActivity: nextToolActivity.map(({ id: _id, ...toolCall }) => toolCall),
+                            } : {}),
+                        }]
+                    : nextMessages);
+            }
+            appendLog('success', `Model gateway completed successfully in ${nextResult?.latencyMs ?? Date.now() - startedAt} ms.`);
+        }
+        catch (err) {
+            const message = String(err?.message || err || 'Model gateway test failed.');
+            setPromptStatus(message);
+            appendLog('error', message);
+        }
+        finally {
+            setTesting(false);
+        }
+    };
+    const handlePromptKeyDown = (event) => {
+        if (event.key !== 'Enter' || event.shiftKey || event.nativeEvent.isComposing)
+            return;
+        event.preventDefault();
+        void handleTestModelGateway();
+    };
+    const handleConversationSelect = (nextConversationId) => {
+        if (!selectedAgentId || !nextConversationId || nextConversationId === conversationId)
+            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 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.' }
+        : activeBuilderTab === 'roles'
+            ? { icon: _jsx(BriefcaseBusiness, { size: 14 }), title: 'Role Library', empty: 'No roles configured yet.' }
+            : activeBuilderTab === 'skills'
+                ? { icon: _jsx(Sparkles, { size: 14 }), title: 'Skill Library', empty: 'Browse and manage Skills in the editor.' }
+                : activeBuilderTab === 'connections'
+                    ? { icon: _jsx(Plug, { size: 14 }), title: 'Connection Library', empty: 'Connections are not available yet.' }
+                    : { 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) => {
+                            let nextIndex = index;
+                            if (event.key === 'ArrowRight')
+                                nextIndex = (index + 1) % AGENT_BUILDER_TABS.length;
+                            else if (event.key === 'ArrowLeft')
+                                nextIndex = (index - 1 + AGENT_BUILDER_TABS.length) % AGENT_BUILDER_TABS.length;
+                            else if (event.key === 'Home')
+                                nextIndex = 0;
+                            else if (event.key === 'End')
+                                nextIndex = AGENT_BUILDER_TABS.length - 1;
+                            else
+                                return;
+                            event.preventDefault();
+                            const nextTab = AGENT_BUILDER_TABS[nextIndex];
+                            setActiveBuilderTab(nextTab.id);
+                            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 avatarUrl = getAgentAvatarUrl(agent);
+                        const color = agent.color || assignedAiProfileColor(agent.id);
+                        return (_jsx(AiIdentityRosterCard, { name: agent.name, username: agent.username, subtitle: "Taskforce Agent", avatar: avatarUrl
+                                ? _jsx(AgentAvatarImage, { src: avatarUrl, fallbackSize: 22 })
+                                : _jsx(Bot, { size: 22 }), avatarStyle: { color }, selected: agent.id === selectedAgentId, disabled: !rememberedSelectionReady, onSelect: () => requestAgentNavigation({ type: 'agent', agent }), ariaLabel: `Edit ${agent.name}`, bottomUtility: _jsx("span", { className: styles.aiProfileGroupSignatureSwatch, style: { backgroundColor: color }, title: `Signature color ${color}`, "aria-hidden": "true" }) }, agent.id));
+                    }) })) : (_jsx("p", { className: styles.taskforceAgentListEmpty, children: activeLibrary.empty })) })] }));
+    if (surface === 'taskDrawer') {
+        return (_jsxs("div", { className: styles.taskforceAgentDrawerSurface, children: [activeTaskContext ? (_jsxs("div", { className: styles.taskforceAgentContextBanner, children: [_jsxs("div", { children: [_jsx("span", { children: "Context" }), _jsx("strong", { children: activeTaskContextLabel })] }), _jsxs("div", { className: styles.taskforceAgentContextActions, children: [onOpenTaskContext ? (_jsx("button", { type: "button", className: "tf-control-icon tf-control-icon-compact", onClick: () => onOpenTaskContext(activeTaskContext.taskId), title: "Open task", "aria-label": "Open task", children: _jsx(ExternalLink, { size: 13 }) })) : null, onClearLaunchContext && canClearActiveTaskContext ? (_jsx("button", { type: "button", className: "tf-control-icon tf-control-icon-compact", onClick: onClearLaunchContext, title: "Clear task context", "aria-label": "Clear task context", children: _jsx(X, { size: 13 }) })) : null] })] })) : null, agentProfileTrayOpen && selectedAgent ? (_jsxs("section", { className: styles.taskforceAgentProfileTray, "aria-label": `${selectedAgent.name} profile`, children: [_jsxs("div", { className: styles.taskforceAgentProfileTrayHeader, children: [_jsxs("span", { className: `${styles.taskforceAgentAvatarPreview} ${isSelectedAgentAvatarSyncing ? styles.taskforceAgentAvatarSyncing : ''}`.trim(), "aria-hidden": "true", children: [selectedAgentAvatarUrl
+                                            ? _jsx(AgentAvatarImage, { src: selectedAgentAvatarUrl, fallbackSize: 18 })
+                                            : _jsx(Bot, { size: 18 }), isSelectedAgentAvatarSyncing ? _jsx(Loader2, { size: 13, className: `${styles.spinner} ${styles.taskforceAgentAvatarSyncIcon}` }) : null] }), _jsxs("div", { className: styles.taskforceAgentProfileTrayIdentity, children: [_jsx("span", { children: "Agent profile" }), _jsx("strong", { children: selectedAgent.name }), _jsxs("small", { children: [labelForTaskforceAgentProvider(selectedAgent.providerKey), " \u00B7 ", formatModelTier(selectedAgent.modelTier)] })] }), _jsx("button", { type: "button", className: "tf-control-icon tf-control-icon-compact", onClick: () => setAgentProfileTrayOpen(false), title: "Close agent profile", "aria-label": "Close agent profile", children: _jsx(X, { size: 13 }) })] }), _jsxs("dl", { className: styles.taskforceAgentProfileTrayDetails, children: [_jsxs("div", { children: [_jsx("dt", { children: "Platform" }), _jsx("dd", { children: formatAgentProvider(selectedAgent.modelProvider) })] }), _jsxs("div", { children: [_jsx("dt", { children: "Provider" }), _jsx("dd", { children: labelForTaskforceAgentProvider(selectedAgent.providerKey) })] }), _jsxs("div", { children: [_jsx("dt", { children: "Model" }), _jsx("dd", { children: labelForTaskforceAgentModel(selectedAgent.modelKey) })] }), _jsxs("div", { children: [_jsx("dt", { children: "Default tier" }), _jsx("dd", { children: formatModelTier(selectedAgent.modelTier) })] })] })] })) : null, _jsxs("div", { className: styles.taskforceAgentDrawerControls, children: [!onRenderDrawerHeader ? (_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Agent" }), _jsx("select", { className: styles.select, value: selectedAgentId || '', onChange: (event) => {
+                                        const nextAgent = agents.find((agent) => agent.id === event.target.value);
+                                        if (nextAgent)
+                                            requestAgentNavigation({ type: 'agent', agent: nextAgent });
+                                    }, disabled: !rememberedSelectionReady || loadingAgents || agents.length === 0 || testing, children: agents.length > 0 ? (agents.map((agent) => (_jsxs("option", { value: agent.id, children: [agent.name, " \u00B7 ", labelForTaskforceAgentModel(agent.modelKey)] }, agent.id)))) : (_jsx("option", { value: "", children: "No agents configured" })) })] })) : null, renamingConversation ? (_jsxs("form", { className: styles.taskforceAgentConversationRename, onSubmit: handleRenameConversation, children: [_jsx("input", { className: styles.input, "aria-label": "Chat name", value: conversationTitleDraft, onChange: (event) => {
+                                        setConversationTitleDraft(event.target.value);
+                                        if (conversationRenameError)
+                                            setConversationRenameError('');
+                                    }, onKeyDown: (event) => {
+                                        if (event.key !== 'Escape')
+                                            return;
+                                        event.preventDefault();
+                                        handleCancelConversationRename();
+                                    }, maxLength: 120, autoFocus: true, disabled: savingConversationTitle }), _jsx("button", { type: "submit", className: "tf-control-icon", "aria-label": "Save chat name", title: "Save chat name", disabled: savingConversationTitle || !conversationTitleDraft.trim(), children: savingConversationTitle ? _jsx(Loader2, { size: 14, className: styles.spinner }) : _jsx(Save, { size: 14 }) }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: handleCancelConversationRename, "aria-label": "Cancel renaming", title: "Cancel", disabled: savingConversationTitle, children: _jsx(X, { size: 14 }) }), conversationRenameError ? (_jsx("div", { className: styles.taskforceAgentConversationRenameError, role: "alert", children: conversationRenameError })) : null] })) : (_jsxs("div", { className: styles.taskforceAgentDrawerChatControls, children: [selectedAgentId ? (_jsx("select", { className: `${styles.select} ${styles.taskforceAgentConversationSelect}`.trim(), "aria-label": "Saved chats", value: conversationId || '', onChange: (event) => handleConversationSelect(event.target.value), disabled: testing || loadingConversation || loadingConversationList || conversationSummaries.length === 0, children: conversationSummaries.length > 0 ? (_jsxs(_Fragment, { children: [!conversationId ? _jsx("option", { value: "", children: "Select chat" }) : null, conversationSummaries.map((conversation) => (_jsx("option", { value: conversation.id, children: formatConversationOption(conversation, taskLaunchContext) }, conversation.id)))] })) : (_jsx("option", { value: "", children: "No chats" })) })) : null, _jsx("button", { type: "button", className: "tf-control-icon", onClick: handleBeginConversationRename, disabled: testing || loadingConversation || !selectedConversationSummary, "aria-label": "Rename chat", title: "Rename chat", children: _jsx(Pencil, { size: 14 }) }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: () => { void handleNewConversation(); }, disabled: testing || loadingConversation || !selectedAgentId, "aria-label": "New chat", title: "New chat", children: _jsx(Plus, { size: 14 }) })] }))] }), _jsxs("div", { className: `${styles.taskforceAgentConversationList} ${styles.taskforceAgentDrawerConversationList} tf-scrollbar`, children: [loadingConversation ? (_jsx("div", { className: styles.taskforceAgentConversationEmpty, children: "Loading saved conversation..." })) : conversationMessages.length > 0 ? (conversationMessages.map((message, index) => (_jsxs("div", { "data-conversation-role": message.role, style: message.role === 'assistant' && conversationAgentColor
+                                ? { '--conversation-accent': conversationAgentColor }
+                                : undefined, className: `${styles.taskforceAgentConversationMessage} ${message.role === 'user' ? styles.taskforceAgentConversationMessageUser : styles.taskforceAgentConversationMessageAssistant}`.trim(), children: [_jsx("span", { children: formatConversationRole(message, conversationAgentLabel) }), _jsx(Markdown, { variant: "conversation", className: styles.taskforceAgentConversationBody, taskReferences: taskReferences, children: message.content }), message.role === 'assistant' && message.toolActivity?.length
+                                    ? renderToolActivityDetails(message.toolActivity.map((toolCall, toolIndex) => ({
+                                        ...toolCall,
+                                        id: `${index}-${toolIndex}-${toolCall.name}`,
+                                    })), 'Taskforce actions')
+                                    : null] }, `${message.role}-${index}`)))) : !testing ? (_jsx("div", { className: styles.taskforceAgentConversationEmpty, children: selectedAgentId ? 'No conversation yet.' : 'Select an agent to start chatting.' })) : null, testing && !loadingConversation ? (_jsxs("div", { "data-conversation-role": "assistant", style: conversationAgentColor
+                                ? { '--conversation-accent': conversationAgentColor }
+                                : undefined, className: `${styles.taskforceAgentConversationMessage} ${styles.taskforceAgentConversationMessageAssistant}`.trim(), children: [_jsx("span", { children: agentName.trim() || DEFAULT_AGENT_NAME }), _jsx("p", { children: "Waiting for model response..." })] })) : null, _jsx("div", { ref: conversationEndRef, "aria-hidden": "true" })] }), _jsxs("div", { className: styles.taskforceAgentDrawerPrompt, children: [_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Message" }), _jsx("textarea", { className: styles.input, value: prompt, onChange: (event) => {
+                                        setPrompt(event.target.value);
+                                        if (promptStatus)
+                                            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: () => {
+                                                                        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
+                                                                    ? ` ${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) => {
+                                                                        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: () => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setSignatureColor(assignedAiProfileColor(selectedAgent.id));
+                                                                        setSignatureColorDirty(false);
+                                                                        setSignatureColorReset(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) => {
+                                                                        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) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            personalitySelection: event.target.value,
+                                                                            personalityCustom: event.target.value === CUSTOM_PRESET_VALUE
+                                                                                ? current.personalityCustom
+                                                                                : '',
+                                                                        }));
+                                                                    }, children: [_jsx("option", { value: "", children: "No preset" }), PERSONALITY_PRESETS.map((preset) => (_jsx("option", { value: preset.key, children: preset.label }, preset.key))), _jsx("option", { value: CUSTOM_PRESET_VALUE, children: "Custom" })] })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Response Style" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "How should answers be written and structured?" }), _jsxs("select", { className: styles.select, "aria-label": "Response Style", value: definitionDraft.responseStyleSelection, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            responseStyleSelection: event.target.value,
+                                                                            responseStyleCustom: event.target.value === CUSTOM_PRESET_VALUE
+                                                                                ? current.responseStyleCustom
+                                                                                : '',
+                                                                        }));
+                                                                    }, children: [_jsx("option", { value: "", children: "No preset" }), RESPONSE_STYLE_PRESETS.map((preset) => (_jsx("option", { value: preset.key, children: preset.label }, preset.key))), _jsx("option", { value: CUSTOM_PRESET_VALUE, children: "Custom" })] })] }), definitionDraft.personalitySelection === CUSTOM_PRESET_VALUE ? (_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Custom Personality and Voice" }), _jsx("textarea", { className: styles.input, "aria-label": "Custom Personality and Voice", value: definitionDraft.personalityCustom, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            personalityCustom: event.target.value,
+                                                                        }));
+                                                                    }, maxLength: 4000, rows: 3 })] })) : null, definitionDraft.responseStyleSelection === CUSTOM_PRESET_VALUE ? (_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Custom Response Style" }), _jsx("textarea", { className: styles.input, "aria-label": "Custom Response Style", value: definitionDraft.responseStyleCustom, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            responseStyleCustom: event.target.value,
+                                                                        }));
+                                                                    }, maxLength: 4000, rows: 3 })] })) : null, _jsxs("label", { className: `${styles.field} ${styles.taskforceAgentBehaviorWide}`, children: [_jsx("span", { className: styles.label, children: "Working Guidelines" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "How should this agent approach tasks, decisions, and constraints?" }), _jsx("textarea", { className: styles.input, "aria-label": "Working Guidelines", style: { minHeight: 108, resize: 'vertical' }, value: systemPrompt, onChange: (event) => setSystemPrompt(event.target.value), maxLength: 8000 })] })] }), _jsxs("div", { className: styles.taskforceAgentPresentationGroup, children: [_jsxs("div", { children: [_jsx("span", { className: styles.label, children: "Avatar Generation Direction" }), _jsx("small", { className: styles.taskforceAgentFieldHelper, children: "Saved for manual avatar generation only. These details are excluded from normal Agent context." })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Avatar Visual Description" }), _jsx("textarea", { className: styles.input, "aria-label": "Avatar Visual Description", value: definitionDraft.avatarVisualDescription, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            avatarVisualDescription: event.target.value,
+                                                                        }));
+                                                                    }, maxLength: 4000, rows: 3, placeholder: "Describe what this agent or character looks like." })] }), _jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Avatar Art Style" }), _jsxs("select", { className: styles.select, "aria-label": "Avatar Art Style", value: definitionDraft.avatarArtStyleSelection, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...current,
+                                                                            avatarArtStyleSelection: event.target.value,
+                                                                            avatarArtStyleCustom: event.target.value === CUSTOM_PRESET_VALUE
+                                                                                ? current.avatarArtStyleCustom
+                                                                                : '',
+                                                                        }));
+                                                                    }, children: [_jsx("option", { value: "", children: DEFAULT_AVATAR_ART_STYLE_LABEL }), AVATAR_ART_STYLE_PRESETS.map((preset) => (_jsx("option", { value: preset.key, children: preset.label }, preset.key))), _jsx("option", { value: CUSTOM_PRESET_VALUE, children: "Custom" })] })] }), definitionDraft.avatarArtStyleSelection === CUSTOM_PRESET_VALUE ? (_jsxs("label", { className: styles.field, children: [_jsx("span", { className: styles.label, children: "Custom Avatar Art Style" }), _jsx("textarea", { className: styles.input, "aria-label": "Custom Avatar Art Style", value: definitionDraft.avatarArtStyleCustom, onChange: (event) => {
+                                                                        configurationDraftDirtyRef.current = true;
+                                                                        setDefinitionDraft((current) => ({
+                                                                            ...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'
+                                    ? (_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: () => {
+                            if (agentAvatarBusy)
+                                return;
+                            setAvatarEditorOpen(false);
+                            setAgentAvatarError(null);
+                            setAgentAvatarNotice(null);
+                        }, onApplyImage: handleAgentAvatarSelected, onGenerateImage: selectedAgentId && !generatingAvatarAgentIds.has(selectedAgentId)
+                            ? handleGenerateAvatar
+                            : undefined, onRemoveImage: handleAgentAvatarRemove }, selectedAgentId || 'agent-avatar-draft')] })] }));
+}