PR16: ConfigurationManager with Hierarchical Config Support

api/admin_ui/src/App.tsx

@@ -33,6 +33,7 @@ import ListAltIcon from '@mui/icons-material/ListAlt';
 import InboxIcon from '@mui/icons-material/Inbox';
 import VpnKeyIcon from '@mui/icons-material/VpnKey';
 import CodeIcon from '@mui/icons-material/Code';
+import TuneIcon from '@mui/icons-material/Tune';
 import TerminalIcon from '@mui/icons-material/Terminal';
 import AssessmentIcon from '@mui/icons-material/Assessment';
 import DescriptionIcon from '@mui/icons-material/Description';
@@ -60,6 +61,7 @@ import TunnelSettings from './components/TunnelSettings';
 import ProviderSetupWizard from './components/ProviderSetupWizard';
 import InboundWebhookTester from './components/InboundWebhookTester';
 import OutboundSmokeTests from './components/OutboundSmokeTests';
+import ConfigurationManager from './components/ConfigurationManager';
 import { ThemeProvider } from './theme/ThemeContext';
 import { ThemeToggle } from './components/ThemeToggle';
 
@@ -293,6 +295,7 @@ function AppContent() {
   const settingsItems = [
     { label: 'Setup', icon: <HelpIcon /> },
     { label: 'Settings', icon: <SettingsIcon /> },
+    { label: 'Configuration', icon: <TuneIcon /> },
     { label: 'Keys', icon: <VpnKeyIcon /> },
     { label: 'MCP', icon: <CodeIcon /> },
   ];
@@ -776,8 +779,9 @@ function AppContent() {
                   <Settings client={client!} readOnly={!hasTrait('role.admin')} />
                 </Box>
               )}
-              {settingsTab === 2 && <ApiKeys client={client!} readOnly={!hasTrait('role.admin')} />}
-              {settingsTab === 3 && <MCP client={client!} />}
+              {settingsTab === 2 && <ConfigurationManager client={client!} docsBase={uiConfig?.docs_base || adminConfig?.branding?.docs_base} />}
+              {settingsTab === 3 && <ApiKeys client={client!} readOnly={!hasTrait('role.admin')} />}
+              {settingsTab === 4 && <MCP client={client!} />}
             </Box>
           </Paper>
         </TabPanel>

api/admin_ui/src/api/client.ts

@@ -160,6 +160,35 @@ export class AdminAPIClient {
     return res.json();
   }
 
+  // v4 Config (read-only baseline)
+  async v4GetEffective(payload: { keys?: string[]; user_id?: string; tenant_id?: string; department?: string; groups?: string[] } = {}): Promise<{ schema_version: number; items: Record<string, any> }>{
+    const res = await this.fetch('/admin/config/v4/effective', {
+      method: 'POST',
+      body: JSON.stringify(payload || {}),
+    });
+    return res.json();
+  }
+
+  async v4GetHierarchy(payload: { key: string; user_id?: string; tenant_id?: string; department?: string; groups?: string[] }): Promise<any>{
+    const res = await this.fetch('/admin/config/v4/hierarchy', {
+      method: 'POST',
+      body: JSON.stringify(payload || {}),
+    });
+    return res.json();
+  }
+
+  async v4GetSafeKeys(): Promise<Record<string, any>>{
+    const res = await this.fetch('/admin/config/v4/safe-keys');
+    return res.json();
+  }
+
+  async v4FlushCache(scope: string = '*'): Promise<{ ok: boolean; deleted?: number | null; scope: string; backend?: string }>{
+    const res = await this.fetch(`/admin/config/v4/flush-cache?scope=${encodeURIComponent(scope)}`, {
+      method: 'POST',
+    });
+    return res.json();
+  }
+
   // User traits (admin-only)
   async getUserTraits(): Promise<{ schema_version: number; user: { id: string }; traits: string[] }>{
     const res = await this.fetch('/admin/user/traits');