gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/bottom-menu/index.tsx · v0.7.4
Source
1 7389ad0 Mardin 2y ago import { Button, SidebarItem } from "@marzneshin/common/components";
2 7bd6cce Mardin 2y ago import i18n from "@marzneshin/features/i18n";
3 7bd6cce Mardin 2y ago import { Link } from "@tanstack/react-router";
4 7bd6cce Mardin 2y ago import { FC } from "react";
5 7bd6cce Mardin 2y ago import { Box, Home, Server, ServerCog, UsersIcon } from 'lucide-react';
6 d636f3f Dawsh 2y ago import { useIsCurrentRoute } from "@marzneshin/common/hooks";
7 d636f3f Dawsh 2y ago import { cn } from "@marzneshin/common/utils";
8 7bd6cce Mardin 2y ago
9 7bd6cce Mardin 2y ago type BottomMenuItemProps = Omit<SidebarItem, 'isParent' | 'subItem'>
10 7bd6cce Mardin 2y ago
11 7bd6cce Mardin 2y ago const BottomMenuItem: FC<BottomMenuItemProps & { active: boolean }> = ({ title, icon, to, active }) => {
12 7bd6cce Mardin 2y ago return (
13 7bd6cce Mardin 2y ago <Button asChild variant={active ? "default" : "ghost"} className="gap-1 flex flex-col justify-center text-xs h-full py-2 size-14">
14 7bd6cce Mardin 2y ago <Link to={to}>
15 7bd6cce Mardin 2y ago {icon}
16 7bd6cce Mardin 2y ago {title}
17 7bd6cce Mardin 2y ago </Link>
18 7bd6cce Mardin 2y ago </Button>
19 7bd6cce Mardin 2y ago )
20 7bd6cce Mardin 2y ago }
21 7bd6cce Mardin 2y ago
22 7bd6cce Mardin 2y ago const adminItems: BottomMenuItemProps[] = [
23 7bd6cce Mardin 2y ago {
24 7bd6cce Mardin 2y ago title: i18n.t('users'),
25 7bd6cce Mardin 2y ago to: '/users',
26 7bd6cce Mardin 2y ago icon: <UsersIcon />,
27 7bd6cce Mardin 2y ago },
28 7bd6cce Mardin 2y ago {
29 7bd6cce Mardin 2y ago title: i18n.t('home'),
30 7bd6cce Mardin 2y ago to: '/',
31 7bd6cce Mardin 2y ago icon: <Home />,
32 7bd6cce Mardin 2y ago },
33 7bd6cce Mardin 2y ago ]
34 7bd6cce Mardin 2y ago
35 7bd6cce Mardin 2y ago const sudoAdminItems: BottomMenuItemProps[] = [
36 7bd6cce Mardin 2y ago {
37 7bd6cce Mardin 2y ago title: i18n.t('users'),
38 7bd6cce Mardin 2y ago to: '/users',
39 7bd6cce Mardin 2y ago icon: <UsersIcon />,
40 7bd6cce Mardin 2y ago },
41 7bd6cce Mardin 2y ago {
42 7bd6cce Mardin 2y ago title: i18n.t('services'),
43 7bd6cce Mardin 2y ago to: '/services',
44 7bd6cce Mardin 2y ago icon: <Server />,
45 7bd6cce Mardin 2y ago },
46 7bd6cce Mardin 2y ago {
47 7bd6cce Mardin 2y ago title: i18n.t('home'),
48 7bd6cce Mardin 2y ago to: '/',
49 7bd6cce Mardin 2y ago icon: <Home />,
50 7bd6cce Mardin 2y ago },
51 7bd6cce Mardin 2y ago {
52 7bd6cce Mardin 2y ago title: i18n.t('nodes'),
53 7bd6cce Mardin 2y ago to: '/nodes',
54 7bd6cce Mardin 2y ago icon: <Box />,
55 7bd6cce Mardin 2y ago },
56 7bd6cce Mardin 2y ago {
57 7bd6cce Mardin 2y ago title: i18n.t('hosts'),
58 7bd6cce Mardin 2y ago to: '/hosts',
59 7bd6cce Mardin 2y ago icon: <ServerCog />,
60 7bd6cce Mardin 2y ago },
61 7bd6cce Mardin 2y ago ]
62 7bd6cce Mardin 2y ago
63 7bd6cce Mardin 2y ago export const DashboardBottomMenu = ({ variant = "admin" }: { variant: "sudo-admin" | "admin" }) => {
64 7bd6cce Mardin 2y ago const { isCurrentRouteActive } = useIsCurrentRoute()
65 7bd6cce Mardin 2y ago const items = variant === "sudo-admin" ? sudoAdminItems : adminItems;
66 7bd6cce Mardin 2y ago return (
67 65afe33 Mardin 2y ago <div className={cn("w-full flex flex-row items-center", variant == "admin" ? "justify-evenly" : "justify-between")}>
68 7bd6cce Mardin 2y ago {items.map((item: BottomMenuItemProps) => (
69 7bd6cce Mardin 2y ago <BottomMenuItem
70 7bd6cce Mardin 2y ago active={isCurrentRouteActive(item.to)}
71 7bd6cce Mardin 2y ago {...item}
72 7bd6cce Mardin 2y ago />
73 7bd6cce Mardin 2y ago ))}
74 7bd6cce Mardin 2y ago </div>
75 7bd6cce Mardin 2y ago )
76 7bd6cce Mardin 2y ago }
77 7bd6cce Mardin 2y ago