feat(ui): добавить новый маршрут и интерфейс для настроек внешнего вида

Добавлен новый маршрут для страницы настроек внешнего вида в интерфейсе. Обновлены компоненты навигации и заголовка для поддержки нового маршрута. Включены изменения в документацию и интерфейсы для отображения новых элементов управления. Также добавлена поддержка отображения быстрого доступа к разделам в панели управления.

apps/web/src/components/layout/site-header.tsx

@@ -9,6 +9,7 @@ import {
   BreadcrumbSeparator,
 } from '@cfdm/ui/components/breadcrumb'
 import { ModeToggle } from '@/components/mode-toggle'
+import { SystemMonitorPopover } from '@/components/layout/system-monitor-popover'
 import { AppsMenu } from '@/components/layout/apps-menu'
 import { SearchMenu } from '@/components/layout/search-menu'
 import { SidebarTrigger } from '@cfdm/ui/components/sidebar'
@@ -23,6 +24,7 @@ const routeTitles: Record<string, string> = {
   '/groups': 'Группы доменов',
   '/services': 'Сервисы',
   '/certificates': 'Сертификаты',
+  '/settings/appearance': 'Внешний вид',
   '/settings/integrations': 'Интеграции',
 }
 
@@ -60,10 +62,12 @@ function getBreadcrumbs(
 
   if (pathname.startsWith('/settings')) {
     return [
-      { label: 'Настройки', href: '/settings/integrations' },
+      { label: 'Настройки', href: '/settings/appearance' },
       ...(pathname === '/settings/integrations'
         ? [{ label: 'Интеграции', href: pathname }]
-        : []),
+        : pathname === '/settings/appearance'
+          ? [{ label: 'Внешний вид', href: pathname }]
+          : []),
     ]
   }
 
@@ -127,6 +131,7 @@ export function SiteHeader() {
       <div className="text-muted-foreground [&_button_svg]:text-muted-foreground [&_button:active_svg]:text-foreground! [&_button:hover>span>svg]:text-foreground! [&_button:hover>svg]:text-foreground! [&_button[aria-expanded=true]_svg]:text-foreground! [&_button[data-popup-open]_svg]:text-foreground! ml-auto flex items-center gap-2">
         <SearchMenu />
         <AppsMenu />
+        <SystemMonitorPopover />
         <ModeToggle />
       </div>
     </header>