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-alpha
Source
1 1eb203e Mrdn 2y ago import { Sidebar, SidebarItem } 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 1eb203e Mrdn 2y ago <Sidebar.Item
35 1eb203e Mrdn 2y ago variant={currentActivePath === item.to ? "active" : "default"}
36 3b7feef Mrdn 2y ago className={cn("my-2 border-transparent", { "w-10 h-10": collapsed })}
37 1eb203e Mrdn 2y ago item={item}
38 1eb203e Mrdn 2y ago key={i}
39 1eb203e Mrdn 2y ago />
40 1eb203e Mrdn 2y ago )
41 1eb203e Mrdn 2y ago )}
42 1eb203e Mrdn 2y ago </div>
43 1eb203e Mrdn 2y ago )
44 1eb203e Mrdn 2y ago )}
45 1eb203e Mrdn 2y ago </Sidebar.Body>
46 1eb203e Mrdn 2y ago </div>
47 1eb203e Mrdn 2y ago </Sidebar>
48 1eb203e Mrdn 2y ago </nav>
49 1eb203e Mrdn 2y ago </aside>
50 1eb203e Mrdn 2y ago )
51 1eb203e Mrdn 2y ago }