Sidebar 14

1import { AppSidebar } from "@/registry/base-vega/blocks/sidebar-14/components/app-sidebar"
2import {
3  Breadcrumb,
4  BreadcrumbItem,
5  BreadcrumbLink,
6  BreadcrumbList,
7  BreadcrumbPage,
8  BreadcrumbSeparator,
9} from "@/registry/base-vega/ui/breadcrumb"
10import {
11  SidebarInset,
12  SidebarProvider,
13  SidebarTrigger,
14} from "@/registry/base-vega/ui/sidebar"
15 
16export default function Page() {
17  return (
18    <SidebarProvider>
19      <SidebarInset>
20        <header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
21          <Breadcrumb>
22            <BreadcrumbList>
23              <BreadcrumbItem className="hidden md:block">
24                <BreadcrumbLink href="#">Build Your Application</BreadcrumbLink>
25              </BreadcrumbItem>
26              <BreadcrumbSeparator className="hidden md:block" />
27              <BreadcrumbItem>
28                <BreadcrumbPage>Data Fetching</BreadcrumbPage>
29              </BreadcrumbItem>
30            </BreadcrumbList>
31          </Breadcrumb>
32          <SidebarTrigger className="-mr-1 ml-auto rotate-180" />
33        </header>
34        <div className="flex flex-1 flex-col gap-4 p-4">
35          <div className="grid auto-rows-min gap-4 md:grid-cols-3">
36            <div className="aspect-video rounded-xl bg-muted/50" />
37            <div className="aspect-video rounded-xl bg-muted/50" />
38            <div className="aspect-video rounded-xl bg-muted/50" />
39          </div>
40          <div className="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min" />
41        </div>
42      </SidebarInset>
43      <AppSidebar side="right" />
44    </SidebarProvider>
45  )
46}