gitscope
/
← marzneshin / dashboard/src/features/sidebar/sidebar.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/sidebar/sidebar.tsx · v0.3.0-alpha3
Source
1 60ab0b1 Mrdn 2y ago import { Sidebar, SidebarItem, Tooltip, TooltipContent, TooltipTrigger } from "@marzneshin/components";
2 1eb203e Mrdn 2y ago import { useRouterState } from "@tanstack/react-router";
3 1eb203e Mrdn 2y ago import { FC, useEffect } from "react";
4 b15ff05 Mrdn 2y ago import { sidebarItems } from ".";
5 3b7feef Mrdn 2y ago import { cn } from "@marzneshin/utils";
6 1eb203e Mrdn 2y ago
7 1eb203e Mrdn 2y ago
8 1eb203e Mrdn 2y ago interface DashboardSidebarProps {
9 1eb203e Mrdn 2y ago collapsed: boolean;
10 1eb203e Mrdn 2y ago setCollapsed: (state: boolean) => void;
11 1eb203e Mrdn 2y ago }
12 1eb203e Mrdn 2y ago
13 1eb203e Mrdn 2y ago export const DashboardSidebar: FC<DashboardSidebarProps> = ({ collapsed, setCollapsed }) => {
14 1eb203e Mrdn 2y ago const router = useRouterState();
15 1eb203e Mrdn 2y ago const currentActivePath = router.location.pathname;
16 1eb203e Mrdn 2y ago
17 1eb203e Mrdn 2y ago useEffect(() => { }, [collapsed]);
18 1eb203e Mrdn 2y ago
19 1eb203e Mrdn 2y ago return (
20 1eb203e Mrdn 2y ago <aside>
21 1eb203e Mrdn 2y ago <nav className="w-full">
22 1eb203e Mrdn 2y ago <Sidebar
23 b15ff05 Mrdn 2y ago sidebar={sidebarItems}
24 1eb203e Mrdn 2y ago collapsed={collapsed}
25 1eb203e Mrdn 2y ago setCollapsed={setCollapsed}
26 1eb203e Mrdn 2y ago >
27 3b7feef Mrdn 2y ago <div className="flex flex-col px-4 w-full h-full">
28 b15ff05 Mrdn 2y ago <Sidebar.Body className="my-3">
29 b15ff05 Mrdn 2y ago {Object.keys(sidebarItems).map((key) =>
30 1eb203e Mrdn 2y ago (
31 3b7feef Mrdn 2y ago <div className="w-full" key={key}>
32 1eb203e Mrdn 2y ago <Sidebar.Group>{key}</Sidebar.Group>
33 b15ff05 Mrdn 2y ago {sidebarItems[key].map((item: SidebarItem, i) => (
34 60ab0b1 Mrdn 2y ago <Tooltip>
35 60ab0b1 Mrdn 2y ago <TooltipTrigger className="w-full">
36 60ab0b1 Mrdn 2y ago <Sidebar.Item
37 60ab0b1 Mrdn 2y ago variant={currentActivePath === item.to ? "active" : "default"}
38 60ab0b1 Mrdn 2y ago className={cn("my-2 border-transparent", { "w-10 h-10": collapsed })}
39 60ab0b1 Mrdn 2y ago item={item}
40 60ab0b1 Mrdn 2y ago key={i}
41 60ab0b1 Mrdn 2y ago />
42 60ab0b1 Mrdn 2y ago </TooltipTrigger>
43 60ab0b1 Mrdn 2y ago <TooltipContent>
44 60ab0b1 Mrdn 2y ago {collapsed && item.title}
45 60ab0b1 Mrdn 2y ago </TooltipContent>
46 60ab0b1 Mrdn 2y ago </Tooltip>
47 1eb203e Mrdn 2y ago )
48 1eb203e Mrdn 2y ago )}
49 1eb203e Mrdn 2y ago </div>
50 1eb203e Mrdn 2y ago )
51 1eb203e Mrdn 2y ago )}
52 1eb203e Mrdn 2y ago </Sidebar.Body>
53 1eb203e Mrdn 2y ago </div>
54 1eb203e Mrdn 2y ago </Sidebar>
55 1eb203e Mrdn 2y ago </nav>
56 1eb203e Mrdn 2y ago </aside>
57 1eb203e Mrdn 2y ago )
58 1eb203e Mrdn 2y ago }