76 lines
1.6 KiB
TypeScript
76 lines
1.6 KiB
TypeScript
import {
|
|
AudioWaveform,
|
|
Box,
|
|
Command,
|
|
FolderKey,
|
|
GalleryVerticalEnd,
|
|
} from "lucide-react";
|
|
import * as React from "react";
|
|
import { useSelector } from "react-redux";
|
|
|
|
import { NavMain } from "~/components/nav-main";
|
|
import { NavUser } from "~/components/nav-user";
|
|
import { TeamSwitcher } from "~/components/team-switcher";
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarHeader,
|
|
SidebarRail,
|
|
} from "~/components/ui/sidebar";
|
|
import { Links } from "~/lib/links";
|
|
import type { RootState } from "~/store";
|
|
import Loader from "./loader";
|
|
|
|
export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
|
|
// This is sample data.
|
|
const data = {
|
|
teams: [
|
|
{
|
|
name: "Acme Inc",
|
|
logo: GalleryVerticalEnd,
|
|
plan: "Enterprise",
|
|
},
|
|
{
|
|
name: "Acme Corp.",
|
|
logo: AudioWaveform,
|
|
plan: "Startup",
|
|
},
|
|
{
|
|
name: "Evil Corp.",
|
|
logo: Command,
|
|
plan: "Free",
|
|
},
|
|
],
|
|
navMain: [
|
|
{
|
|
title: "Products",
|
|
url: "#",
|
|
icon: Box,
|
|
isActive: true,
|
|
items: [
|
|
{
|
|
title: "List",
|
|
url: Links.PRODUCTS,
|
|
},
|
|
],
|
|
},
|
|
],
|
|
};
|
|
|
|
return (
|
|
<Sidebar collapsible="icon" {...props}>
|
|
{/* <SidebarHeader>
|
|
<TeamSwitcher teams={data.teams} />
|
|
</SidebarHeader> */}
|
|
<SidebarContent>
|
|
<NavMain items={data.navMain} />
|
|
</SidebarContent>
|
|
{/* <SidebarFooter>
|
|
<NavUser />
|
|
</SidebarFooter> */}
|
|
<SidebarRail />
|
|
</Sidebar>
|
|
);
|
|
}
|