@taskforcehq/taskforce 0.3.169 → 0.3.300

package/dist/components/features/TaskSettings.test.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from '@testing-library/react';
+import { fireEvent, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { describe, it, expect, vi } from 'vitest';
 import { TaskSettings } from './TaskSettings';
+import { TASKFORCE_THEME_OPTIONS } from '../../utils/theme';
 describe('TaskSettings Component', () => {
     // Default mock props
     const defaultSettingsModel = {
@@ -13,13 +14,17 @@ describe('TaskSettings Component', () => {
         jsonBackupEnabled: false,
         globalJsonBackupEnabled: false,
         jsonBackupUseGlobalDefault: false,
+        showTaskCardStatusLabel: true,
         exportWorkflowsPath: '.agent/workflows',
-        exportSpecialistsPath: '.agent/specialists',
         exportingResource: null,
         exportResult: null,
         pathSaved: false,
         initialSection: null,
         exportEnvironment: 'antigravity',
+        fetchCloudAuthApi: vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        })),
         // Mock Callbacks
         onThemeChange: vi.fn(),
         onSaveTheme: vi.fn(),
@@ -28,11 +33,12 @@ describe('TaskSettings Component', () => {
         onKeyShortcutChange: vi.fn(),
         onJsonBackupEnabledChange: vi.fn(),
         onSaveGlobalJsonBackupEnabled: vi.fn(),
+        onSaveGlobalWeekStartsOn: vi.fn(),
+        onChecklistDropdownEnabledChange: vi.fn(),
+        onShowTaskCardStatusLabelChange: vi.fn(async () => true),
         onSaveSettings: vi.fn(),
         onExportWorkflowsPathChange: vi.fn(),
-        onExportSpecialistsPathChange: vi.fn(),
         onExportEnvironmentChange: vi.fn(),
-        onExportResources: vi.fn(),
         onShowFolderBrowserChange: vi.fn(),
         onBrowserTargetChange: vi.fn(),
         onFetchFolders: vi.fn(),
@@ -53,11 +59,12 @@ describe('TaskSettings Component', () => {
         onUpdateCategoryColor: vi.fn(),
         // Type Manager Props
         types: [
-            { value: 'feature', label: 'Feature' },
-            { value: 'bug', label: 'Bug' }
+            { value: 'task', label: 'Task' },
+            { value: 'issue', label: 'Issue' }
         ],
         onSaveType: vi.fn(),
         onRemoveType: vi.fn(),
+        onUpdateType: vi.fn(),
         // Taxonomy Props
         taxonomies: [],
         onUpdateTaxonomies: vi.fn(),
@@ -65,9 +72,14 @@ describe('TaskSettings Component', () => {
             { value: 1, label: 'Low', color: 'teal-500', icon: 'ArrowDown' },
             { value: 2, label: 'Medium', color: 'blue-500', icon: 'Minus' },
             { value: 3, label: 'High', color: 'amber-500', icon: 'ArrowUp' },
-            { value: 4, label: 'Critical', color: 'red-500', icon: 'AlertTriangle' },
         ],
         onUpdatePriorities: vi.fn(),
+        onAnalyzeSystemTaxonomyPack: vi.fn(() => ({
+            unmatchedCategoryValues: [],
+            unmatchedTypeValues: [],
+            incompatiblePriorityValues: []
+        })),
+        onApplySystemTaxonomyPack: vi.fn(async () => ({ success: true })),
         approaches: [
             { value: 'evaluate', label: 'Evaluate', color: 'amber-500', icon: 'Search' },
             { value: 'collaborate', label: 'Collaborate', color: 'blue-500', icon: 'Users' },
@@ -95,32 +107,89 @@ describe('TaskSettings Component', () => {
         };
         return render(_jsx(TaskSettings, { ...props }));
     };
+    const originalFetch = global.fetch;
     it('4.1 Open settings - Renders correctly', () => {
         renderComponent();
-        expect(screen.getByText('Project Settings')).toBeInTheDocument();
-        expect(screen.getByText('Taxonomies')).toBeInTheDocument();
+        expect(screen.getByText('Sections')).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /general/i })).toBeInTheDocument();
+    });
+    it('4.1a Sidebar renders all primary settings sections', () => {
+        renderComponent();
+        expect(screen.getByRole('button', { name: /general/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /appearance/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /application/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /task cards/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /task forms/i })).toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: /documents/i })).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: /commands/i })).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: /initiatives/i })).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: /workflows/i })).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: /agents/i })).not.toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /taxonomy/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /^mcp$/i })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /integrations/i })).toBeInTheDocument();
+    });
+    it('4.1b General tab removes old profile/account chrome', () => {
+        renderComponent();
+        expect(screen.queryByText('Workspace Profile')).not.toBeInTheDocument();
+        expect(screen.queryByText('Account Plan')).not.toBeInTheDocument();
+        expect(screen.queryByText('Project Settings')).not.toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Save' })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Reset to Global' })).toBeInTheDocument();
     });
-    it('4.2 Version shown', () => {
+    it('4.1c Danger zone is hidden in local mode', () => {
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                workspaceSwitchingEnabled: true,
+                isAuthenticated: true,
+                currentWorkspaceRole: 'owner'
+            }
+        });
+        expect(screen.queryByText('Danger Zone')).not.toBeInTheDocument();
+    });
+    it('4.1d Global tab no longer shows operating mode', async () => {
+        const user = userEvent.setup();
         renderComponent();
-        expect(screen.getByText(/v\d+\.\d+\.\d+/)).toBeInTheDocument();
+        await user.click(screen.getByRole('button', { name: 'Global' }));
+        expect(screen.queryByText('Operating Mode')).not.toBeInTheDocument();
     });
     it('4.3 Theme toggle', async () => {
         const user = userEvent.setup();
         renderComponent();
+        await user.click(screen.getByRole('button', { name: /application/i }));
         const lightBtn = screen.getByRole('button', { name: /^light$/i });
         await user.click(lightBtn);
         expect(defaultSettingsModel.onThemeChange).toHaveBeenCalledWith('light');
         expect(defaultSettingsModel.onSaveTheme).toHaveBeenCalledWith('light');
     });
+    it('4.3a Renders all registered themes in the picker', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /application/i }));
+        for (const themeOption of TASKFORCE_THEME_OPTIONS) {
+            expect(screen.getByRole('button', { name: new RegExp(`^${themeOption.label}$`, 'i') })).toBeInTheDocument();
+        }
+    });
     it('4.4 Theme persists', async () => {
         const user = userEvent.setup();
         // This tests that the callback is invoked, persistence is handled by parent
         renderComponent();
+        await user.click(screen.getByRole('button', { name: /application/i }));
         const midnightBtn = screen.getByRole('button', { name: /^midnight$/i });
         await user.click(midnightBtn);
         expect(defaultSettingsModel.onThemeChange).toHaveBeenCalledWith('midnight');
         expect(defaultSettingsModel.onSaveTheme).toHaveBeenCalledWith('midnight');
     });
+    it('4.4a Dawn theme can be selected', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /application/i }));
+        const dawnBtn = screen.getByRole('button', { name: /^dawn$/i });
+        await user.click(dawnBtn);
+        expect(defaultSettingsModel.onThemeChange).toHaveBeenCalledWith('dawn');
+        expect(defaultSettingsModel.onSaveTheme).toHaveBeenCalledWith('dawn');
+    });
     it('4.4b JSON backup toggle updates setting', async () => {
         const user = userEvent.setup();
         renderComponent();
@@ -128,6 +197,37 @@ describe('TaskSettings Component', () => {
         await user.click(backupToggle);
         expect(defaultSettingsModel.onJsonBackupEnabledChange).toHaveBeenCalledWith(true);
     });
+    it('4.4c JSON backup controls are hidden in cloud mode', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'cloud'
+            }
+        });
+        expect(screen.queryByRole('checkbox', { name: /enable automatic json backup/i })).not.toBeInTheDocument();
+        await user.click(screen.getByRole('button', { name: 'Global' }));
+        expect(screen.queryByRole('checkbox', { name: /enable global json backup default/i })).not.toBeInTheDocument();
+    });
+    it('4.4d Task forms section owns checklist dropdown setting', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /task forms/i }));
+        const checklistToggle = screen.getByRole('checkbox', { name: /enable checklist dropdown in task form/i });
+        await user.click(checklistToggle);
+        expect(defaultSettingsModel.onChecklistDropdownEnabledChange).toHaveBeenCalledWith(false);
+    });
+    it('4.4e Task cards section owns the status label setting', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /task cards/i }));
+        const statusLabelToggle = screen.getByRole('checkbox', { name: /show status label/i });
+        await user.click(statusLabelToggle);
+        expect(defaultSettingsModel.onShowTaskCardStatusLabelChange).toHaveBeenCalledWith(false);
+    });
+    it('4.4f Initial appearance section opens directly', () => {
+        renderComponent({ initialSection: 'appearance-task-forms' });
+        expect(screen.getByRole('checkbox', { name: /enable checklist dropdown in task form/i })).toBeInTheDocument();
+    });
     // 4.5 Open category manager - It's always visible in the new design
     it('4.5 Categories section is visible', () => {
         renderComponent({ initialSection: 'categories' });
@@ -165,7 +265,7 @@ describe('TaskSettings Component', () => {
         await user.tab(); // Trigger blur
         expect(defaultSettingsModel.onUpdateCategory).toHaveBeenCalledWith(expect.objectContaining({ label: 'Backend API' }), 'Backend');
     });
-    it('4.8 Delete category', async () => {
+    it('4.8 Retire category', async () => {
         // Mock window.confirm
         vi.spyOn(window, 'confirm').mockImplementation(() => true);
         const user = userEvent.setup();
@@ -175,11 +275,28 @@ describe('TaskSettings Component', () => {
         await user.click(dropdown);
         const option = screen.getByText('Backend');
         await user.click(option);
-        // Click delete
-        const deleteBtn = screen.getByTitle('Delete Category');
-        await user.click(deleteBtn);
+        // Click retire
+        const retireBtn = screen.getByTitle('Retire Category');
+        await user.click(retireBtn);
         expect(defaultSettingsModel.onRemoveCategory).toHaveBeenCalledWith('backend');
     });
+    it('4.8a Protected fallback category cannot be retired', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            initialSection: 'categories',
+            settingsModel: {
+                categories: [
+                    { value: 'default', label: 'General', disabled: false },
+                    { value: 'backend', label: 'Backend', disabled: false }
+                ]
+            }
+        });
+        const dropdown = screen.getByText('Select a category to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getAllByText('General').at(-1));
+        expect(screen.queryByTitle('Retire Category')).not.toBeInTheDocument();
+        expect(screen.getByText('General is the protected fallback category and cannot be retired.')).toBeInTheDocument();
+    });
     it('4.9 Category icon', async () => {
         const user = userEvent.setup();
         renderComponent({ initialSection: 'categories' });
@@ -244,27 +361,459 @@ describe('TaskSettings Component', () => {
         await user.click(createBtn);
         expect(defaultSettingsModel.onSaveType).toHaveBeenCalledWith('Refactor');
     });
-    it('4.14 Delete type', async () => {
+    it('4.14 Retire type', async () => {
         vi.spyOn(window, 'confirm').mockImplementation(() => true);
         const user = userEvent.setup();
         renderComponent({ initialSection: 'types' });
         const dropdown = screen.getByText('Select a type to configure...').closest('button');
         await user.click(dropdown);
-        const option = screen.getByText('Feature');
+        const option = screen.getAllByText('Issue').at(-1);
         await user.click(option);
-        const deleteBtn = screen.getByTitle('Delete Type');
-        await user.click(deleteBtn);
-        expect(defaultSettingsModel.onRemoveType).toHaveBeenCalledWith('feature');
+        const retireBtn = screen.getByTitle('Retire Type');
+        await user.click(retireBtn);
+        expect(defaultSettingsModel.onRemoveType).toHaveBeenCalledWith('issue');
     });
-    it('4.15 Export workflows', async () => {
+    it('4.14ab Retired types can be restored', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            initialSection: 'types',
+            settingsModel: {
+                types: [
+                    { value: 'task', label: 'Task', color: 'blue-500', icon: 'CheckSquare', status: 'active' },
+                    { value: 'issue', label: 'Issue', color: 'red-500', icon: 'AlertCircle', status: 'retired' }
+                ]
+            }
+        });
+        const dropdown = screen.getByText('Select a type to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Issue (Retired)'));
+        const restoreBtn = screen.getByTitle('Restore Type');
+        await user.click(restoreBtn);
+        expect(defaultSettingsModel.onUpdateType).toHaveBeenCalledWith('issue', { status: 'active' });
+    });
+    it('4.14aa Protected fallback type cannot be retired', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            initialSection: 'types',
+            settingsModel: {
+                types: [
+                    { value: 'task', label: 'Task', color: 'blue-500', icon: 'CheckSquare' },
+                    { value: 'review', label: 'Review', color: 'violet-500', icon: 'Search' }
+                ]
+            }
+        });
+        const dropdown = screen.getByText('Select a type to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Task'));
+        expect(screen.queryByTitle('Retire Type')).not.toBeInTheDocument();
+        expect(screen.getByText('Task is the protected fallback type and cannot be retired.')).toBeInTheDocument();
+    });
+    it('4.14a Rename type', async () => {
+        const user = userEvent.setup();
+        renderComponent({ initialSection: 'types' });
+        const dropdown = screen.getByText('Select a type to configure...').closest('button');
+        await user.click(dropdown);
+        const option = screen.getByText('Task');
+        await user.click(option);
+        const labelInput = screen.getByDisplayValue('Task');
+        await user.clear(labelInput);
+        await user.type(labelInput, 'Action Item');
+        await user.tab();
+        expect(defaultSettingsModel.onUpdateType).toHaveBeenCalledWith('task', { label: 'Action Item' });
+    });
+    it('4.14b Update type color', async () => {
         const user = userEvent.setup();
+        renderComponent({ initialSection: 'types' });
+        const dropdown = screen.getByText('Select a type to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Task'));
+        await user.click(screen.getByTitle('green-500'));
+        expect(defaultSettingsModel.onUpdateType).toHaveBeenCalledWith('task', { color: 'green-500' });
+    });
+    it('4.15 Export workflows', async () => {
         renderComponent({ initialSection: 'commands' });
-        expect(screen.getByText('Commands')).toBeInTheDocument();
+        expect(screen.getByText('Command Workflows')).toBeInTheDocument();
+    });
+    it('4.14c Priority editor hides generic taxonomy controls', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        const priorityRow = screen.getByText('Priority Levels');
+        await user.click(priorityRow.closest('button'));
+        const dropdown = screen.getByText('Select a priority level to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Medium'));
+        expect(screen.queryByText('Mark as Required')).not.toBeInTheDocument();
+        expect(screen.queryByText('Allow Multi-select')).not.toBeInTheDocument();
+        expect(screen.queryByText('Widget Type')).not.toBeInTheDocument();
+        expect(screen.getByText(/fixed ordered scale/i)).toBeInTheDocument();
+    });
+    it('4.14c1 Taxonomy libraries are visible from the taxonomy settings list', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        expect(screen.getByRole('button', { name: /system taxonomy library/i })).toBeInTheDocument();
+        expect(screen.getByText(/browse curated packs for categories, task types, and priority scales/i)).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /custom taxonomy library/i })).toBeInTheDocument();
+    });
+    it('4.14c2 System Taxonomy Library opens preview and apply controls', async () => {
+        const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByRole('button', { name: /system taxonomy library/i }));
+        expect(screen.getByText('Browse starter packs before you replace anything.')).toBeInTheDocument();
+        expect(screen.getByText('Software Development')).toBeInTheDocument();
+        expect(screen.getByText('Apply Selected Sections')).toBeInTheDocument();
+        expect(screen.getByRole('checkbox', { name: 'Categories' })).toBeInTheDocument();
+        expect(screen.getByRole('checkbox', { name: 'Types' })).toBeInTheDocument();
+        expect(screen.getByRole('checkbox', { name: 'Priorities' })).toBeInTheDocument();
+        expect(screen.getByRole('checkbox', { name: /remap unmatched existing values to default/i })).toBeInTheDocument();
+    });
+    it('4.14c2b System Taxonomy Library applies a selected pack', async () => {
+        const user = userEvent.setup();
+        const onApplySystemTaxonomyPack = vi.fn(async () => ({ success: true }));
+        renderComponent({
+            settingsModel: {
+                onApplySystemTaxonomyPack
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByRole('button', { name: /system taxonomy library/i }));
+        await user.click(screen.getByRole('button', { name: 'Apply Pack' }));
+        expect(onApplySystemTaxonomyPack).toHaveBeenCalledWith(expect.objectContaining({
+            pack: expect.objectContaining({ id: 'general' }),
+            sections: {
+                categories: true,
+                types: true,
+                priorities: true
+            },
+            remapExistingValuesToDefault: false
+        }));
+        expect(await screen.findByText(/was applied to the selected taxonomy sections/i)).toBeInTheDocument();
+    });
+    it('4.14c2c System Taxonomy Library surfaces preflight warnings for unmatched values', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                onAnalyzeSystemTaxonomyPack: vi.fn(() => ({
+                    unmatchedCategoryValues: ['marketing'],
+                    unmatchedTypeValues: ['request', 'incident'],
+                    incompatiblePriorityValues: [4]
+                }))
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByRole('button', { name: /system taxonomy library/i }));
+        expect(screen.getByText(/1 category value will be preserved as legacy/i)).toBeInTheDocument();
+        expect(screen.getByText(/2 type values will be preserved as legacy/i)).toBeInTheDocument();
+        expect(screen.getByText(/priority replacement will be blocked unless you remap/i)).toBeInTheDocument();
     });
-    it('4.16 Export specialists', async () => {
+    it('4.14c3 Custom Taxonomy Library opens the custom pack browser', async () => {
         const user = userEvent.setup();
+        renderComponent();
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByRole('button', { name: /custom taxonomy library/i }));
+        expect(screen.getByText('Browse reusable custom taxonomy packs.')).toBeInTheDocument();
+        expect(screen.getByText('Choose Taxonomies to Install')).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: /install selected taxonomies/i })).toBeInTheDocument();
+    });
+    it('4.14d Retires custom taxonomy options instead of deleting them', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' },
+                            { value: 'legal-review', label: 'Legal Review', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const dropdown = screen.getByText('Select an option to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Legal Review'));
+        await user.click(screen.getByTitle('Retire Option'));
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                options: [
+                    expect.objectContaining({ value: 'pending', status: 'active' }),
+                    expect.objectContaining({ value: 'legal-review', status: 'retired' })
+                ]
+            })
+        ]);
+    });
+    it('4.14e Toggles custom taxonomy filter visibility', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        filterEnabled: true,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const filterToggle = screen.getByRole('checkbox', { name: 'Show in Filters' });
+        await user.click(filterToggle);
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                filterEnabled: false
+            })
+        ]);
+    });
+    it('4.14e1 Toggles custom taxonomy task-form visibility', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        formEnabled: true,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const formToggle = screen.getByRole('checkbox', { name: 'Show in Task Form' });
+        await user.click(formToggle);
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                formEnabled: false
+            })
+        ]);
+    });
+    it('4.14f Updates custom taxonomy description', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const descriptionInput = screen.getByPlaceholderText('Optional guidance for when and how to use this taxonomy...');
+        fireEvent.change(descriptionInput, { target: { value: 'Use this to track review routing.' } });
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                description: 'Use this to track review routing.'
+            })
+        ]);
+    });
+    it('4.14g Updates custom taxonomy aliases', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const aliasInputs = screen.getAllByPlaceholderText('Optional aliases, comma-separated');
+        fireEvent.change(aliasInputs[0], { target: { value: 'review route, routing' } });
+        fireEvent.blur(aliasInputs[0]);
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                aliases: ['review route', 'routing']
+            })
+        ]);
+    });
+    it('4.14h Updates custom taxonomy option aliases', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const dropdown = screen.getByText('Select an option to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Pending'));
+        const aliasInputs = screen.getAllByPlaceholderText('Optional aliases, comma-separated');
+        fireEvent.change(aliasInputs[1], { target: { value: 'queued, awaiting review' } });
+        fireEvent.blur(aliasInputs[1]);
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                options: [
+                    expect.objectContaining({
+                        value: 'pending',
+                        aliases: ['queued', 'awaiting review']
+                    })
+                ]
+            })
+        ]);
+    });
+    it('4.14i Retires whole custom taxonomies instead of deleting them', async () => {
+        vi.spyOn(window, 'confirm').mockImplementation(() => true);
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [{ value: 'pending', label: 'Pending', status: 'active' }]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        await user.click(screen.getByRole('button', { name: /retire taxonomy/i }));
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                status: 'retired'
+            })
+        ]);
+    });
+    it('4.14j Restores retired custom taxonomies', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        status: 'retired',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [{ value: 'pending', label: 'Pending', status: 'active' }]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText(/Review Status \(Retired\)/).closest('button'));
+        await user.click(screen.getByRole('button', { name: /restore taxonomy/i }));
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                status: 'active'
+            })
+        ]);
+    });
+    it('4.14k Reorders custom taxonomies from the list view', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [
+                    {
+                        id: 'alpha',
+                        label: 'Alpha',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: []
+                    },
+                    {
+                        id: 'beta',
+                        label: 'Beta',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: []
+                    }
+                ]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getAllByTitle('Move taxonomy down').find((button) => !button.hasAttribute('disabled')));
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({ id: 'beta' }),
+            expect.objectContaining({ id: 'alpha' })
+        ]);
+    });
+    it('4.14l Reorders custom taxonomy options from the detail view', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                taxonomies: [{
+                        id: 'review-status',
+                        label: 'Review Status',
+                        widgetType: 'select',
+                        isSystem: false,
+                        multiSelect: false,
+                        options: [
+                            { value: 'pending', label: 'Pending', status: 'active' },
+                            { value: 'approved', label: 'Approved', status: 'active' }
+                        ]
+                    }]
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /taxonomy/i }));
+        await user.click(screen.getByText('Review Status').closest('button'));
+        const dropdown = screen.getByText('Select an option to configure...').closest('button');
+        await user.click(dropdown);
+        await user.click(screen.getByText('Approved'));
+        await user.click(screen.getByTitle('Move option up'));
+        expect(defaultSettingsModel.onUpdateTaxonomies).toHaveBeenLastCalledWith([
+            expect.objectContaining({
+                id: 'review-status',
+                options: [
+                    expect.objectContaining({ value: 'approved' }),
+                    expect.objectContaining({ value: 'pending' })
+                ]
+            })
+        ]);
+    });
+    it('4.16 Agents section shows registered AI profiles', async () => {
         renderComponent({ initialSection: 'agents' });
-        expect(screen.getByText('Agents')).toBeInTheDocument();
+        expect(screen.getByText('Registered AI Profiles')).toBeInTheDocument();
     });
     it('4.17 initialSection navigates to detail view', () => {
         renderComponent({ initialSection: 'categories' });
@@ -272,37 +821,662 @@ describe('TaskSettings Component', () => {
         expect(screen.getByText('Categories')).toBeInTheDocument();
         expect(screen.queryByText('System Taxonomies')).not.toBeInTheDocument();
     });
-    it('4.18 documents tab opens and notifies section change', async () => {
-        const user = userEvent.setup();
-        const onSectionChange = vi.fn();
-        renderComponent({ onSectionChange });
-        await user.click(screen.getByRole('button', { name: /Documents/i }));
-        expect(onSectionChange).toHaveBeenCalledWith('documents');
+    it('4.18 legacy documents initialSection falls back to general tab', () => {
+        renderComponent({ initialSection: 'documents' });
+        expect(screen.getByRole('button', { name: /General/i })).toBeInTheDocument();
+        expect(screen.queryByText('Cloud Document Storage')).not.toBeInTheDocument();
     });
-    it('4.19 document admin controls are not rendered in general tab', () => {
+    it('4.19 document settings copy is not rendered in settings', () => {
         renderComponent();
         expect(screen.queryByText('Document Storage (Admin)')).not.toBeInTheDocument();
+        expect(screen.queryByText('Local Documents')).not.toBeInTheDocument();
+        expect(screen.queryByText('Cloud Document Storage')).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Open App Admin' })).not.toBeInTheDocument();
     });
-    it('4.20 Documents tab routes cloud system settings to app admin for authenticated users', async () => {
-        const fetchMock = vi.fn(async () => ({
+    it('4.20 Cloud runtime shows cloud MCP only', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'cloud',
+                isAuthenticated: true,
+                cloudAuthBaseUrl: 'https://cloud.example.com',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText('Cloud MCP Configuration')).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Generate Token' })).toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Local MCP' })).not.toBeInTheDocument();
+        expect(screen.queryByText('MCP Path Mapping (Host Root)')).not.toBeInTheDocument();
+        expect(fetchCloudAuthApi).toHaveBeenCalledWith('/api/taskforce/settings/mcp/tokens', expect.objectContaining({
+            method: 'GET',
+            credentials: 'include'
+        }));
+    }, 10000);
+    it('4.21 Local authenticated runtime defaults MCP tab to cloud with toggle', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
             ok: true,
-            json: async () => ({ objectStorage: { provider: 'r2' } })
+            json: async () => ({ items: [] })
         }));
-        vi.stubGlobal('fetch', fetchMock);
         const user = userEvent.setup();
-        renderComponent({ settingsModel: { isAuthenticated: true } });
-        await user.click(screen.getByRole('button', { name: /Documents/i }));
-        expect(await screen.findByDisplayValue('Cloud (R2)')).toBeInTheDocument();
-        expect(screen.getByText('Cloud Document Storage')).toBeInTheDocument();
-        expect(screen.getByText('System-level cloud storage and integrity controls are managed in App Admin.')).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Open App Admin' })).toBeInTheDocument();
-        vi.unstubAllGlobals();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                cloudAuthBaseUrl: 'https://cloud.example.com',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByRole('button', { name: 'Cloud MCP' })).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Local MCP' })).toBeInTheDocument();
+        expect(screen.getByText('Cloud MCP Configuration')).toBeInTheDocument();
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+        expect(screen.queryByText('MCP Path Mapping (Host Root)')).not.toBeInTheDocument();
+        await user.click(screen.getByRole('button', { name: 'Local MCP' }));
+        expect(screen.queryByText('MCP Path Mapping (Host Root)')).not.toBeInTheDocument();
+        await user.click(screen.getByRole('button', { name: 'Advanced' }));
+        expect(screen.getByText('MCP Path Mapping (Host Root)')).toBeInTheDocument();
+        expect(fetchCloudAuthApi).toHaveBeenCalledWith('/api/taskforce/settings/mcp/tokens', expect.objectContaining({
+            method: 'GET',
+            credentials: 'include'
+        }));
+    }, 10000);
+    it('4.23b MCP token creation uses the provided cloud auth helper', async () => {
+        const fetchCloudAuthApi = vi.fn(async (path, init) => {
+            if (path === '/api/taskforce/settings/mcp/tokens' && init?.method === 'POST') {
+                return {
+                    ok: true,
+                    json: async () => ({
+                        token: 'tfmcp_example_secret',
+                        record: {
+                            id: 'mcp-token-1',
+                            name: 'Workspace Alpha MCP',
+                            tokenPrefix: 'tfmcp_example',
+                            scopes: ['tasks:read', 'tasks:write'],
+                            status: 'active',
+                            createdAt: new Date().toISOString()
+                        }
+                    })
+                };
+            }
+            return {
+                ok: true,
+                json: async () => ({ items: [] })
+            };
+        });
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.click(await screen.findByRole('button', { name: 'Generate Token' }));
+        expect(fetchCloudAuthApi).toHaveBeenCalledWith('/api/taskforce/settings/mcp/tokens', expect.objectContaining({
+            method: 'POST',
+            credentials: 'include'
+        }));
+        expect((await screen.findAllByText('tfmcp_example_secret')).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23c MCP token name defaults to the workspace name', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha'
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByDisplayValue('Workspace Alpha MCP')).toBeInTheDocument();
     });
-    it('4.21 Documents tab hides cloud controls when user is not signed in', async () => {
+    it('4.23d MCP test connection uses the provided cloud auth helper', async () => {
+        const fetchCloudAuthApi = vi.fn(async (path, init) => {
+            if (path === '/api/taskforce/settings/mcp/test-connection') {
+                return {
+                    ok: true,
+                    json: async () => ({
+                        result: {
+                            workspaceName: 'Workspace Alpha',
+                            workspaceId: 'workspace-alpha',
+                            scopes: ['tasks:read', 'tasks:write']
+                        }
+                    })
+                };
+            }
+            return {
+                ok: true,
+                json: async () => ({ items: [] })
+            };
+        });
         const user = userEvent.setup();
-        renderComponent({ settingsModel: { isAuthenticated: false } });
-        await user.click(screen.getByRole('button', { name: /Documents/i }));
-        expect(screen.getByText('Sign in to access cloud document storage controls in App Admin.')).toBeInTheDocument();
-        expect(screen.queryByRole('button', { name: 'Open App Admin' })).not.toBeInTheDocument();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.click(screen.getByRole('button', { name: 'Test Connection' }));
+        await user.type(await screen.findByPlaceholderText('tfmcp_xxxxx_replace-me'), 'tfmcp_example_secret');
+        await user.click(screen.getAllByRole('button', { name: 'Test Connection' })[1]);
+        expect(fetchCloudAuthApi).toHaveBeenCalledWith('/api/taskforce/settings/mcp/test-connection', expect.objectContaining({
+            method: 'POST',
+            credentials: 'include'
+        }));
+        expect(await screen.findByText('Connection looks good for this workspace.')).toBeInTheDocument();
+        expect(screen.getByText(/Granted scopes: tasks:read, tasks:write/i)).toBeInTheDocument();
+    }, 10000);
+    it('4.23e Antigravity uses serverUrl instead of transport in the cloud snippet', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'antigravity');
+        const snippetMatches = await screen.findAllByText(/serverUrl/);
+        expect(snippetMatches.length).toBeGreaterThan(0);
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+        expect(screen.queryByText(/"transport"/)).not.toBeInTheDocument();
+    }, 10000);
+    it('4.23e1 falls back to the dedicated MCP hostname when only the cloud app host is configured', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudAuthBaseUrl: 'https://performance-app.taskforcehq.ai',
+                cloudMcpBaseUrl: '',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText(/https:\/\/performance-mcp\.taskforcehq\.ai\/mcp/)).toBeInTheDocument();
+        expect(screen.queryByText(/https:\/\/performance-app\.taskforcehq\.ai\/mcp/)).not.toBeInTheDocument();
+    }, 10000);
+    it('4.23e1b prefers the dedicated MCP hostname even when cloudMcpBaseUrl is stale and points at the app host', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudAuthBaseUrl: 'https://performance-app.taskforcehq.ai',
+                cloudMcpBaseUrl: 'https://performance-app.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText(/https:\/\/performance-mcp\.taskforcehq\.ai\/mcp/)).toBeInTheDocument();
+        expect(screen.queryByText(/https:\/\/performance-app\.taskforcehq\.ai\/mcp/)).not.toBeInTheDocument();
+    }, 10000);
+    it('4.23e2 Cursor uses top-level url instead of transport in the cloud config', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        const urlMatches = await screen.findAllByText(/"url"/);
+        expect(urlMatches.length).toBeGreaterThan(0);
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+        expect(screen.queryByText(/"transport"/)).not.toBeInTheDocument();
+        expect(screen.queryByText(/serverUrl/)).not.toBeInTheDocument();
+    }, 10000);
+    it('4.23e2b Cline uses streamableHttp in the cloud config', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'cline');
+        expect(await screen.findByText(/Cline Configuration Instructions/i)).toBeInTheDocument();
+        expect(screen.getByText(/"type"/)).toBeInTheDocument();
+        expect(screen.getByText(/streamableHttp/)).toBeInTheDocument();
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23e2c VS Code uses servers with http transport in the cloud config', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'vscode');
+        expect(await screen.findByText(/VS Code Configuration Instructions/i)).toBeInTheDocument();
+        expect(screen.getByText(/"servers"/)).toBeInTheDocument();
+        expect(screen.getByText(/"type"/)).toBeInTheDocument();
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23e3 Codex shows config.toml MCP output', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'codex');
+        expect((await screen.findAllByText(/\.codex\/config\.toml/i)).length).toBeGreaterThan(0);
+        expect(screen.getByText(/\[mcp_servers\./)).toBeInTheDocument();
+        expect(screen.getByText(/http_headers = \{ Authorization = "Bearer/i)).toBeInTheDocument();
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23e3a Codex MCP output includes optional automation identity headers', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'codex');
+        await user.type(screen.getByPlaceholderText('Automation Codex'), 'Automation Codex');
+        await user.type(screen.getByPlaceholderText('tfp_...'), 'tfp_automation_codex');
+        expect(await screen.findByText(/X-Taskforce-AI-Name = "Automation Codex"/i)).toBeInTheDocument();
+        expect(screen.getByText(/X-Taskforce-AI-Profile-Token = "tfp_automation_codex"/i)).toBeInTheDocument();
+    }, 10000);
+    it('4.23e3aa MCP tab can prefill automation identity from an existing AI profile', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const fetchMock = vi.fn(async (input) => {
+            const url = String(input);
+            if (url.includes('/api/taskforce/workspace/assignee-options')) {
+                return {
+                    ok: true,
+                    json: async () => ({
+                        assignees: [
+                            {
+                                value: 'ai-profile-123',
+                                label: 'Automation Codex',
+                                profileToken: 'tfp_automation_codex',
+                                username: 'automation-codex',
+                                icon: 'Bot',
+                                color: '#6B7280',
+                                kind: 'agent',
+                            }
+                        ]
+                    })
+                };
+            }
+            throw new Error(`Unexpected fetch call: ${url}`);
+        });
+        global.fetch = fetchMock;
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                workspaceId: 'workspace-alpha',
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(await screen.findByRole('combobox', { name: 'Use existing AI profile' }), 'ai-profile-123');
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'codex');
+        expect(await screen.findByDisplayValue('Automation Codex')).toBeInTheDocument();
+        expect(screen.getByDisplayValue('tfp_automation_codex')).toBeInTheDocument();
+        expect(screen.getByText(/X-Taskforce-AI-Name = "Automation Codex"/i)).toBeInTheDocument();
+        expect(screen.getByText(/X-Taskforce-AI-Profile-Token = "tfp_automation_codex"/i)).toBeInTheDocument();
+        global.fetch = originalFetch;
+    }, 10000);
+    it('4.23e3b Claude Code shows a remote MCP add command', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'claude-code');
+        expect(await screen.findByText(/Claude Code Configuration Instructions/i)).toBeInTheDocument();
+        expect(screen.getByText(/claude mcp add --transport http/i)).toBeInTheDocument();
+        expect(screen.getByText(/claude mcp add --transport http taskforce-/i)).toBeInTheDocument();
+        expect(screen.getByText(/--header "Authorization: Bearer/i)).toBeInTheDocument();
+    }, 10000);
+    it('4.23e3c Gemini CLI shows a remote MCP add command', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'gemini-cli');
+        expect(await screen.findByText(/Gemini CLI Configuration Instructions/i)).toBeInTheDocument();
+        expect(screen.getByText(/gemini mcp add taskforce-/i)).toBeInTheDocument();
+        expect(screen.getByText(/--transport http/i)).toBeInTheDocument();
+        expect(screen.getByText(/--header "Authorization: Bearer/i)).toBeInTheDocument();
+        expect(screen.getByText(/Add --scope user if you want it available across all projects/i)).toBeInTheDocument();
+    }, 10000);
+    it('4.23e3d OpenClaw shows an openclaw.json MCP snippet', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await user.selectOptions(screen.getByRole('combobox', { name: 'MCP client' }), 'openclaw');
+        expect(await screen.findByText(/OpenClaw Configuration Instructions/i)).toBeInTheDocument();
+        expect((await screen.findAllByText(/~\/\.openclaw\/openclaw\.json/i)).length).toBeGreaterThan(0);
+        const configBlocks = Array.from(document.querySelectorAll('pre code'));
+        const openClawConfigBlock = configBlocks.find((block) => block.textContent?.includes('https://mcp.taskforcehq.ai/mcp'));
+        expect(openClawConfigBlock?.textContent).toContain('"mcp"');
+        expect(openClawConfigBlock?.textContent).toContain('"servers"');
+        expect(openClawConfigBlock?.textContent).toContain('"transport": "streamable-http"');
+        expect(openClawConfigBlock?.textContent).toContain('"Authorization": "Bearer');
+        expect(screen.getAllByText(/https:\/\/mcp\.taskforcehq\.ai\/mcp/).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23e4 Cloud selector excludes desktop OAuth clients from the MCP client list', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(screen.queryByRole('option', { name: /Claude Desktop/i })).not.toBeInTheDocument();
+        expect(screen.queryByRole('option', { name: /ChatGPT Desktop/i })).not.toBeInTheDocument();
+        expect(await screen.findByText('Cursor Configuration Instructions')).toBeInTheDocument();
+    }, 10000);
+    it('4.23e4b Integrations tab shows ChatGPT and Claude connector management separately from PAT tokens', async () => {
+        const fetchCloudAuthApi = vi.fn(async (path) => {
+            if (path.startsWith('/api/taskforce/settings/mcp/connectors')) {
+                return {
+                    ok: true,
+                    json: async () => ({
+                        items: [
+                            {
+                                id: 'grant-1',
+                                provider: 'chatgpt',
+                                clientId: 'client-1',
+                                clientName: 'ChatGPT Connector',
+                                workspaceId: 'workspace-alpha',
+                                userId: 'user-1',
+                                scopes: ['tasks:read', 'tasks:write', 'workspace:read'],
+                                status: 'active',
+                                createdAt: '2026-03-14T12:00:00.000Z',
+                                lastUsedAt: null,
+                            },
+                            {
+                                id: 'grant-2',
+                                provider: 'claude',
+                                clientId: 'client-2',
+                                clientName: 'Claude Desktop Connector',
+                                workspaceId: 'workspace-alpha',
+                                userId: 'user-1',
+                                scopes: ['tasks:read', 'tasks:write', 'workspace:read'],
+                                status: 'active',
+                                createdAt: '2026-03-14T13:00:00.000Z',
+                                lastUsedAt: null,
+                            }
+                        ]
+                    })
+                };
+            }
+            return {
+                ok: true,
+                json: async () => ({ items: [] })
+            };
+        });
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /Integrations/i }));
+        expect(await screen.findByRole('heading', { name: 'Integrations' })).toBeInTheDocument();
+        expect(await screen.findByText('ChatGPT Connector')).toBeInTheDocument();
+        expect(await screen.findByText('Claude Desktop Connector')).toBeInTheDocument();
+        expect(screen.getAllByText(/Taskforce handles OAuth and binds each connector authorization/i)).toHaveLength(2);
+        expect(screen.getAllByRole('button', { name: /Disconnect/i })).toHaveLength(2);
+    }, 10000);
+    it('4.23e4c MCP tab no longer shows connector management cards', async () => {
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({ items: [] })
+        }));
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText('Cloud MCP Configuration')).toBeInTheDocument();
+        expect(screen.queryByText('ChatGPT Connector')).not.toBeInTheDocument();
+        expect(screen.queryByText(/^Connectors$/)).not.toBeInTheDocument();
+    }, 10000);
+    it('4.23g Cloud MCP configuration offers snippet and full-config copy actions', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText('Cloud MCP Configuration')).toBeInTheDocument();
+        expect(screen.getAllByRole('button', { name: /copy/i }).length).toBeGreaterThan(0);
+    }, 10000);
+    it('4.23g1 Cloud MCP copy warns before a token is generated', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await screen.findByText('Cloud MCP Configuration');
+        await user.click(screen.getByTitle('Copy full configuration file'));
+        expect(screen.getByText('Generate a token before copying the Cloud MCP configuration.')).toBeInTheDocument();
+    }, 10000);
+    it('4.23h Active tokens sort first and revoked tokens do not show revoke or regenerate actions', async () => {
+        const user = userEvent.setup();
+        const fetchCloudAuthApi = vi.fn(async () => ({
+            ok: true,
+            json: async () => ({
+                items: [
+                    {
+                        id: 'token-revoked',
+                        name: 'Old Token',
+                        scopes: ['tasks:read'],
+                        tokenPrefix: 'tfmcp_old',
+                        status: 'revoked',
+                        createdAt: '2026-03-01T00:00:00.000Z',
+                        lastUsedAt: null,
+                    },
+                    {
+                        id: 'token-active',
+                        name: 'Current Token',
+                        scopes: ['tasks:read', 'tasks:write'],
+                        tokenPrefix: 'tfmcp_new',
+                        status: 'active',
+                        createdAt: '2026-03-02T00:00:00.000Z',
+                        lastUsedAt: null,
+                    }
+                ]
+            })
+        }));
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                currentWorkspaceName: 'Workspace Alpha',
+                fetchCloudAuthApi
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(await screen.findByText('Current Token')).toBeInTheDocument();
+        expect(screen.getByText('Old Token')).toBeInTheDocument();
+        const tokenLabels = screen.getAllByText(/^(Current Token|Old Token)$/);
+        expect(tokenLabels[0]).toHaveTextContent('Current Token');
+        expect(tokenLabels[1]).toHaveTextContent('Old Token');
+        expect(screen.getAllByRole('button', { name: 'Regenerate' })).toHaveLength(1);
+        expect(screen.getAllByRole('button', { name: 'Revoke' })).toHaveLength(1);
+    }, 10000);
+    it('4.23f Cloud MCP snippet keeps the server id short enough for client tool-name limits', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: true,
+                workspaceId: 'workspace-019c771a-b6d7-7bc8-b837-c1133f3ba7a2',
+                currentWorkspaceName: 'Workspace Alpha',
+                cloudMcpBaseUrl: 'https://mcp.taskforcehq.ai',
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        await screen.findByText('Cloud MCP Configuration');
+        const codeNodes = Array.from(document.querySelectorAll('code'));
+        const snippetNode = codeNodes.find((node) => node.textContent?.includes('"mcpServers"'));
+        expect(snippetNode).toBeTruthy();
+        const parsed = JSON.parse(snippetNode?.textContent || '{}');
+        const serverId = Object.keys(parsed?.mcpServers || {})[0] || '';
+        expect(serverId.startsWith('taskforce-')).toBe(true);
+        expect(serverId.length).toBeLessThanOrEqual(33);
+        expect(`mcp_${serverId}_set_schedule_preferences`.length).toBeLessThanOrEqual(64);
+    }, 10000);
+    it('4.24 Local signed-out runtime shows local MCP only', async () => {
+        const user = userEvent.setup();
+        renderComponent({
+            settingsModel: {
+                runtimeMode: 'local',
+                isAuthenticated: false
+            }
+        });
+        await user.click(screen.getByRole('button', { name: /MCP/i }));
+        expect(screen.getByText('Local MCP')).toBeInTheDocument();
+        expect(screen.getByText(/Claude Code CLI, Gemini CLI/i)).toBeInTheDocument();
+        expect(screen.queryByText('MCP Path Mapping (Host Root)')).not.toBeInTheDocument();
+        await user.click(screen.getByRole('button', { name: 'Advanced' }));
+        expect(screen.getByText('MCP Path Mapping (Host Root)')).toBeInTheDocument();
+        expect(screen.queryByText('Cloud MCP Configuration')).not.toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Cloud MCP' })).not.toBeInTheDocument();
     });
 });