saas-dashboard

1import { AppSidebar } from "@/components/app-sidebar"
2import {
3  Breadcrumb,
4  BreadcrumbItem,
5  BreadcrumbLink,
6  BreadcrumbList,
7  BreadcrumbPage,
8  BreadcrumbSeparator,
9} from "@/components/ui/breadcrumb"
10import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar"
11 
12export default function Page() {
13  return (
14    <div className="bg-sidebar flex h-screen w-full flex-col overflow-hidden">
15      <div className="flex flex-1 overflow-hidden">
16        <SidebarProvider
17          className="min-h-0 !pr-0"
18          style={
19            {
20              "--sidebar-width": "15.25rem",
21              "--sidebar-width-mobile": "15.25rem",
22            } as React.CSSProperties
23          }
24        >
25          <AppSidebar />
26          <div className="flex flex-1 overflow-hidden py-3 sm:pr-3">
27            <SidebarInset
28              className="flex flex-1 flex-col overscroll-none rounded-sm border md:shadow-[0_1px_2px_0_rgba(0,0,0,0.03),0_1px_3px_0_rgba(0,0,0,0.04)] dark:md:shadow-[0_1px_2px_0_rgba(0,0,0,0.2),0_1px_3px_0_rgba(0,0,0,0.15)]"
29              style={{
30                WebkitOverflowScrolling: "auto",
31                overscrollBehavior: "none",
32              }}
33            >
34              <header className="flex h-16 shrink-0 items-center gap-2 overscroll-none border-b">
35                <div className="flex items-center gap-2 px-4">
36                  <Breadcrumb>
37                    <BreadcrumbList>
38                      <BreadcrumbItem className="hidden md:block">
39                        <BreadcrumbLink href="#">
40                          Building Your Application
41                        </BreadcrumbLink>
42                      </BreadcrumbItem>
43                      <BreadcrumbSeparator className="hidden md:block" />
44                      <BreadcrumbItem>
45                        <BreadcrumbPage>Data Fetching</BreadcrumbPage>
46                      </BreadcrumbItem>
47                    </BreadcrumbList>
48                  </Breadcrumb>
49                </div>
50              </header>
51              <div
52                className="flex flex-1 flex-col gap-4 overflow-y-auto overscroll-none p-4 pb-8 [scrollbar-color:rgb(163_163_163_/_0.5)_transparent] [&::-webkit-scrollbar-track]:bg-transparent"
53                style={{
54                  WebkitOverflowScrolling: "auto",
55                  overscrollBehavior: "none",
56                }}
57              >
58                <div className="grid auto-rows-min gap-4 md:grid-cols-3">
59// … truncated