refactor: move SidebarTrigger to header left, flatten system settings into sidebar

web/default/src/components/layout/components/app-header.tsx

@@ -23,6 +23,7 @@ import { LanguageSwitcher } from '@/components/language-switcher'
 import { NotificationPopover } from '@/components/notification-popover'
 import { ProfileDropdown } from '@/components/profile-dropdown'
 import { Search } from '@/components/search'
+import { SidebarTrigger } from '@/components/ui/sidebar'
 import { defaultTopNavLinks } from '../config/top-nav.config'
 import { type TopNavLink } from '../types'
 import { Header } from './header'
@@ -111,6 +112,8 @@ export function AppHeader({
   return (
     <>
       <Header>
+        <SidebarTrigger variant='ghost' className='size-8' />
+
         {leftContent ? (
           <div className='ms-2 flex items-center'>{leftContent}</div>
         ) : null}

web/default/src/components/layout/components/app-sidebar.tsx

@@ -20,7 +20,7 @@ import { AnimatePresence, motion, useReducedMotion } from 'motion/react'
 import { MOTION_TRANSITION, MOTION_VARIANTS } from '@/lib/motion'
 import { useLayout } from '@/context/layout-provider'
 import { useSidebarView } from '@/hooks/use-sidebar-view'
-import { Sidebar, SidebarContent, SidebarHeader, SidebarRail, SidebarTrigger } from '@/components/ui/sidebar'
+import { Sidebar, SidebarContent, SidebarHeader, SidebarRail } from '@/components/ui/sidebar'
 import { NavGroup } from './nav-group'
 import { SidebarViewHeader } from './sidebar-view-header'
 import { SystemBrand } from './system-brand'
@@ -51,7 +51,6 @@ export function AppSidebar() {
     <Sidebar collapsible={collapsible} variant={variant}>
       <SidebarHeader className='flex flex-row items-center gap-1 px-2'>
         <SystemBrand variant='sidebar' />
-        <SidebarTrigger variant='ghost' className='size-8 ms-auto' />
       </SidebarHeader>
 
       {view && <SidebarViewHeader view={view} />}

web/default/src/components/layout/lib/sidebar-view-registry.ts

@@ -17,7 +17,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 For commercial licensing, please contact admin@modelstoken.com
 */
 import { type TFunction } from 'i18next'
-import { SYSTEM_SETTINGS_VIEW } from '../config/system-settings.config'
 import type { NavGroup, SidebarView } from '../types'
 
 /**
@@ -29,7 +28,7 @@ import type { NavGroup, SidebarView } from '../types'
  *
  * Match priority is array order; the first matching `pathPattern` wins.
  */
-const SIDEBAR_VIEWS: readonly SidebarView[] = [SYSTEM_SETTINGS_VIEW]
+const SIDEBAR_VIEWS: readonly SidebarView[] = []
 
 /**
  * Resolve the active nested view for the given path.

web/default/src/hooks/use-sidebar-config.ts

@@ -119,6 +119,12 @@ const URL_TO_CONFIG_MAP: Record<string, { section: string; module: string }> = {
   '/subscriptions': { section: 'admin', module: 'subscription' },
   '/system-settings': { section: 'admin', module: 'setting' },
   '/system-settings/site': { section: 'admin', module: 'setting' },
+  '/system-settings/auth': { section: 'admin', module: 'setting' },
+  '/system-settings/billing': { section: 'admin', module: 'setting' },
+  '/system-settings/models': { section: 'admin', module: 'setting' },
+  '/system-settings/security': { section: 'admin', module: 'setting' },
+  '/system-settings/content': { section: 'admin', module: 'setting' },
+  '/system-settings/operations': { section: 'admin', module: 'setting' },
 }
 
 /**

web/default/src/hooks/use-sidebar-data.ts

@@ -24,18 +24,29 @@ import {
   FlaskConical,
   FolderOpen,
   Key,
+  Layout,
   LayoutDashboard,
   ListTodo,
   MessageSquare,
   Radio,
   Settings,
+  Shield,
+  ShieldAlert,
   Ticket,
   User,
   Users,
   Wallet,
+  Wrench,
 } from 'lucide-react'
 import { useTranslation } from 'react-i18next'
 import { type SidebarData } from '@/components/layout/types'
+import { getAuthSectionNavItems } from '@/features/system-settings/auth/section-registry'
+import { getBillingSectionNavItems } from '@/features/system-settings/billing/section-registry'
+import { getContentSectionNavItems } from '@/features/system-settings/content/section-registry'
+import { getModelsSectionNavItems } from '@/features/system-settings/models/section-registry'
+import { getOperationsSectionNavItems } from '@/features/system-settings/operations/section-registry'
+import { getSecuritySectionNavItems } from '@/features/system-settings/security/section-registry'
+import { getSiteSectionNavItems } from '@/features/system-settings/site/section-registry'
 
 /**
  * Root navigation groups for the application sidebar.
@@ -153,10 +164,39 @@ export function useSidebarData(): SidebarData {
             icon: CreditCard,
           },
           {
-            title: t('System Settings'),
+            title: t('Site & Branding'),
-            url: '/system-settings/site',
-            activeUrls: ['/system-settings'],
             icon: Settings,
+            items: getSiteSectionNavItems(t),
+          },
+          {
+            title: t('Authentication'),
+            icon: Shield,
+            items: getAuthSectionNavItems(t),
+          },
+          {
+            title: t('Billing & Payment'),
+            icon: CreditCard,
+            items: getBillingSectionNavItems(t),
+          },
+          {
+            title: t('Models & Routing'),
+            icon: Box,
+            items: getModelsSectionNavItems(t),
+          },
+          {
+            title: t('Security & Limits'),
+            icon: ShieldAlert,
+            items: getSecuritySectionNavItems(t),
+          },
+          {
+            title: t('Console Content'),
+            icon: Layout,
+            items: getContentSectionNavItems(t),
+          },
+          {
+            title: t('Operations'),
+            icon: Wrench,
+            items: getOperationsSectionNavItems(t),
           },
         ],
       },