add /settings/ai route with role-aware model management

Two-tier model policy: system policy (admin, allowedModels) controls
member access, per-user hiddenModels controls personal visibility.
All model selectors now use useUserVisibleModels. Moved providers
and model visibility out of system settings, AI models out of profile.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/apps/officer-web/Screens/Dashboard/Settings/ProfileSettings/AIModels.tsx

@@ -12,7 +12,7 @@ import {
   SelectValue,
 } from '@/components/ui/select';
 import { useSettings } from 'state/useSettings';
-import { useEnabledPiModels, getProviderDisplayName, type ModelOption } from 'state/useModels';
+import { useUserVisibleModels, getProviderDisplayName, type ModelOption } from 'state/useModels';
 
 function buildGroups(models: ModelOption[]) {
   const groups: Record<string, { id: string; name: string }[]> = {};
@@ -30,7 +30,7 @@ const NONE = '__none__';
 
 export const AIModels = () => {
   const { settings, saveSettings } = useSettings();
-  const piModels = useEnabledPiModels();
+  const piModels = useUserVisibleModels();
   const [isSaving, setIsSaving] = useState(false);
 
   const [chatModel, setChatModel] = useState<string | null>(settings.chat.defaultModel);

src/apps/officer-web/Screens/Dashboard/Settings/ProfileSettings/TaskDefaults.tsx

@@ -12,11 +12,11 @@ import {
   SelectValue,
 } from '@/components/ui/select';
 import { useSettings } from 'state/useSettings';
-import { useVisiblePiModels, type ModelOption } from 'state/useModels';
+import { useUserVisibleModels, type ModelOption } from 'state/useModels';
 
 export const TaskDefaults = () => {
   const { settings, saveSettings } = useSettings();
-  const piModels = useVisiblePiModels();
+  const piModels = useUserVisibleModels();
   const [isSaving, setIsSaving] = useState(false);
 
   const [model, setModel] = useState<string | null>(settings.tasks.defaultModel);

src/apps/officer-web/Screens/Dashboard/Settings/ProfileSettings/index.tsx

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { User, Lock, Globe, Bot, LayoutGrid, Volume2 } from 'lucide-react';
+import { User, Lock, Globe, LayoutGrid, Volume2 } from 'lucide-react';
 import type { LayoutNode, PanelComponents } from 'officerdev';
 import { WorkspaceLayout } from 'officerdev';
 
@@ -7,7 +7,6 @@ import { createSettingsPanelComponents, type SettingsSection } from '../Settings
 import { UserData } from './UserData';
 import { ChangePassword } from './ChangePassword';
 import { Languages } from './Languages';
-import { AIModels } from './AIModels';
 import { DockSettings } from './DockSettings';
 import { VoicePreference } from './VoicePreference';
 
@@ -15,11 +14,34 @@ const GLOBAL_KEY = 'PROFILE_SETTINGS_SELECTED';
 
 const sections: SettingsSection[] = [
   { key: 'profile', icon: User, title: 'Profile', description: 'Avatar, name, and email', content: <UserData /> },
-  { key: 'change-password', icon: Lock, title: 'Change Password', description: 'Update your password', content: <ChangePassword /> },
-  { key: 'ai-models', icon: Bot, title: 'AI Models', description: 'Default models for chat, projects, and tasks', content: <AIModels /> },
-  { key: 'languages', icon: Globe, title: 'Languages', description: 'Spoken, default, and translation', content: <Languages /> },
-  { key: 'voice', icon: Volume2, title: 'Voice', description: 'Text-to-speech voice preference', content: <VoicePreference /> },
-  { key: 'dock', icon: LayoutGrid, title: 'Dock', description: 'Choose and reorder dock items', content: <DockSettings /> },
+  {
+    key: 'change-password',
+    icon: Lock,
+    title: 'Change Password',
+    description: 'Update your password',
+    content: <ChangePassword />,
+  },
+  {
+    key: 'languages',
+    icon: Globe,
+    title: 'Languages',
+    description: 'Spoken, default, and translation',
+    content: <Languages />,
+  },
+  {
+    key: 'voice',
+    icon: Volume2,
+    title: 'Voice',
+    description: 'Text-to-speech voice preference',
+    content: <VoicePreference />,
+  },
+  {
+    key: 'dock',
+    icon: LayoutGrid,
+    title: 'Dock',
+    description: 'Choose and reorder dock items',
+    content: <DockSettings />,
+  },
 ];
 
 const { Sidebar, Content } = createSettingsPanelComponents({