@taskforcehq/taskforce 0.3.328 → 0.3.330

package/dist/components/features/TaskSettings.js

@@ -8,6 +8,7 @@ import { MCP_CLIENT_OPTIONS, buildCloudMcpClientIntegration, buildLocalMcpClient
 import { resolveTaskforceMcpBaseUrlFromBaseUrl } from '../../config/cloudEnvironment';
 import { TaxonomyManager } from './settings/TaxonomyManager';
 import { normalizeTaskforceApplicationBaseUrl } from '../../shared/taskDeepLinks.js';
+import { TaskCard } from '../task/TaskCard';
 const THEME_ICON_MAP = {
     sun: Sun,
     wind: Wind,
@@ -15,19 +16,39 @@ const THEME_ICON_MAP = {
     sparkles: Sparkles,
 };
 const DEFAULT_MCP_TOKEN_SCOPES = ['tasks:read', 'tasks:write', 'workspace:read'];
+const DEFAULT_MCP_TOOL_PROFILE_OPTIONS = [
+    { id: 'default', label: 'Standard', toolCount: 58 },
+    { id: 'extended', label: 'All cloud tools', toolCount: 85 },
+];
 const MCP_CONFIG_CODE_COLORS = {
     key: '#93c5fd',
     token: '#c084fc',
     punctuation: '#cbd5e1',
     text: '#f8fafc'
 };
+const TASK_CARD_PREVIEW_INITIATIVE = {
+    id: 'task-card-settings-preview-initiative',
+    referenceNumber: 29,
+    referenceLabel: 'IN-29',
+    title: 'Task Experience',
+    description: null,
+    createdAt: '2026-08-14T12:00:00.000Z',
+};
+const TASK_CARD_PREVIEW_WORKSTREAM = {
+    id: 'task-card-settings-preview-workstream',
+    referenceNumber: 749,
+    referenceLabel: 'WS-749',
+    initiativeId: TASK_CARD_PREVIEW_INITIATIVE.id,
+    title: 'Task Card Polish',
+    description: null,
+    createdAt: '2026-08-14T12:00:00.000Z',
+};
 export function TaskSettings(props) {
     const { settingsModel, onSectionChange, renderMode = 'full' } = props;
     const isMcpOnly = renderMode === 'mcp-only';
-    const { currentTheme, globalTheme, themeUseGlobalDefault, keyShortcut, jsonBackupEnabled, globalJsonBackupEnabled, globalWeekStartsOn, locale = 'en-US', supportedLocales = ['en-US', 'es-419', 'pt-BR'], jsonBackupUseGlobalDefault, manualComplexityEnabled, checklistDropdownEnabled = true, showTaskCardStatusLabel = false, initialSection, onThemeChange, onSaveTheme, onSaveGlobalTheme, onResetProjectToGlobal, onKeyShortcutChange, onJsonBackupEnabledChange, onSaveGlobalJsonBackupEnabled, onSaveGlobalWeekStartsOn, onSaveLocale, onManualComplexityEnabledChange, onChecklistDropdownEnabledChange, onShowTaskCardStatusLabelChange, onSaveSettings, onShowFolderBrowserChange, onBrowserTargetChange, onFetchFolders, categories, pathValidation, taxonomyDisplayLabels, onUpdateCategory, onRemoveCategory, onSaveCategory, onAddPath, onRemovePath, onUpdateCategoryIcon, onUpdateCategoryColor, types, onSaveType, onRemoveType, onUpdateType, taxonomies, onUpdateTaxonomies, priorities, onUpdatePriorities, onAnalyzeSystemTaxonomyPack, onApplySystemTaxonomyPack, onUpdateTaxonomyDisplayLabels, projectRoot, projectName, mcpHostRoot, serverHostRoot, mcpScriptPath, tenantId, workspaceId, runtimeMode = 'local', cloudAuthBaseUrl = '', cloudMcpBaseUrl = '', fetchCloudAuthApi, checkLocalMcpCliHealth, getLocalUpdateStatus, workspaceSwitchingEnabled = false, currentWorkspaceRole = 'member', currentWorkspaceName = '', onDeleteWorkspace, onMcpHostRootChange, onOpenCloudAuth, isAuthenticated = false, setupState = null, buildInfo = null, onSaveSetupMode, onSaveWorkspaceProfile, initiativeTemplates = [], onRefreshInitiativeTemplates, onCreateInitiativeFromTemplate } = settingsModel;
+    const { currentTheme, globalTheme, themeUseGlobalDefault, keyShortcut, jsonBackupEnabled, globalJsonBackupEnabled, globalWeekStartsOn, locale = 'en-US', supportedLocales = ['en-US', 'es-419', 'pt-BR'], jsonBackupUseGlobalDefault, manualComplexityEnabled, checklistDropdownEnabled = true, showTaskCardStatusLabel = false, showTaskCardDescription = true, showTaskCardAttachments = true, showTaskCardChecklistProgress = true, showTaskCardLatestActivity = true, tintTaskCardActivityBackground = false, initialSection, onThemeChange, onSaveTheme, onSaveGlobalTheme, onUseGlobalThemeDefault, onKeyShortcutChange, onJsonBackupEnabledChange, onSaveGlobalJsonBackupEnabled, onUseGlobalJsonBackupDefault, onSaveGlobalWeekStartsOn, onSaveLocale, onManualComplexityEnabledChange, onChecklistDropdownEnabledChange, onShowTaskCardStatusLabelChange, onShowTaskCardDescriptionChange, onShowTaskCardAttachmentsChange, onShowTaskCardChecklistProgressChange, onShowTaskCardLatestActivityChange, onTintTaskCardActivityBackgroundChange, onSaveSettings, onShowFolderBrowserChange, onBrowserTargetChange, onFetchFolders, categories, pathValidation, taxonomyDisplayLabels, onUpdateCategory, onRemoveCategory, onSaveCategory, onAddPath, onRemovePath, onUpdateCategoryIcon, onUpdateCategoryColor, types, onSaveType, onRemoveType, onUpdateType, taxonomies, onUpdateTaxonomies, priorities, onUpdatePriorities, onAnalyzeSystemTaxonomyPack, onApplySystemTaxonomyPack, onUpdateTaxonomyDisplayLabels, projectRoot, projectName, mcpHostRoot, serverHostRoot, mcpScriptPath, tenantId, workspaceId, runtimeMode = 'local', cloudAuthBaseUrl = '', cloudMcpBaseUrl = '', fetchCloudAuthApi, checkLocalMcpCliHealth, getLocalUpdateStatus, workspaceSwitchingEnabled = false, currentWorkspaceRole = 'member', currentWorkspaceName = '', onDeleteWorkspace, onMcpHostRootChange, onOpenCloudAuth, isAuthenticated = false, setupState = null, buildInfo = null, onSaveSetupMode, onSaveWorkspaceProfile, initiativeTemplates = [], onRefreshInitiativeTemplates, onCreateInitiativeFromTemplate } = settingsModel;
     const showJsonBackupSettings = runtimeMode !== 'cloud';
     const [settingsFeedback, setSettingsFeedback] = useState(null);
-    const [setupMode, setSetupMode] = useState(() => setupState?.mode === 'operations' ? 'operations' : 'core');
     const [workspaceDisplayName, setWorkspaceDisplayName] = useState(() => String(setupState?.workspace?.name || '').trim());
     const [workspaceDescription, setWorkspaceDescription] = useState(() => String(setupState?.workspace?.description || ''));
     const [selectedInitiativeTemplateId, setSelectedInitiativeTemplateId] = useState('');
@@ -38,6 +59,53 @@ export function TaskSettings(props) {
     const [generalScopeTab, setGeneralScopeTab] = useState(() => {
         return 'project';
     });
+    const taskCardPreviewTask = useMemo(() => ({
+        id: 'task-card-settings-preview',
+        referenceNumber: 1590,
+        referenceLabel: 'T-1590',
+        title: 'Polish Task card appearance',
+        description: 'Make card preferences easy to understand at a glance.',
+        category: categories.find((option) => !option.disabled)?.value || 'general',
+        type: types[0]?.value || 'feature',
+        priority: priorities.find((option) => Number(option.value) === 2)?.value ?? priorities[0]?.value ?? 2,
+        complexity: 3,
+        status: 'in-progress',
+        workstreamId: TASK_CARD_PREVIEW_WORKSTREAM.id,
+        createdAt: '2026-08-14T12:00:00.000Z',
+        attachments: [{
+                path: '/task-card-preview.md',
+                displayName: 'task-card-style-guide.md',
+                originalFilename: 'task-card-style-guide.md',
+                linkRole: 'attachment',
+            }],
+        commentCount: 2,
+        checklistCount: 3,
+        completedChecklistCount: 1,
+        latestActivity: {
+            id: 'task-card-settings-preview-activity',
+            type: 'event',
+            timestamp: '2026-08-14T12:30:00.000Z',
+            event: {
+                action: 'task-status-changed',
+                actor: 'Cardsmith',
+                actorType: 'ai',
+                actorProfile: {
+                    id: 'task-card-settings-preview-actor',
+                    kind: 'ai',
+                    label: 'Cardsmith',
+                    username: 'cardsmith',
+                    icon: 'Bot',
+                    color: 'violet-500',
+                    isNamed: true,
+                },
+                details: {
+                    changes: {
+                        status: { from: 'task', to: 'in-progress' },
+                    },
+                },
+            },
+        },
+    }), [categories, priorities, types]);
     useEffect(() => {
         if (initiativeTemplates.length > 0 && !selectedInitiativeTemplateId) {
             setSelectedInitiativeTemplateId(initiativeTemplates[0].id);
@@ -49,13 +117,31 @@ export function TaskSettings(props) {
         const timer = setTimeout(() => setSettingsFeedback(null), 2500);
         return () => clearTimeout(timer);
     }, [settingsFeedback]);
-    useEffect(() => {
-        setSetupMode(setupState?.mode === 'operations' ? 'operations' : 'core');
-    }, [setupState?.mode]);
+    const reportTaskCardPreferenceResult = (success, errorMessage) => {
+        setSettingsFeedback(success ? null : { type: 'error', message: errorMessage });
+    };
     useEffect(() => {
         setWorkspaceDisplayName(String(setupState?.workspace?.name || '').trim());
         setWorkspaceDescription(String(setupState?.workspace?.description || ''));
     }, [setupState?.workspace?.name, setupState?.workspace?.description]);
+    const resolvedWorkspaceId = String(workspaceId || setupState?.workspaceId || setupState?.workspace?.id || '').trim();
+    const handleCopyWorkspaceId = async () => {
+        if (!resolvedWorkspaceId) {
+            setSettingsFeedback({ type: 'error', message: 'Workspace ID is unavailable.' });
+            return;
+        }
+        if (!navigator.clipboard?.writeText) {
+            setSettingsFeedback({ type: 'error', message: 'Clipboard copy is unavailable in this browser.' });
+            return;
+        }
+        try {
+            await navigator.clipboard.writeText(resolvedWorkspaceId);
+            setSettingsFeedback({ type: 'success', message: 'Workspace ID copied.' });
+        }
+        catch {
+            setSettingsFeedback({ type: 'error', message: 'Failed to copy workspace ID.' });
+        }
+    };
     const handleThemeChange = async (theme) => {
         onThemeChange(theme);
         const success = await onSaveTheme(theme);
@@ -86,33 +172,42 @@ export function TaskSettings(props) {
     const [mcpTokensLoading, setMcpTokensLoading] = useState(false);
     const [mcpTokensError, setMcpTokensError] = useState(null);
     const [mcpActionBusyId, setMcpActionBusyId] = useState(null);
+    const [selectedMcpClient, setSelectedMcpClient] = useState('general');
+    const selectedMcpClientLabel = useMemo(() => {
+        const label = MCP_CLIENT_OPTIONS.find((option) => option.id === selectedMcpClient)?.label || 'General';
+        return selectedMcpClient === 'general' ? 'General MCP' : label;
+    }, [selectedMcpClient]);
     const defaultTokenName = useMemo(() => {
-        const label = String(currentWorkspaceName
+        const workspaceLabel = String(currentWorkspaceName
             || setupState?.workspace?.name
             || projectName
             || workspaceId
-            || 'Taskforce Workspace').trim();
-        return `${label} MCP`;
-    }, [currentWorkspaceName, setupState?.workspace?.name, projectName, workspaceId]);
+            || 'Taskforce Workspace').trim() || 'Taskforce Workspace';
+        return `${selectedMcpClientLabel} — ${workspaceLabel}`;
+    }, [currentWorkspaceName, setupState?.workspace?.name, projectName, selectedMcpClientLabel, workspaceId]);
     const [newTokenName, setNewTokenName] = useState(defaultTokenName);
+    const [tokenNameCustomized, setTokenNameCustomized] = useState(false);
     const [newTokenExpiresAt, setNewTokenExpiresAt] = useState('');
     const [mcpTokenIssueNotice, setMcpTokenIssueNotice] = useState(null);
     const [mcpConfigNotice, setMcpConfigNotice] = useState(null);
     const [mcpTokenListNotice, setMcpTokenListNotice] = useState(null);
     const [generatedTokenValue, setGeneratedTokenValue] = useState(null);
-    const [selectedMcpClient, setSelectedMcpClient] = useState('general');
     const [mcpConnectionBusy, setMcpConnectionBusy] = useState(false);
     const [mcpConnectionResult, setMcpConnectionResult] = useState(null);
     const [mcpConnectorGrants, setMcpConnectorGrants] = useState([]);
     const [mcpConnectorsLoading, setMcpConnectorsLoading] = useState(false);
     const [mcpConnectorsError, setMcpConnectorsError] = useState(null);
     const [mcpConnectorBusyId, setMcpConnectorBusyId] = useState(null);
+    const [mcpToolProfileOptions, setMcpToolProfileOptions] = useState(DEFAULT_MCP_TOOL_PROFILE_OPTIONS);
+    const [mcpProfileNotice, setMcpProfileNotice] = useState(null);
+    const canManageMcpToolProfiles = currentWorkspaceRole === 'owner' || currentWorkspaceRole === 'admin';
     useEffect(() => {
         setSelectedMcpMode(defaultMcpMode);
     }, [defaultMcpMode]);
     useEffect(() => {
-        setNewTokenName((current) => current.trim().length > 0 ? current : defaultTokenName);
-    }, [defaultTokenName]);
+        if (!tokenNameCustomized)
+            setNewTokenName(defaultTokenName);
+    }, [defaultTokenName, tokenNameCustomized]);
     useEffect(() => {
         if (!mcpTokenIssueNotice)
             return;
@@ -508,6 +603,8 @@ export function TaskSettings(props) {
                 return;
             }
             setMcpTokens(Array.isArray(payload?.items) ? payload.items : []);
+            if (Array.isArray(payload?.profileOptions))
+                setMcpToolProfileOptions(payload.profileOptions);
         }
         catch {
             setMcpTokensError('Failed to load MCP tokens.');
@@ -532,6 +629,8 @@ export function TaskSettings(props) {
                 return;
             }
             setMcpConnectorGrants(Array.isArray(payload?.items) ? payload.items : []);
+            if (Array.isArray(payload?.profileOptions))
+                setMcpToolProfileOptions(payload.profileOptions);
         }
         catch {
             setMcpConnectorsError('Failed to load MCP connectors.');
@@ -567,7 +666,7 @@ export function TaskSettings(props) {
             }
             setGeneratedTokenValue(String(payload?.token || ''));
             setMcpConnectionResult(null);
-            setNewTokenName(defaultTokenName);
+            setTokenNameCustomized(false);
             setNewTokenExpiresAt('');
             setMcpTokens((current) => {
                 const next = payload?.record ? [payload.record, ...current.filter((item) => item.id !== payload.record.id)] : current;
@@ -701,6 +800,8 @@ export function TaskSettings(props) {
                 workspaceName: typeof result?.workspaceName === 'string' ? String(result.workspaceName) : '',
                 workspaceId: typeof result?.workspaceId === 'string' ? String(result.workspaceId) : '',
                 endpoint: typeof result?.endpoint === 'string' ? String(result.endpoint) : cloudMcpEndpoint,
+                toolProfile: result?.toolProfile === 'extended' ? 'extended' : 'default',
+                toolCount: Number.isFinite(result?.toolCount) ? Number(result.toolCount) : undefined,
             });
         }
         catch {
@@ -743,6 +844,40 @@ export function TaskSettings(props) {
             setMcpConnectorBusyId(null);
         }
     };
+    const handleMcpToolProfileChange = async (kind, id, toolProfile) => {
+        const busyId = `profile:${kind}:${id}`;
+        setMcpActionBusyId(busyId);
+        setMcpConnectorBusyId(busyId);
+        setMcpProfileNotice(null);
+        try {
+            const res = await fetchCloudAuthApi(`/api/taskforce/settings/mcp/${kind}/${encodeURIComponent(id)}/tool-profile`, {
+                method: 'PATCH',
+                credentials: 'include',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ toolProfile }),
+            });
+            const payload = await res.json().catch(() => ({}));
+            if (!res.ok) {
+                setMcpProfileNotice({ type: 'error', message: String(payload?.error || 'Failed to change MCP tool access.') });
+                return;
+            }
+            const record = payload?.record;
+            if (kind === 'tokens') {
+                setMcpTokens((current) => current.map((item) => item.id === record?.id ? record : item));
+            }
+            else {
+                setMcpConnectorGrants((current) => current.map((item) => item.id === record?.id ? record : item));
+            }
+            setMcpProfileNotice({ type: 'success', message: 'Tool access updated. Restart or reconnect the client, then refresh its MCP tools. In ChatGPT, refresh actions, review additions, enable the intended actions, and publish.' });
+        }
+        catch {
+            setMcpProfileNotice({ type: 'error', message: 'Failed to change MCP tool access.' });
+        }
+        finally {
+            setMcpActionBusyId(null);
+            setMcpConnectorBusyId(null);
+        }
+    };
     useEffect(() => {
         if (!canUseCloudMcp)
             return;
@@ -831,7 +966,13 @@ export function TaskSettings(props) {
         setActiveTab(tab);
         onSectionChange?.(section);
     };
-    const renderProjectThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme" }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, currentTheme, handleThemeChange)) })] }));
+    const renderProjectThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme" }), !themeUseGlobalDefault && (_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: async () => {
+                            const success = await onUseGlobalThemeDefault();
+                            setSettingsFeedback({
+                                type: success ? 'success' : 'error',
+                                message: success ? 'Using global theme default.' : 'Failed to use global theme default.'
+                            });
+                        }, children: "Use global theme" }))] }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, currentTheme, handleThemeChange)) })] }));
     const renderGlobalThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme Defaults" }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, globalTheme, async (theme) => {
                     const success = await onSaveGlobalTheme(theme);
                     setSettingsFeedback({
@@ -848,30 +989,27 @@ export function TaskSettings(props) {
                                 message: success ? 'Checklist dropdown setting saved.' : 'Failed to save checklist dropdown setting.'
                             });
                         }, disabled: !onChecklistDropdownEnabledChange }), _jsx("span", { children: "Enable checklist dropdown in task form" })] })] }));
-    return (_jsx("div", { className: `${styles.settingsTab} ${isMcpOnly ? styles.settingsTabMcpOnly : ''}`.trim(), children: _jsxs("div", { className: `${styles.settingsLayout} ${isMcpOnly ? styles.settingsLayoutMcpOnly : ''}`.trim(), children: [!isMcpOnly && (_jsxs("aside", { className: styles.settingsSidebar, children: [_jsx("div", { className: styles.settingsSidebarHeader, children: "Sections" }), _jsxs("div", { className: `${styles.settingsSidebarNav} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [settingsNavItems.filter((item) => item.key === 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key))), _jsxs("div", { className: styles.settingsSidebarGroup, children: [_jsxs("button", { className: `${styles.settingsSidebarBtn} ${styles.settingsSidebarGroupBtn} ${(activeTab === 'appearanceApplication' || activeTab === 'appearanceTaskCards' || activeTab === 'appearanceTaskForms') ? styles.settingsSidebarBtnActive : ''}`, onClick: () => setAppearanceExpanded((current) => !current), "aria-expanded": appearanceExpanded, "aria-controls": "settings-appearance-nav", children: [_jsx(Sparkles, { size: 14 }), _jsx("span", { className: styles.settingsSidebarGroupLabel, children: "Appearance" }), _jsx("span", { className: styles.settingsSidebarGroupChevron, children: appearanceExpanded ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 }) })] }), appearanceExpanded && (_jsx("div", { id: "settings-appearance-nav", className: styles.settingsSidebarSubnav, children: appearanceNavItems.map((item) => (_jsx("button", { className: `${styles.settingsSidebarSubBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: _jsx("span", { children: item.label }) }, item.key))) }))] }), settingsNavItems.filter((item) => item.key !== 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key)))] })] })), _jsxs("div", { className: styles.settingsContent, children: [settingsFeedback && (_jsxs("div", { className: `${styles.settingsToast} ${settingsFeedback.type === 'success' ? styles.settingsToastSuccess : styles.settingsToastError}`, children: [settingsFeedback.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: settingsFeedback.message })] })), activeTab === 'general' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }), generalScopeTab === 'project' && (_jsx("div", { className: styles.pathInputGroup, style: { justifyContent: 'flex-end' }, children: _jsx("button", { onClick: async () => {
-                                                    const confirmed = window.confirm('Reset project Theme and Backups to global defaults?');
-                                                    if (!confirmed)
-                                                        return;
-                                                    const success = await onResetProjectToGlobal();
-                                                    setSettingsFeedback({
-                                                        type: success ? 'success' : 'error',
-                                                        message: success ? 'Project settings reset to global.' : 'Failed to reset project settings.'
-                                                    });
-                                                }, className: styles.copyBtn, children: "Reset to Global" }) }))] }), generalScopeTab === 'project' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.pathInputGroup, children: [_jsxs("label", { className: styles.label, style: { minWidth: '110px' }, children: [setupMode === 'operations' ? 'Mission' : 'Project', " name:"] }), _jsx("input", { className: styles.input, type: "text", value: workspaceDisplayName, onChange: (event) => setWorkspaceDisplayName(event.target.value), placeholder: setupMode === 'operations' ? 'Mission name' : 'Project name' })] }), _jsxs("div", { className: styles.pathInputGroup, children: [_jsx("label", { className: styles.label, style: { minWidth: '110px' }, children: "Description:" }), _jsx("textarea", { className: styles.textarea, value: workspaceDescription, onChange: (event) => setWorkspaceDescription(event.target.value), placeholder: setupMode === 'operations' ? 'Mission description (optional)' : 'Project description (optional)', rows: 3 })] }), _jsx("div", { className: styles.pathInputGroup, style: { justifyContent: 'flex-end' }, children: _jsx("button", { onClick: async () => {
-                                                    if (!onSaveWorkspaceProfile)
-                                                        return;
-                                                    const result = await onSaveWorkspaceProfile({
-                                                        workspaceId: setupState?.workspaceId,
-                                                        name: workspaceDisplayName,
-                                                        description: workspaceDescription
-                                                    });
-                                                    setSettingsFeedback({
-                                                        type: result.success ? 'success' : 'error',
-                                                        message: result.success
-                                                            ? `${setupMode === 'operations' ? 'Mission' : 'Project'} profile saved.`
-                                                            : (result.error || 'Failed to save workspace profile.')
-                                                    });
-                                                }, className: styles.copyBtn, disabled: !onSaveWorkspaceProfile, children: "Save" }) })] })), generalScopeTab === 'project' && (_jsx("div", { className: styles.settingGroup, children: showJsonBackupSettings && (_jsxs(_Fragment, { children: [_jsx("h3", { className: styles.settingTitle, children: "Backup" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: jsonBackupEnabled, onChange: async (e) => {
+    return (_jsx("div", { className: `${styles.settingsTab} ${isMcpOnly ? styles.settingsTabMcpOnly : ''}`.trim(), children: _jsxs("div", { className: `${styles.settingsLayout} ${isMcpOnly ? styles.settingsLayoutMcpOnly : ''}`.trim(), children: [!isMcpOnly && (_jsxs("aside", { className: styles.settingsSidebar, children: [_jsx("div", { className: styles.settingsSidebarHeader, children: "Sections" }), _jsxs("div", { className: `${styles.settingsSidebarNav} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [settingsNavItems.filter((item) => item.key === 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key))), _jsxs("div", { className: styles.settingsSidebarGroup, children: [_jsxs("button", { className: `${styles.settingsSidebarBtn} ${styles.settingsSidebarGroupBtn} ${(activeTab === 'appearanceApplication' || activeTab === 'appearanceTaskCards' || activeTab === 'appearanceTaskForms') ? styles.settingsSidebarBtnActive : ''}`, onClick: () => setAppearanceExpanded((current) => !current), "aria-expanded": appearanceExpanded, "aria-controls": "settings-appearance-nav", children: [_jsx(Sparkles, { size: 14 }), _jsx("span", { className: styles.settingsSidebarGroupLabel, children: "Appearance" }), _jsx("span", { className: styles.settingsSidebarGroupChevron, children: appearanceExpanded ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 }) })] }), appearanceExpanded && (_jsx("div", { id: "settings-appearance-nav", className: styles.settingsSidebarSubnav, children: appearanceNavItems.map((item) => (_jsx("button", { className: `${styles.settingsSidebarSubBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: _jsx("span", { children: item.label }) }, item.key))) }))] }), settingsNavItems.filter((item) => item.key !== 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key)))] })] })), _jsxs("div", { className: styles.settingsContent, children: [settingsFeedback && (_jsxs("div", { className: `${styles.settingsToast} ${settingsFeedback.type === 'success' ? styles.settingsToastSuccess : styles.settingsToastError}`, role: settingsFeedback.type === 'success' ? 'status' : 'alert', "aria-live": settingsFeedback.type === 'success' ? 'polite' : 'assertive', children: [settingsFeedback.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: settingsFeedback.message })] })), activeTab === 'general' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.workspaceIdentity, children: [_jsx("span", { className: styles.label, children: "Workspace ID:" }), _jsxs("div", { className: styles.workspaceIdentityValueRow, children: [_jsx("code", { className: styles.workspaceIdentityValue, children: resolvedWorkspaceId || 'Unavailable' }), _jsx("button", { type: "button", className: "tf-control-icon tf-control-icon-compact", onClick: () => { void handleCopyWorkspaceId(); }, disabled: !resolvedWorkspaceId, "aria-label": "Copy workspace ID", title: "Copy workspace ID", children: _jsx(Copy, { size: 14, "aria-hidden": "true" }) })] })] }), _jsxs("div", { className: styles.workspaceProfileForm, children: [_jsx("label", { htmlFor: "workspace-name", className: styles.label, children: "Workspace name:" }), _jsx("input", { id: "workspace-name", className: styles.input, type: "text", value: workspaceDisplayName, onChange: (event) => setWorkspaceDisplayName(event.target.value), placeholder: "Workspace name" }), _jsx("label", { htmlFor: "workspace-description", className: `${styles.label} ${styles.workspaceProfileTextareaLabel}`, children: "Description:" }), _jsx("textarea", { id: "workspace-description", className: styles.textarea, value: workspaceDescription, onChange: (event) => setWorkspaceDescription(event.target.value), placeholder: "Describe this workspace (optional)", rows: 3 }), _jsx("div", { className: styles.workspaceProfileActions, children: _jsx("button", { type: "button", onClick: async () => {
+                                                            if (!onSaveWorkspaceProfile)
+                                                                return;
+                                                            const result = await onSaveWorkspaceProfile({
+                                                                workspaceId: setupState?.workspaceId,
+                                                                name: workspaceDisplayName,
+                                                                description: workspaceDescription
+                                                            });
+                                                            setSettingsFeedback({
+                                                                type: result.success ? 'success' : 'error',
+                                                                message: result.success
+                                                                    ? 'Workspace profile saved.'
+                                                                    : (result.error || 'Failed to save workspace profile.')
+                                                            });
+                                                        }, className: "tf-button-primary tf-button-compact", disabled: !onSaveWorkspaceProfile, children: "Save" }) })] })] })), generalScopeTab === 'project' && (_jsx("div", { className: styles.settingGroup, children: showJsonBackupSettings && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Backup" }), !jsonBackupUseGlobalDefault && (_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: async () => {
+                                                            const success = await onUseGlobalJsonBackupDefault();
+                                                            setSettingsFeedback({
+                                                                type: success ? 'success' : 'error',
+                                                                message: success ? 'Using global backup default.' : 'Failed to use global backup default.'
+                                                            });
+                                                        }, children: "Use global backup" }))] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: jsonBackupEnabled, onChange: async (e) => {
                                                             const success = await onJsonBackupEnabledChange(e.target.checked);
                                                             setSettingsFeedback({
                                                                 type: success ? 'success' : 'error',
@@ -907,7 +1045,7 @@ export function TaskSettings(props) {
                                                                     type: success ? 'success' : 'error',
                                                                     message: success ? 'Global shortcut saved.' : 'Failed to save global shortcut.'
                                                                 });
-                                                            }, className: `${styles.saveSettingsBtn} ${styles.saveSettingsBtnWrapper}`, children: "Save" })] }), _jsxs("p", { className: styles.settingHelper, children: ["Supported modifiers: Alt, Option, Ctrl, Shift, Meta (Cmd). Example: ", _jsx("code", { children: "Alt+T" }), " or ", _jsx("code", { children: "Ctrl+Shift+L" }), "."] })] })] })), generalScopeTab === 'project' && runtimeMode === 'cloud' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Danger Zone" }), !workspaceSwitchingEnabled ? (_jsx("p", { className: styles.settingHelper, children: "Workspace deletion is available in cloud runtime only." })) : !isAuthenticated ? (_jsx("p", { className: styles.settingHelper, children: "Sign in to manage workspace deletion." })) : currentWorkspaceRole !== 'owner' ? (_jsx("p", { className: styles.settingHelper, children: "Only workspace owners can delete a workspace." })) : (_jsx("div", { className: styles.pathInputGroup, children: _jsxs("button", { className: styles.destructiveBtn, onClick: async () => {
+                                                            }, className: `${styles.saveSettingsBtn} ${styles.saveSettingsBtnWrapper}`, children: "Save" })] }), _jsxs("p", { className: styles.settingHelper, children: ["Supported modifiers: Alt, Option, Ctrl, Shift, Meta (Cmd). Example: ", _jsx("code", { children: "Alt+T" }), " or ", _jsx("code", { children: "Ctrl+Shift+L" }), "."] })] })] })), generalScopeTab === 'project' && runtimeMode === 'cloud' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Danger Zone" }), !workspaceSwitchingEnabled ? (_jsx("p", { className: styles.settingHelper, children: "Workspace deletion is available in cloud runtime only." })) : !isAuthenticated ? (_jsx("p", { className: styles.settingHelper, children: "Sign in to manage workspace deletion." })) : currentWorkspaceRole !== 'owner' ? (_jsx("p", { className: styles.settingHelper, children: "Only workspace owners can delete a workspace." })) : (_jsx("div", { className: styles.pathInputGroup, children: _jsxs("button", { className: "tf-button-destructive tf-button-compact", onClick: async () => {
                                                     if (!onDeleteWorkspace)
                                                         return;
                                                     const normalizedWorkspaceId = String(workspaceId || '').trim();
@@ -944,15 +1082,37 @@ export function TaskSettings(props) {
                                                             ? `Workspace deleted with ${warningCount} cleanup warning(s).`
                                                             : 'Workspace deleted.'
                                                     });
-                                                }, disabled: !onDeleteWorkspace, children: [_jsx(Trash2, { size: 14, style: { marginRight: 8 } }), "Delete Workspace"] }) }))] }))] })), activeTab === 'appearanceApplication' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' ? renderProjectThemeControls() : renderGlobalThemeControls()] })), activeTab === 'appearanceTaskCards' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Task Cards" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardStatusLabel, onChange: async (e) => {
-                                                if (!onShowTaskCardStatusLabelChange)
-                                                    return;
-                                                const success = await onShowTaskCardStatusLabelChange(e.target.checked);
-                                                setSettingsFeedback({
-                                                    type: success ? 'success' : 'error',
-                                                    message: success ? 'Task card status label setting saved.' : 'Failed to save task card status label setting.'
-                                                });
-                                            }, disabled: !onShowTaskCardStatusLabelChange }), _jsx("span", { children: "Show status label" })] })] })), activeTab === 'appearanceTaskForms' && renderTaskFormsControls(), activeTab === 'initiatives' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Initiative Templates" }), _jsx("button", { className: styles.copyBtn, onClick: () => { void onRefreshInitiativeTemplates?.(); }, children: "Refresh" })] }), _jsx("p", { className: `${styles.settingsHint} ${styles.marginBottom12}`, children: "Create launch, migration, or incident initiatives from reusable templates." }), _jsxs("div", { className: styles.exportItem, children: [_jsx("label", { className: styles.label, children: "Template" }), _jsx("select", { className: styles.input, value: selectedInitiativeTemplateId, onChange: (e) => {
+                                                }, disabled: !onDeleteWorkspace, children: [_jsx(Trash2, { size: 14, "aria-hidden": "true" }), "Delete Workspace"] }) }))] }))] })), activeTab === 'appearanceApplication' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' ? renderProjectThemeControls() : renderGlobalThemeControls()] })), activeTab === 'appearanceTaskCards' && (_jsxs("div", { className: styles.taskCardSettingsLayout, children: [_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Task Cards" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardStatusLabel, onChange: async (e) => {
+                                                        if (!onShowTaskCardStatusLabelChange)
+                                                            return;
+                                                        const success = await onShowTaskCardStatusLabelChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card status label setting.');
+                                                    }, disabled: !onShowTaskCardStatusLabelChange }), _jsx("span", { children: "Show status label" })] }), _jsxs("div", { className: styles.taskCardSettingWithHelp, children: [_jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: runtimeMode !== 'cloud' && showTaskCardDescription, onChange: async (e) => {
+                                                                if (!onShowTaskCardDescriptionChange)
+                                                                    return;
+                                                                const success = await onShowTaskCardDescriptionChange(e.target.checked);
+                                                                reportTaskCardPreferenceResult(success, 'Failed to save task card description setting.');
+                                                            }, disabled: runtimeMode === 'cloud' || !onShowTaskCardDescriptionChange, "aria-describedby": runtimeMode === 'cloud' ? 'task-card-description-cloud-help' : undefined }), _jsx("span", { children: "Show description" })] }), runtimeMode === 'cloud' && (_jsx("span", { id: "task-card-description-cloud-help", className: styles.taskCardSettingHelp, children: "Unavailable in cloud to keep task collections fast." }))] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardAttachments, onChange: async (e) => {
+                                                        if (!onShowTaskCardAttachmentsChange)
+                                                            return;
+                                                        const success = await onShowTaskCardAttachmentsChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card attachments setting.');
+                                                    }, disabled: !onShowTaskCardAttachmentsChange }), _jsx("span", { children: "Show attachments" })] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardChecklistProgress, onChange: async (e) => {
+                                                        if (!onShowTaskCardChecklistProgressChange)
+                                                            return;
+                                                        const success = await onShowTaskCardChecklistProgressChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card checklist progress setting.');
+                                                    }, disabled: !onShowTaskCardChecklistProgressChange }), _jsx("span", { children: "Show checklist progress" })] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardLatestActivity, onChange: async (e) => {
+                                                        if (!onShowTaskCardLatestActivityChange)
+                                                            return;
+                                                        const success = await onShowTaskCardLatestActivityChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card latest activity setting.');
+                                                    }, disabled: !onShowTaskCardLatestActivityChange }), _jsx("span", { children: "Show latest activity" })] }), _jsxs("label", { className: `${styles.archiveToggle} ${styles.taskCardDependentSetting}`, children: [_jsx("input", { type: "checkbox", checked: tintTaskCardActivityBackground, onChange: async (e) => {
+                                                        if (!onTintTaskCardActivityBackgroundChange)
+                                                            return;
+                                                        const success = await onTintTaskCardActivityBackgroundChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card activity background setting.');
+                                                    }, disabled: !showTaskCardLatestActivity || !onTintTaskCardActivityBackgroundChange }), _jsx("span", { children: "Tint latest activity background" })] })] }), _jsxs("section", { className: styles.taskCardSettingsPreview, "aria-labelledby": "task-card-preview-title", children: [_jsx("h3", { id: "task-card-preview-title", className: `${styles.settingTitle} tf-heading-section`, children: "Preview" }), _jsx("div", { className: styles.taskCardSettingsPreviewFrame, inert: true, children: _jsx(TaskCard, { task: taskCardPreviewTask, categories: categories, types: types, priorities: priorities, taxonomies: taxonomies, taskInitiative: TASK_CARD_PREVIEW_INITIATIVE, taskWorkstream: TASK_CARD_PREVIEW_WORKSTREAM, showStatusLabel: showTaskCardStatusLabel, showDescription: runtimeMode !== 'cloud' && showTaskCardDescription, showAttachments: showTaskCardAttachments, showChecklistProgress: showTaskCardChecklistProgress, showLatestActivity: showTaskCardLatestActivity, tintActivityBackground: tintTaskCardActivityBackground }) })] })] })), activeTab === 'appearanceTaskForms' && renderTaskFormsControls(), activeTab === 'initiatives' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Initiative Templates" }), _jsx("button", { className: styles.copyBtn, onClick: () => { void onRefreshInitiativeTemplates?.(); }, children: "Refresh" })] }), _jsx("p", { className: `${styles.settingsHint} ${styles.marginBottom12}`, children: "Create launch, migration, or incident initiatives from reusable templates." }), _jsxs("div", { className: styles.exportItem, children: [_jsx("label", { className: styles.label, children: "Template" }), _jsx("select", { className: styles.input, value: selectedInitiativeTemplateId, onChange: (e) => {
                                                 const nextId = e.target.value;
                                                 setSelectedInitiativeTemplateId(nextId);
                                             }, children: initiativeTemplates.map(template => (_jsx("option", { value: template.id, children: template.name }, template.id))) })] }), _jsxs("div", { className: `${styles.exportItem} ${styles.marginTop12}`, children: [_jsx("label", { className: styles.label, children: "Initiative Title" }), _jsx("input", { className: styles.input, placeholder: "Enter initiative title", value: initiativeTitle, onChange: (e) => setInitiativeTitle(e.target.value) })] }), _jsxs("button", { className: `${styles.secondaryHeaderBtn} ${styles.marginTop12}`, disabled: isCreatingInitiative || !selectedInitiativeTemplateId || !initiativeTitle.trim() || !onCreateInitiativeFromTemplate, onClick: async () => {
@@ -984,22 +1144,25 @@ export function TaskSettings(props) {
                                                                                     ? new Date(selectedConnectorGrant.lastUsedAt).toLocaleString()
                                                                                     : 'not yet'] })] })] })) : ('No active connector authorization for this workspace yet.') }), _jsx("div", { className: styles.settingDescription, style: { marginTop: '12px' }, children: "Use the server URL above in your client, then finish the OAuth authorization flow from the Integrations tab." }), _jsx("div", { style: { display: 'flex', justifyContent: 'flex-end', width: '100%', marginTop: '12px' }, children: _jsx("button", { className: styles.copyBtn, onClick: () => setActiveTab('integrations'), children: "Open Integrations" }) })] }), _jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.codeBlockWrapperCustom} ${styles.marginTop12}`, style: { minHeight: '260px' }, children: [_jsxs("div", { className: styles.codeHeader, children: [_jsx("span", { className: styles.codeLabel, children: "Cloud MCP Configuration" }), _jsxs("div", { className: styles.codeHeaderActions, children: [_jsx("select", { className: styles.settingInput, value: selectedMcpClient, onChange: (e) => setSelectedMcpClient(e.target.value), "aria-label": "MCP client", style: { width: 'auto', minWidth: '170px', padding: '6px 12px', fontSize: '12px', borderRadius: '8px' }, children: MCP_CLIENT_OPTIONS.map((option) => (_jsx("option", { value: option.id, disabled: option.disabled, children: option.label }, option.id))) }), _jsx("button", { className: `${styles.copyBtn} ${copiedConfig === 'full' ? styles.copyBtnActive : ''}`, onClick: handleCopyCloudMcpConfig, title: "Copy full configuration file", children: copiedConfig === 'full' ? _jsx(Check, { size: 14 }) : _jsx(Copy, { size: 14 }) })] })] }), _jsx("pre", { className: styles.settingsCodeBlock, children: _jsx("code", { children: cloudMcpServerConfig
                                                                         ? renderMcpConfigBlock(cloudMcpServerId, cloudMcpServerConfig, cloudClientIntegration.rootKey || 'mcpServers', cloudClientIntegration.wrapperKeys || [])
-                                                                        : renderTextConfigBlock(cloudClientIntegration.renderedText || '') }) })] }), mcpConfigNotice && (_jsxs("div", { className: `${mcpConfigNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpConfigNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpConfigNotice.message] })), _jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.marginTop12}`, children: [_jsx("div", { className: styles.codeHeader, children: _jsx("span", { className: styles.codeLabel, children: cloudClientIntegration.instructionLabel }) }), _jsxs("div", { style: { padding: '16px 20px' }, children: [_jsx("div", { className: styles.settingDescription, children: cloudClientIntegration.instructionText }), renderCodexTrustGuidance(), renderMcpProfilePrompt()] })] })] })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Cloud MCP" }), _jsx("span", { className: styles.settingDescription, children: "Cloud MCP connects agents to Taskforce through the hosted MCP endpoint. Use this for remote MCP clients or tools that cannot access your local Taskforce install." })] }) }), _jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.codeBlockWrapperCustom} ${styles.marginTop16}`, children: [_jsx("div", { className: styles.codeHeader, children: _jsx("div", { className: styles.settingLabelGroup, style: { gap: '2px' }, children: _jsx("span", { className: styles.codeLabel, children: "Generate Token" }) }) }), _jsx("div", { className: styles.mcpTokenCardBody, children: _jsxs("div", { className: styles.mcpTokenFormGrid, children: [_jsxs("div", { className: styles.settingsItem, style: { gap: '6px' }, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Token Name" }) }), _jsx("input", { type: "text", className: styles.settingInput, placeholder: "Enter a recognizable token name", value: newTokenName, onChange: (e) => setNewTokenName(e.target.value) })] }), _jsxs("div", { className: styles.settingsItem, style: { gap: '6px' }, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Expiry (Optional)" }) }), _jsx("input", { type: "date", className: `${styles.settingInput} ${styles.taskFormDateInput}`, value: newTokenExpiresAt, onChange: (e) => setNewTokenExpiresAt(e.target.value) })] })] }) }), _jsxs("div", { className: styles.mcpTokenOutputWrap, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Full Token" }) }), _jsx("input", { type: "text", className: `${styles.settingInput} ${styles.mcpTokenValueInput}`, placeholder: "Generate a token to populate the full secret", value: generatedTokenValue || '', onChange: (e) => {
+                                                                        : renderTextConfigBlock(cloudClientIntegration.renderedText || '') }) })] }), mcpConfigNotice && (_jsxs("div", { className: `${mcpConfigNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpConfigNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpConfigNotice.message] })), _jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.marginTop12}`, children: [_jsx("div", { className: styles.codeHeader, children: _jsx("span", { className: styles.codeLabel, children: cloudClientIntegration.instructionLabel }) }), _jsxs("div", { style: { padding: '16px 20px' }, children: [_jsx("div", { className: styles.settingDescription, children: cloudClientIntegration.instructionText }), renderCodexTrustGuidance(), renderMcpProfilePrompt()] })] })] })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Cloud MCP" }), _jsx("span", { className: styles.settingDescription, children: "Cloud MCP connects agents to Taskforce through the hosted MCP endpoint. Use this for remote MCP clients or tools that cannot access your local Taskforce install." })] }) }), _jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.codeBlockWrapperCustom} ${styles.marginTop16}`, children: [_jsx("div", { className: styles.codeHeader, children: _jsx("div", { className: styles.settingLabelGroup, style: { gap: '2px' }, children: _jsx("span", { className: styles.codeLabel, children: "Generate Token" }) }) }), _jsx("div", { className: styles.mcpTokenCardBody, children: _jsxs("div", { className: styles.mcpTokenFormGrid, children: [_jsxs("div", { className: styles.settingsItem, style: { gap: '6px' }, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Token Name" }) }), _jsx("input", { type: "text", className: styles.settingInput, placeholder: "Enter a recognizable token name", value: newTokenName, onChange: (e) => {
+                                                                                setTokenNameCustomized(true);
+                                                                                setNewTokenName(e.target.value);
+                                                                            } })] }), _jsxs("div", { className: styles.settingsItem, style: { gap: '6px' }, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Expiry (Optional)" }) }), _jsx("input", { type: "date", className: `${styles.settingInput} ${styles.taskFormDateInput}`, value: newTokenExpiresAt, onChange: (e) => setNewTokenExpiresAt(e.target.value) })] })] }) }), _jsxs("div", { className: styles.mcpTokenOutputWrap, children: [_jsx("div", { className: styles.settingLabelGroup, children: _jsx("span", { className: styles.settingDescription, children: "Full Token" }) }), _jsx("input", { type: "text", className: `${styles.settingInput} ${styles.mcpTokenValueInput}`, placeholder: "Generate a token to populate the full secret", value: generatedTokenValue || '', onChange: (e) => {
                                                                     setGeneratedTokenValue(e.target.value);
                                                                     setMcpConnectionResult(null);
-                                                                } })] }), _jsxs("div", { className: styles.mcpTokenActionRow, children: [_jsxs("button", { className: styles.copyBtn, onClick: () => void handleTestMcpConnection(), disabled: !currentMcpTokenValue || mcpConnectionBusy, title: "Test Token", "aria-label": "Test Token", children: [mcpConnectionBusy ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Zap, { size: 14 }), _jsx("span", { children: "TEST TOKEN" })] }), _jsxs("button", { className: `${styles.copyBtn} ${copiedConfig === 'token' ? styles.copyBtnActive : ''}`, onClick: () => currentMcpTokenValue && copyToClipboard(currentMcpTokenValue, 'token'), disabled: !currentMcpTokenValue, title: "Copy Token", "aria-label": "Copy Token", children: [copiedConfig === 'token' ? _jsx(Check, { size: 14 }) : _jsx(Copy, { size: 14 }), _jsx("span", { children: "COPY TOKEN" })] }), _jsxs("button", { className: styles.copyBtn, onClick: () => void handleCreateMcpToken(), disabled: mcpActionBusyId === 'create', title: "Generate Token", "aria-label": "Generate Token", children: [mcpActionBusyId === 'create' ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Zap, { size: 14 }), _jsx("span", { children: "GENERATE TOKEN" })] })] }), mcpTokenIssueNotice && (_jsxs("div", { className: `${mcpTokenIssueNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpTokenIssueNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpTokenIssueNotice.message] })), mcpConnectionResult && (_jsxs("div", { className: `${mcpConnectionResult.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpConnectionResult.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsxs("div", { children: [_jsx("div", { children: mcpConnectionResult.message }), mcpConnectionResult.type === 'success' && (mcpConnectionResult.workspaceName || mcpConnectionResult.workspaceId) && (_jsxs("div", { className: styles.settingHelper, children: ["Workspace: ", mcpConnectionResult.workspaceName || mcpConnectionResult.workspaceId, mcpConnectionResult.workspaceId ? ` (${mcpConnectionResult.workspaceId})` : ''] })), mcpConnectionResult.type === 'success' && Array.isArray(mcpConnectionResult.scopes) && mcpConnectionResult.scopes.length > 0 && (_jsxs("div", { className: styles.settingHelper, children: ["Granted scopes: ", mcpConnectionResult.scopes.join(', ')] })), mcpConnectionResult.endpoint && (_jsxs("div", { className: styles.settingHelper, children: ["Endpoint: ", mcpConnectionResult.endpoint] })), mcpConnectionResult.type === 'error' && mcpConnectionResult.errorCode && (_jsxs("div", { className: styles.settingHelper, children: ["Error code: ", mcpConnectionResult.errorCode] })), mcpConnectionResult.type === 'error' && mcpConnectionResult.followup && (_jsx("div", { className: styles.settingHelper, children: mcpConnectionResult.followup }))] })] }))] }), _jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.codeBlockWrapperCustom} ${styles.marginTop12}`, style: { minHeight: '260px' }, children: [_jsxs("div", { className: styles.codeHeader, children: [_jsx("span", { className: styles.codeLabel, children: "Cloud MCP Configuration" }), _jsxs("div", { className: styles.codeHeaderActions, children: [_jsx("select", { className: styles.settingInput, value: selectedMcpClient, onChange: (e) => setSelectedMcpClient(e.target.value), "aria-label": "MCP client", style: { width: 'auto', minWidth: '170px', padding: '6px 12px', fontSize: '12px', borderRadius: '8px' }, children: MCP_CLIENT_OPTIONS.map((option) => (_jsx("option", { value: option.id, disabled: option.disabled, children: option.label }, option.id))) }), _jsx("button", { className: `${styles.copyBtn} ${copiedConfig === 'full' ? styles.copyBtnActive : ''}`, onClick: handleCopyCloudMcpConfig, title: "Copy full configuration file", children: copiedConfig === 'full' ? _jsx(Check, { size: 14 }) : _jsx(Copy, { size: 14 }) })] })] }), _jsx("pre", { className: styles.settingsCodeBlock, children: _jsx("code", { children: cloudMcpServerConfig
+                                                                } })] }), _jsxs("div", { className: styles.mcpTokenActionRow, children: [_jsxs("button", { className: styles.copyBtn, onClick: () => void handleTestMcpConnection(), disabled: !currentMcpTokenValue || mcpConnectionBusy, title: "Test Token", "aria-label": "Test Token", children: [mcpConnectionBusy ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Zap, { size: 14 }), _jsx("span", { children: "TEST TOKEN" })] }), _jsxs("button", { className: `${styles.copyBtn} ${copiedConfig === 'token' ? styles.copyBtnActive : ''}`, onClick: () => currentMcpTokenValue && copyToClipboard(currentMcpTokenValue, 'token'), disabled: !currentMcpTokenValue, title: "Copy Token", "aria-label": "Copy Token", children: [copiedConfig === 'token' ? _jsx(Check, { size: 14 }) : _jsx(Copy, { size: 14 }), _jsx("span", { children: "COPY TOKEN" })] }), _jsxs("button", { className: styles.copyBtn, onClick: () => void handleCreateMcpToken(), disabled: mcpActionBusyId === 'create', title: "Generate Token", "aria-label": "Generate Token", children: [mcpActionBusyId === 'create' ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Zap, { size: 14 }), _jsx("span", { children: "GENERATE TOKEN" })] })] }), mcpTokenIssueNotice && (_jsxs("div", { className: `${mcpTokenIssueNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpTokenIssueNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpTokenIssueNotice.message] })), mcpConnectionResult && (_jsxs("div", { className: `${mcpConnectionResult.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpConnectionResult.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsxs("div", { children: [_jsx("div", { children: mcpConnectionResult.message }), mcpConnectionResult.type === 'success' && (mcpConnectionResult.workspaceName || mcpConnectionResult.workspaceId) && (_jsxs("div", { className: styles.settingHelper, children: ["Workspace: ", mcpConnectionResult.workspaceName || mcpConnectionResult.workspaceId, mcpConnectionResult.workspaceId ? ` (${mcpConnectionResult.workspaceId})` : ''] })), mcpConnectionResult.type === 'success' && Array.isArray(mcpConnectionResult.scopes) && mcpConnectionResult.scopes.length > 0 && (_jsxs("div", { className: styles.settingHelper, children: ["Granted scopes: ", mcpConnectionResult.scopes.join(', ')] })), mcpConnectionResult.type === 'success' && mcpConnectionResult.toolProfile && (_jsxs("div", { className: styles.settingHelper, children: ["Tool access: ", mcpConnectionResult.toolProfile === 'extended' ? 'All cloud tools' : 'Standard', typeof mcpConnectionResult.toolCount === 'number' ? ` · ${mcpConnectionResult.toolCount} tools` : ''] })), mcpConnectionResult.endpoint && (_jsxs("div", { className: styles.settingHelper, children: ["Endpoint: ", mcpConnectionResult.endpoint] })), mcpConnectionResult.type === 'error' && mcpConnectionResult.errorCode && (_jsxs("div", { className: styles.settingHelper, children: ["Error code: ", mcpConnectionResult.errorCode] })), mcpConnectionResult.type === 'error' && mcpConnectionResult.followup && (_jsx("div", { className: styles.settingHelper, children: mcpConnectionResult.followup }))] })] }))] }), _jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.codeBlockWrapperCustom} ${styles.marginTop12}`, style: { minHeight: '260px' }, children: [_jsxs("div", { className: styles.codeHeader, children: [_jsx("span", { className: styles.codeLabel, children: "Cloud MCP Configuration" }), _jsxs("div", { className: styles.codeHeaderActions, children: [_jsx("select", { className: styles.settingInput, value: selectedMcpClient, onChange: (e) => setSelectedMcpClient(e.target.value), "aria-label": "MCP client", style: { width: 'auto', minWidth: '170px', padding: '6px 12px', fontSize: '12px', borderRadius: '8px' }, children: MCP_CLIENT_OPTIONS.map((option) => (_jsx("option", { value: option.id, disabled: option.disabled, children: option.label }, option.id))) }), _jsx("button", { className: `${styles.copyBtn} ${copiedConfig === 'full' ? styles.copyBtnActive : ''}`, onClick: handleCopyCloudMcpConfig, title: "Copy full configuration file", children: copiedConfig === 'full' ? _jsx(Check, { size: 14 }) : _jsx(Copy, { size: 14 }) })] })] }), _jsx("pre", { className: styles.settingsCodeBlock, children: _jsx("code", { children: cloudMcpServerConfig
                                                                         ? renderMcpConfigBlock(cloudMcpServerId, cloudMcpServerConfig, cloudClientIntegration.rootKey || 'mcpServers', cloudClientIntegration.wrapperKeys || [])
                                                                         : renderTextConfigBlock(cloudClientIntegration.renderedText || '') }) })] }), mcpConfigNotice && (_jsxs("div", { className: `${mcpConfigNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpConfigNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpConfigNotice.message] })), _jsxs("div", { className: `${styles.codeBlockWrapper} ${styles.marginTop12}`, children: [_jsx("div", { className: styles.codeHeader, children: _jsx("span", { className: styles.codeLabel, children: cloudClientIntegration.instructionLabel }) }), _jsxs("div", { style: { padding: '16px 20px' }, children: [_jsx("div", { className: styles.settingDescription, children: cloudClientIntegration.instructionText }), renderCodexTrustGuidance(), renderMcpProfilePrompt()] })] })] }), _jsxs("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: [_jsxs("div", { className: styles.toggleHeading, onClick: () => setShowMcpTokensList((prev) => !prev), onKeyDown: (e) => {
                                                             if (e.key === 'Enter' || e.key === ' ') {
                                                                 e.preventDefault();
                                                                 setShowMcpTokensList((prev) => !prev);
                                                             }
-                                                        }, role: "button", tabIndex: 0, title: showMcpTokensList ? 'Hide workspace tokens' : 'Show workspace tokens', children: [_jsx("label", { className: styles.label, children: "Your Tokens" }), showMcpTokensList ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }), showMcpTokensList && (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingDescription} ${styles.marginTop12}`, children: "Manage tokens created for this workspace." }), mcpTokenListNotice && (_jsxs("div", { className: `${mcpTokenListNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpTokenListNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpTokenListNotice.message] })), mcpTokensLoading ? (_jsx("p", { className: styles.settingHelper, children: "Loading tokens\u2026" })) : mcpTokensError ? (_jsxs("div", { className: styles.errorMessage, children: [_jsx(AlertTriangle, { size: 14 }), mcpTokensError] })) : mcpTokens.length === 0 ? (_jsx("p", { className: styles.settingHelper, children: "No MCP tokens yet." })) : (_jsx("div", { className: styles.settingGroup, children: sortedMcpTokens.map((token) => (_jsxs("div", { className: `${styles.settingsItem} ${styles.marginTop12}`, style: {
+                                                        }, role: "button", tabIndex: 0, title: showMcpTokensList ? 'Hide workspace tokens' : 'Show workspace tokens', children: [_jsx("label", { className: styles.label, children: "Your Tokens" }), showMcpTokensList ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }), showMcpTokensList && (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingDescription} ${styles.marginTop12}`, children: "Manage tokens created for this workspace." }), mcpTokenListNotice && (_jsxs("div", { className: `${mcpTokenListNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpTokenListNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpTokenListNotice.message] })), mcpProfileNotice && (_jsxs("div", { className: `${mcpProfileNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpProfileNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpProfileNotice.message] })), mcpTokensLoading ? (_jsx("p", { className: styles.settingHelper, children: "Loading tokens\u2026" })) : mcpTokensError ? (_jsxs("div", { className: styles.errorMessage, children: [_jsx(AlertTriangle, { size: 14 }), mcpTokensError] })) : mcpTokens.length === 0 ? (_jsx("p", { className: styles.settingHelper, children: "No MCP tokens yet." })) : (_jsx("div", { className: styles.settingGroup, children: sortedMcpTokens.map((token) => (_jsxs("div", { className: `${styles.settingsItem} ${styles.marginTop12}`, style: {
                                                                         padding: '14px 16px',
                                                                         borderRadius: '12px',
                                                                         border: '1px solid var(--border-primary, rgba(255, 255, 255, 0.1))',
                                                                         background: 'rgba(255, 255, 255, 0.03)'
-                                                                    }, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: token.name }), _jsx("span", { className: `${styles.configBadge} ${token.status === 'revoked' ? styles.configBadgeRevoked : token.status === 'expired' ? styles.configBadgeExpired : styles.configBadgeActive}`, children: token.status })] }), _jsx("span", { className: styles.settingDescription, style: { fontFamily: '"JetBrains Mono", "Fira Code", monospace' }, children: token.tokenPrefix }), _jsxs("span", { className: styles.settingDescription, children: ["Scopes: ", token.scopes.join(', ')] }), _jsxs("span", { className: styles.settingDescription, children: ["Created ", new Date(token.createdAt).toLocaleDateString(), token.lastUsedAt ? ` · Last used ${new Date(token.lastUsedAt).toLocaleString()}` : ' · Never used'] })] }), _jsxs("div", { style: { display: 'flex', gap: '8px', flexWrap: 'wrap', justifyContent: 'flex-end' }, children: [token.status === 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'regenerate'), disabled: mcpActionBusyId === `regenerate:${token.id}`, children: "Regenerate" })), token.status === 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'revoke'), disabled: mcpActionBusyId === `revoke:${token.id}`, children: "Revoke" })), token.status !== 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'delete'), disabled: mcpActionBusyId === `delete:${token.id}`, children: "Delete" }))] })] }, token.id))) }))] }))] })] })) })), showLocalMcp && (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Local MCP" }), _jsx("span", { className: styles.settingDescription, children: "Local MCP connects through your local Taskforce install and does not require a cloud access token. Use this for Codex, Claude Code CLI, Gemini CLI, and similar local MCP clients." })] }) }), useGlobalMcp && localMcpHealth.status === 'host-unverified' && (_jsxs("div", { className: `${styles.mcpHealthCompactAlert} ${styles.marginTop12}`, role: "status", children: [_jsx(AlertTriangle, { size: 17, "aria-hidden": "true" }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP cannot be checked on this host" }), _jsxs("span", { children: ["This project uses host path mapping. Verify ", _jsx("code", { children: "taskforce --version" }), " in the host environment, or use Local / npx."] })] }), _jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => setUseGlobalMcp(false), children: "Use Local / npx" })] })), useGlobalMcp && globalCliMismatch && (_jsxs("div", { className: `${styles.mcpHealthUpdateRow} ${styles.marginTop12}`, role: "status", children: [_jsx("div", { className: styles.mcpHealthUpdateIcon, children: _jsx(AlertTriangle, { size: 17, "aria-hidden": "true" }) }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP update available" }), _jsxs("span", { children: [globalCliMismatch.cliVersion || 'Unknown version', " installed", ' · ', globalCliMismatch.appVersion, " expected"] })] }), _jsxs("button", { type: "button", className: `tf-button-secondary tf-button-compact ${styles.mcpHealthStableAction}`, onClick: () => setGlobalCliDialogOpen(true), disabled: localMcpHealthChecking, "aria-busy": localMcpHealthChecking, children: [localMcpHealthChecking && (_jsx(Loader2, { className: styles.spinner, size: 14, "aria-hidden": "true" })), "Review update"] })] })), useGlobalMcp && globalCliUnavailable && (_jsxs("div", { className: `${styles.mcpHealthBlockingAlert} ${styles.marginTop12}`, role: "alert", children: [_jsx(AlertTriangle, { size: 18, "aria-hidden": "true" }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP is unavailable" }), _jsx("span", { children: globalCliUnavailable.message })] }), _jsxs("div", { className: styles.mcpHealthCompactActions, children: [_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => setUseGlobalMcp(false), children: "Use Local / npx" }), _jsxs("button", { type: "button", className: `tf-button-secondary tf-button-compact ${styles.mcpHealthStableAction}`, onClick: () => setLocalMcpHealthRetry((value) => value + 1), disabled: localMcpHealthChecking, "aria-busy": localMcpHealthChecking, "aria-label": localMcpHealthChecking ? 'Checking Global MCP' : 'Check again', children: [localMcpHealthChecking && (_jsx(Loader2, { className: styles.spinner, size: 14, "aria-hidden": "true" })), "Check again"] })] })] })), mcpConfigNotice?.type === 'error' && !globalCliDialogOpen && (_jsxs("div", { className: `${styles.mcpHealthCopyError} ${styles.marginTop12}`, role: "alert", children: [_jsx(AlertTriangle, { size: 14, "aria-hidden": "true" }), mcpConfigNotice.message] })), _jsx(Modal, { isOpen: globalCliDialogOpen && Boolean(globalCliMismatch), onClose: () => setGlobalCliDialogOpen(false), title: "Update Global MCP", size: "md", theme: currentTheme, children: globalCliMismatch && (_jsxs("div", { className: styles.mcpUpdateDialog, children: [_jsx("p", { className: styles.mcpUpdateDialogIntro, children: "Your Global MCP CLI is usable, but it does not match this Taskforce app. Update it, then restart any running MCP clients." }), _jsxs("dl", { className: styles.mcpUpdateVersionGrid, children: [_jsxs("div", { children: [_jsx("dt", { children: "Installed CLI" }), _jsx("dd", { children: globalCliMismatch.cliVersion || 'Unknown' })] }), _jsxs("div", { children: [_jsx("dt", { children: "Expected by app" }), _jsx("dd", { children: globalCliMismatch.appVersion })] }), _jsxs("div", { children: [_jsx("dt", { children: "Installation channel" }), _jsx("dd", { children: globalCliUpdateStatus.status === 'loading'
+                                                                    }, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: token.name }), _jsx("span", { className: `${styles.configBadge} ${token.status === 'revoked' ? styles.configBadgeRevoked : token.status === 'expired' ? styles.configBadgeExpired : styles.configBadgeActive}`, children: token.status })] }), _jsx("span", { className: styles.settingDescription, style: { fontFamily: '"JetBrains Mono", "Fira Code", monospace' }, children: token.tokenPrefix }), _jsxs("span", { className: styles.settingDescription, children: ["Scopes: ", token.scopes.join(', ')] }), _jsxs("span", { className: styles.settingDescription, children: ["Tool access: ", (token.toolProfile || 'default') === 'extended' ? 'All cloud tools' : 'Standard', " \u00B7 up to ", mcpToolProfileOptions.find((option) => option.id === (token.toolProfile || 'default'))?.toolCount ?? 58, " tools; granted scopes still apply"] }), _jsxs("span", { className: styles.settingDescription, children: ["Created ", new Date(token.createdAt).toLocaleDateString(), token.lastUsedAt ? ` · Last used ${new Date(token.lastUsedAt).toLocaleString()}` : ' · Never used'] })] }), _jsxs("div", { style: { display: 'flex', gap: '8px', flexWrap: 'wrap', justifyContent: 'flex-end' }, children: [token.status === 'active' && (_jsx("select", { className: styles.settingInput, "aria-label": `Tool access for ${token.name}`, value: token.toolProfile || 'default', onChange: (event) => void handleMcpToolProfileChange('tokens', token.id, event.target.value), disabled: !canManageMcpToolProfiles || mcpActionBusyId === `profile:tokens:${token.id}`, title: canManageMcpToolProfiles ? 'Change cloud MCP tool access' : 'Workspace owner or admin required', style: { width: 'auto', minWidth: '170px' }, children: mcpToolProfileOptions.map((option) => (_jsxs("option", { value: option.id, children: [option.label, " \u00B7 ", option.toolCount] }, option.id))) })), token.status === 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'regenerate'), disabled: mcpActionBusyId === `regenerate:${token.id}`, children: "Regenerate" })), token.status === 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'revoke'), disabled: mcpActionBusyId === `revoke:${token.id}`, children: "Revoke" })), token.status !== 'active' && (_jsx("button", { className: styles.copyBtn, onClick: () => void handleMcpTokenAction(token.id, 'delete'), disabled: mcpActionBusyId === `delete:${token.id}`, children: "Delete" }))] })] }, token.id))) }))] }))] })] })) })), showLocalMcp && (_jsxs(_Fragment, { children: [_jsx("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Local MCP" }), _jsx("span", { className: styles.settingDescription, children: "Local MCP connects through your local Taskforce install and does not require a cloud access token. Use this for Codex, Claude Code CLI, Gemini CLI, and similar local MCP clients." })] }) }), useGlobalMcp && localMcpHealth.status === 'host-unverified' && (_jsxs("div", { className: `${styles.mcpHealthCompactAlert} ${styles.marginTop12}`, role: "status", children: [_jsx(AlertTriangle, { size: 17, "aria-hidden": "true" }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP cannot be checked on this host" }), _jsxs("span", { children: ["This project uses host path mapping. Verify ", _jsx("code", { children: "taskforce --version" }), " in the host environment, or use Local / npx."] })] }), _jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => setUseGlobalMcp(false), children: "Use Local / npx" })] })), useGlobalMcp && globalCliMismatch && (_jsxs("div", { className: `${styles.mcpHealthUpdateRow} ${styles.marginTop12}`, role: "status", children: [_jsx("div", { className: styles.mcpHealthUpdateIcon, children: _jsx(AlertTriangle, { size: 17, "aria-hidden": "true" }) }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP update available" }), _jsxs("span", { children: [globalCliMismatch.cliVersion || 'Unknown version', " installed", ' · ', globalCliMismatch.appVersion, " expected"] })] }), _jsxs("button", { type: "button", className: `tf-button-secondary tf-button-compact ${styles.mcpHealthStableAction}`, onClick: () => setGlobalCliDialogOpen(true), disabled: localMcpHealthChecking, "aria-busy": localMcpHealthChecking, children: [localMcpHealthChecking && (_jsx(Loader2, { className: styles.spinner, size: 14, "aria-hidden": "true" })), "Review update"] })] })), useGlobalMcp && globalCliUnavailable && (_jsxs("div", { className: `${styles.mcpHealthBlockingAlert} ${styles.marginTop12}`, role: "alert", children: [_jsx(AlertTriangle, { size: 18, "aria-hidden": "true" }), _jsxs("div", { className: styles.mcpHealthCompactBody, children: [_jsx("strong", { children: "Global MCP is unavailable" }), _jsx("span", { children: globalCliUnavailable.message })] }), _jsxs("div", { className: styles.mcpHealthCompactActions, children: [_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: () => setUseGlobalMcp(false), children: "Use Local / npx" }), _jsxs("button", { type: "button", className: `tf-button-secondary tf-button-compact ${styles.mcpHealthStableAction}`, onClick: () => setLocalMcpHealthRetry((value) => value + 1), disabled: localMcpHealthChecking, "aria-busy": localMcpHealthChecking, "aria-label": localMcpHealthChecking ? 'Checking Global MCP' : 'Check again', children: [localMcpHealthChecking && (_jsx(Loader2, { className: styles.spinner, size: 14, "aria-hidden": "true" })), "Check again"] })] })] })), mcpConfigNotice?.type === 'error' && !globalCliDialogOpen && (_jsxs("div", { className: `${styles.mcpHealthCopyError} ${styles.marginTop12}`, role: "alert", children: [_jsx(AlertTriangle, { size: 14, "aria-hidden": "true" }), mcpConfigNotice.message] })), _jsx(Modal, { isOpen: globalCliDialogOpen && Boolean(globalCliMismatch), onClose: () => setGlobalCliDialogOpen(false), title: "Update Global MCP", size: "md", theme: currentTheme, children: globalCliMismatch && (_jsxs("div", { className: styles.mcpUpdateDialog, children: [_jsx("p", { className: styles.mcpUpdateDialogIntro, children: "Your Global MCP CLI is usable, but it does not match this Taskforce app. Update it, then restart any running MCP clients." }), _jsxs("dl", { className: styles.mcpUpdateVersionGrid, children: [_jsxs("div", { children: [_jsx("dt", { children: "Installed CLI" }), _jsx("dd", { children: globalCliMismatch.cliVersion || 'Unknown' })] }), _jsxs("div", { children: [_jsx("dt", { children: "Expected by app" }), _jsx("dd", { children: globalCliMismatch.appVersion })] }), _jsxs("div", { children: [_jsx("dt", { children: "Installation channel" }), _jsx("dd", { children: globalCliUpdateStatus.status === 'loading'
                                                                             ? 'Detecting…'
                                                                             : updateChannelLabel })] })] }), globalCliUpdateStatus.status === 'loading' && (_jsxs("div", { className: styles.mcpUpdateLoading, role: "status", "aria-live": "polite", children: [_jsx(Loader2, { className: styles.spinner, size: 15, "aria-hidden": "true" }), "Detecting the package manager\u2026"] })), globalCliUpdateStatus.status === 'error' && (_jsxs("div", { className: styles.mcpUpdateNotice, role: "status", children: [_jsx(AlertTriangle, { size: 16, "aria-hidden": "true" }), _jsxs("span", { children: [globalCliUpdateStatus.message, " Check again, or update using the package manager you originally used."] })] })), globalCliUpdateCommands.length > 0 && globalCliUpdateStatus.status !== 'loading' && (_jsxs("div", { className: styles.mcpUpdateCommands, children: [_jsx("span", { className: styles.mcpUpdateSectionLabel, children: updateTarget?.channel === 'unknown'
                                                                     || updateTarget?.channel === 'conflicting'
@@ -1015,7 +1178,7 @@ export function TaskSettings(props) {
                                                         e.preventDefault();
                                                         setShowAdvancedMcp((prev) => !prev);
                                                     }
-                                                }, role: "button", tabIndex: 0, title: "Show advanced MCP install options", children: [_jsx("label", { className: styles.label, children: "Advanced" }), showAdvancedMcp ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }) }), showAdvancedMcp && (_jsxs("div", { className: `${styles.settingGroup} ${styles.marginTop12}`, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Advanced Installation Mode" }), _jsx("span", { className: styles.settingDescription, children: "Global mode is recommended. Local / npx is intended for Taskforce development workflows." })] }), _jsxs("div", { className: styles.buttonGrid, children: [_jsx("button", { className: `${styles.themeBtn} ${useGlobalMcp ? styles.activeTheme : ''}`, onClick: () => setUseGlobalMcp(true), children: "Global" }), _jsx("button", { className: `${styles.themeBtn} ${!useGlobalMcp ? styles.activeTheme : ''}`, onClick: () => setUseGlobalMcp(false), children: "Local / npx (Dev)" })] }), _jsxs("div", { className: `${styles.settingsItem} ${styles.marginTop16}`, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: "MCP Path Mapping (Host Root)" }), serverHostRoot && !mcpHostRoot && (_jsx("span", { className: styles.configBadge, children: "Server Configured" }))] }), _jsx("span", { className: styles.settingDescription, children: "If running in Docker, WSL, or Remote Dev, provide the absolute path to this project as seen by your host OS." })] }), _jsx("div", { className: styles.pathInputWrapper, children: _jsx("input", { type: "text", className: styles.settingInput, placeholder: serverHostRoot || "/Users/username/Projects/my-project or C:\\Projects\\my-project", value: mcpHostRoot || '', onChange: (e) => onMcpHostRootChange?.(e.target.value) }) })] })] }))] }))] })), activeTab === 'integrations' && (_jsxs("div", { className: styles.settingsGroup, children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Integrations" }), _jsx("span", { className: styles.settingDescription, children: "Manage OAuth-based app connectors separately from MCP tokens and local client setup." })] }) }), _jsxs("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: [[
+                                                }, role: "button", tabIndex: 0, title: "Show advanced MCP install options", children: [_jsx("label", { className: styles.label, children: "Advanced" }), showAdvancedMcp ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }) }), showAdvancedMcp && (_jsxs("div", { className: `${styles.settingGroup} ${styles.marginTop12}`, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Advanced Installation Mode" }), _jsx("span", { className: styles.settingDescription, children: "Global mode is recommended. Local / npx is intended for Taskforce development workflows." })] }), _jsxs("div", { className: styles.buttonGrid, children: [_jsx("button", { className: `${styles.themeBtn} ${useGlobalMcp ? styles.activeTheme : ''}`, onClick: () => setUseGlobalMcp(true), children: "Global" }), _jsx("button", { className: `${styles.themeBtn} ${!useGlobalMcp ? styles.activeTheme : ''}`, onClick: () => setUseGlobalMcp(false), children: "Local / npx (Dev)" })] }), _jsxs("div", { className: `${styles.settingsItem} ${styles.marginTop16}`, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: "MCP Path Mapping (Host Root)" }), serverHostRoot && !mcpHostRoot && (_jsx("span", { className: styles.configBadge, children: "Server Configured" }))] }), _jsx("span", { className: styles.settingDescription, children: "If running in Docker, WSL, or Remote Dev, provide the absolute path to this project as seen by your host OS." })] }), _jsx("div", { className: styles.pathInputWrapper, children: _jsx("input", { type: "text", className: styles.settingInput, placeholder: serverHostRoot || "/Users/username/Projects/my-project or C:\\Projects\\my-project", value: mcpHostRoot || '', onChange: (e) => onMcpHostRootChange?.(e.target.value) }) })] })] }))] }))] })), activeTab === 'integrations' && (_jsxs("div", { className: styles.settingsGroup, children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: styles.settingLabelGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Integrations" }), _jsx("span", { className: styles.settingDescription, children: "Manage OAuth-based app connectors separately from MCP tokens and local client setup." })] }) }), _jsxs("div", { className: `${styles.settingGroup} ${styles.marginTop16}`, children: [mcpProfileNotice && (_jsxs("div", { className: `${mcpProfileNotice.type === 'success' ? styles.successMessage : styles.errorMessage} ${styles.marginTop12}`, children: [mcpProfileNotice.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), mcpProfileNotice.message] })), [
                                             {
                                                 key: 'chatgpt',
                                                 label: 'ChatGPT Connector',
@@ -1069,6 +1232,6 @@ export function TaskSettings(props) {
                                                     borderRadius: '14px',
                                                     border: '1px solid var(--border-primary, rgba(255, 255, 255, 0.1))',
                                                     background: 'rgba(255, 255, 255, 0.03)'
-                                                }, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: item.label }), _jsx("span", { className: `${styles.configBadge} ${connector && !comingSoon ? styles.configBadgeActive : styles.configBadgeRevoked}`, children: comingSoon ? 'coming soon' : (connector ? 'connected' : 'not connected') })] }), _jsx("span", { className: styles.settingDescription, children: item.description }), !comingSoon && (_jsx("span", { className: styles.settingDescription, style: { fontFamily: '"JetBrains Mono", "Fira Code", monospace' }, children: cloudMcpEndpoint })), comingSoon ? null : connector ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: styles.settingDescription, children: ["Authorized workspace: ", currentWorkspaceName || connector.workspaceId] }), _jsxs("span", { className: styles.settingDescription, children: ["Granted scopes: ", connector.scopes.join(', ')] }), _jsxs("span", { className: styles.settingDescription, children: ["Connected ", new Date(connector.createdAt).toLocaleString(), connector.lastUsedAt ? ` · Last used ${new Date(connector.lastUsedAt).toLocaleString()}` : ' · Never used'] })] })) : (_jsx("span", { className: styles.settingDescription, children: item.emptyMessage }))] }), _jsx("div", { style: { display: 'flex', justifyContent: 'flex-end', gap: '8px', flexWrap: 'wrap' }, children: connector && !comingSoon && (_jsxs("button", { className: styles.copyBtn, onClick: () => void handleDisconnectConnector(connector.id), disabled: mcpConnectorBusyId === connector.id, children: [mcpConnectorBusyId === connector.id ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Trash2, { size: 14 }), "Disconnect"] })) })] }, item.key));
+                                                }, children: [_jsxs("div", { className: styles.settingLabelGroup, children: [_jsxs("div", { className: styles.labelGroupFlex, children: [_jsx("label", { className: styles.settingLabel, children: item.label }), _jsx("span", { className: `${styles.configBadge} ${connector && !comingSoon ? styles.configBadgeActive : styles.configBadgeRevoked}`, children: comingSoon ? 'coming soon' : (connector ? 'connected' : 'not connected') })] }), _jsx("span", { className: styles.settingDescription, children: item.description }), !comingSoon && (_jsx("span", { className: styles.settingDescription, style: { fontFamily: '"JetBrains Mono", "Fira Code", monospace' }, children: cloudMcpEndpoint })), comingSoon ? null : connector ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: styles.settingDescription, children: ["Authorized workspace: ", currentWorkspaceName || connector.workspaceId] }), _jsxs("span", { className: styles.settingDescription, children: ["Granted scopes: ", connector.scopes.join(', ')] }), _jsxs("span", { className: styles.settingDescription, children: ["Tool access: ", (connector.toolProfile || 'default') === 'extended' ? 'All cloud tools' : 'Standard', " \u00B7 up to ", mcpToolProfileOptions.find((option) => option.id === (connector.toolProfile || 'default'))?.toolCount ?? 58, " tools; granted scopes still apply"] }), _jsxs("span", { className: styles.settingDescription, children: ["Connected ", new Date(connector.createdAt).toLocaleString(), connector.lastUsedAt ? ` · Last used ${new Date(connector.lastUsedAt).toLocaleString()}` : ' · Never used'] })] })) : (_jsx("span", { className: styles.settingDescription, children: item.emptyMessage }))] }), _jsxs("div", { style: { display: 'flex', justifyContent: 'flex-end', gap: '8px', flexWrap: 'wrap' }, children: [connector && !comingSoon && (_jsx("select", { className: styles.settingInput, "aria-label": `Tool access for ${item.label}`, value: connector.toolProfile || 'default', onChange: (event) => void handleMcpToolProfileChange('connectors', connector.id, event.target.value), disabled: !canManageMcpToolProfiles || mcpConnectorBusyId === `profile:connectors:${connector.id}`, title: canManageMcpToolProfiles ? 'Change cloud MCP tool access' : 'Workspace owner or admin required', style: { width: 'auto', minWidth: '170px' }, children: mcpToolProfileOptions.map((option) => (_jsxs("option", { value: option.id, children: [option.label, " \u00B7 ", option.toolCount] }, option.id))) })), connector && !comingSoon && (_jsxs("button", { className: styles.copyBtn, onClick: () => void handleDisconnectConnector(connector.id), disabled: mcpConnectorBusyId === connector.id, children: [mcpConnectorBusyId === connector.id ? _jsx(Loader2, { size: 14, className: styles.spinIcon }) : _jsx(Trash2, { size: 14 }), "Disconnect"] }))] })] }, item.key));
                                         }), mcpConnectorsLoading && (_jsx("p", { className: `${styles.settingHelper} ${styles.marginTop12}`, children: "Loading connector grants\u2026" })), mcpConnectorsError && (_jsxs("div", { className: `${styles.errorMessage} ${styles.marginTop12}`, children: [_jsx(AlertTriangle, { size: 14 }), mcpConnectorsError] }))] })] }))] })] }) }));
 }