Files
fullstack-fuware/src/components/Header.tsx
2026-02-23 21:40:32 +07:00

26 lines
973 B
TypeScript

import { Separator } from '@base-ui/react/separator';
import { SidebarTrigger } from '@ui/sidebar';
import { useAuth } from './auth/auth-provider';
import Notification from './Notification';
import RouterBreadcrumb from './sidebar/router-breadcrumb';
export default function Header() {
const { session } = useAuth();
return (
<>
<header className="flex h-(--header-height) sticky top-0 shrink-0 items-center justify-between gap-2 border-b bg-background transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-(--header-height)">
<div className="flex items-center gap-1 lg:gap-2 px-2">
<SidebarTrigger size="lg" />
<Separator
orientation="vertical"
className="mx-2 data-[orientation=vertical]:h-4 border"
/>
<RouterBreadcrumb />
</div>
<div className="flex mr-2">{session?.user && <Notification />}</div>
</header>
</>
);
}