Sidebar 10

1import { AppSidebar } from "@/registry/radix-sera/blocks/sidebar-10/components/app-sidebar"
2import { NavActions } from "@/registry/radix-sera/blocks/sidebar-10/components/nav-actions"
3import {
4  Breadcrumb,
5  BreadcrumbItem,
6  BreadcrumbList,
7  BreadcrumbPage,
8} from "@/registry/radix-sera/ui/breadcrumb"
9import { Separator } from "@/registry/radix-sera/ui/separator"
10import {
11  SidebarInset,
12  SidebarProvider,
13  SidebarTrigger,
14} from "@/registry/radix-sera/ui/sidebar"
15 
16export default function Page() {
17  return (
18    <SidebarProvider>
19      <AppSidebar />
20      <SidebarInset>
21        <header className="flex h-14 shrink-0 items-center gap-2">
22          <div className="flex flex-1 items-center gap-2 px-3">
23            <SidebarTrigger />
24            <Separator
25              orientation="vertical"
26              className="mr-2 data-vertical:h-4 data-vertical:self-auto"
27            />
28            <Breadcrumb>
29              <BreadcrumbList>
30                <BreadcrumbItem>
31                  <BreadcrumbPage className="line-clamp-1">
32                    Project Management & Task Tracking
33                  </BreadcrumbPage>
34                </BreadcrumbItem>
35              </BreadcrumbList>
36            </Breadcrumb>
37          </div>
38          <div className="ml-auto px-3">
39            <NavActions />
40          </div>
41        </header>
42        <div className="flex flex-1 flex-col gap-4 px-4 py-10">
43          <div className="mx-auto h-24 w-full max-w-3xl rounded-xl bg-muted/50" />
44          <div className="mx-auto h-full w-full max-w-3xl rounded-xl bg-muted/50" />
45        </div>
46      </SidebarInset>
47    </SidebarProvider>
48  )
49}