update web to dashboard

2026-04-15 17:20:57 +08:00
parent 3d98cf1e27
commit c07e588030
206 changed files with 0 additions and 0 deletions
@@ -0,0 +1,82 @@
+"use client"
+
+import { useEffect, useRef } from "react"
+import { usePathname } from "next/navigation"
+
+import { RealtimeConnectionStatus } from "@/components/realtime-connection-status"
+import { getPageTitle } from "@/lib/navigation"
+import { useAgentConversationsStore } from "@/lib/stores/agent-conversations"
+import { ThemeToggle } from "@/components/theme-toggle"
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbList,
+  BreadcrumbPage,
+} from "@/components/ui/breadcrumb"
+import { Separator } from "@/components/ui/separator"
+import { SidebarTrigger, useSidebar } from "@/components/ui/sidebar"
+
+const SIDEBAR_STORAGE_KEY = "dashboard_sidebar_open"
+
+export function SiteHeader() {
+  const pathname = usePathname()
+  const { open, setOpen, isMobile } = useSidebar()
+  const pageTitle = getPageTitle(pathname)
+  const realtimeStatus = useAgentConversationsStore((state) => state.realtimeStatus)
+  const hasRestoredRef = useRef(false)
+  const showConversationRealtime =
+    pathname === "/conversations" || pathname.startsWith("/conversations/")
+
+  useEffect(() => {
+    if (hasRestoredRef.current || isMobile) {
+      return
+    }
+
+    hasRestoredRef.current = true
+    const storedValue = window.localStorage.getItem(SIDEBAR_STORAGE_KEY)
+    if (storedValue === null) {
+      return
+    }
+
+    setOpen(storedValue === "true")
+  }, [isMobile, setOpen])
+
+  useEffect(() => {
+    if (!hasRestoredRef.current || isMobile) {
+      return
+    }
+
+    window.localStorage.setItem(SIDEBAR_STORAGE_KEY, String(open))
+  }, [isMobile, open])
+
+  return (
+    <header className="flex h-(--header-height) shrink-0 items-center gap-2 border-b transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-(--header-height)">
+      <div className="flex w-full items-center justify-between gap-3 px-4 lg:px-6">
+        <div className="flex min-w-0 items-center gap-2">
+          <SidebarTrigger className="-ml-1" />
+          <Separator
+            orientation="vertical"
+            className="mx-2 h-4 data-vertical:self-auto"
+          />
+          <div className="min-w-0">
+            <Breadcrumb>
+              <BreadcrumbList>
+                <BreadcrumbItem>
+                  <div className="flex items-center gap-2">
+                    <BreadcrumbPage>{pageTitle}</BreadcrumbPage>
+                    {showConversationRealtime ? (
+                      <RealtimeConnectionStatus status={realtimeStatus} compact />
+                    ) : null}
+                  </div>
+                </BreadcrumbItem>
+              </BreadcrumbList>
+            </Breadcrumb>
+          </div>
+        </div>
+        <div className="flex items-center justify-end gap-3">
+          <ThemeToggle />
+        </div>
+      </div>
+    </header>
+  )
+}