refactor(ui): улучшить структуру компонентов AppSidebar и PageHeader

Обновлены компоненты AppSidebar и PageHeader для улучшения структуры и адаптивности. В AppSidebar добавлен новый элемент SidebarGroupContent для более четкой организации навигации. В PageHeader упрощена разметка и улучшены стили, включая изменения в отображении заголовка и описания. Также обновлены стили в AppShell для интеграции SearchMenu и TooltipProvider, что улучшает взаимодействие с пользователем.

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

@@ -8,10 +8,10 @@ import {
   BreadcrumbPage,
   BreadcrumbSeparator,
 } from '@cfdm/ui/components/breadcrumb'
+import { Separator } from '@cfdm/ui/components/separator'
 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'
 
 export interface RouteBreadcrumbLoaderData {
@@ -93,6 +93,7 @@ function useDynamicBreadcrumbLabels() {
   }, [matches])
 }
 
+/** Header chrome — etalon EvoBGP (Trigger + Separator + Breadcrumb + Apps/Monitor/Mode). */
 export function SiteHeader() {
   const pathname = useRouterState({ select: (s) => s.location.pathname })
   const dynamicLabels = useDynamicBreadcrumbLabels()
@@ -100,36 +101,34 @@ export function SiteHeader() {
 
   return (
     <header className="bg-background sticky top-0 z-10 flex h-12 shrink-0 items-center gap-2 border-b px-4 md:px-6">
-      <div className="flex min-w-0 items-center gap-2">
-        <SidebarTrigger className="-ml-1" />
-        <Breadcrumb>
-          <BreadcrumbList>
-            {crumbs.map((crumb, index) => {
-              const isLast = index === crumbs.length - 1
-              return (
-                <span key={crumb.href} className="contents">
-                  {index > 0 && (
-                    <BreadcrumbSeparator className="hidden md:block" />
+      <SidebarTrigger className="-ml-1" />
+      <Separator orientation="vertical" className="mr-2 data-[orientation=vertical]:h-4" />
+      <Breadcrumb>
+        <BreadcrumbList>
+          {crumbs.map((crumb, index) => {
+            const isLast = index === crumbs.length - 1
+            return (
+              <span key={crumb.href} className="contents">
+                {index > 0 && (
+                  <BreadcrumbSeparator className="hidden md:block" />
+                )}
+                <BreadcrumbItem
+                  className={index === 0 && !isLast ? 'hidden md:block' : undefined}
+                >
+                  {isLast ? (
+                    <BreadcrumbPage>{crumb.label}</BreadcrumbPage>
+                  ) : (
+                    <BreadcrumbLink render={<Link to={crumb.href} />}>
+                      {crumb.label}
+                    </BreadcrumbLink>
                   )}
-                  <BreadcrumbItem
-                    className={index === 0 ? 'hidden md:block' : undefined}
-                  >
-                    {isLast ? (
-                      <BreadcrumbPage>{crumb.label}</BreadcrumbPage>
-                    ) : (
-                      <BreadcrumbLink render={<Link to={crumb.href} />}>
-                        {crumb.label}
-                      </BreadcrumbLink>
-                    )}
-                  </BreadcrumbItem>
-                </span>
-              )
-            })}
-          </BreadcrumbList>
-        </Breadcrumb>
-      </div>
-      <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 />
+                </BreadcrumbItem>
+              </span>
+            )
+          })}
+        </BreadcrumbList>
+      </Breadcrumb>
+      <div className="ml-auto flex items-center gap-2">
         <AppsMenu />
         <SystemMonitorPopover />
         <ModeToggle />