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