1import {
 2    DropdownMenu,
 3    DropdownMenuContent,
 4    DropdownMenuItem,
 5    DropdownMenuLabel,
 6    DropdownMenuSeparator,
 7    DropdownMenuTrigger,
 8    DropdownMenuGroup,
 9    Button,
10} from "@marzneshin/components";
11import { Link } from "@tanstack/react-router";
12import { FC } from 'react';
13import { Settings, MenuIcon, ShieldCheck } from "lucide-react";
14import { LanguageSwitchMenu } from "@marzneshin/features/language-switch";
15import { ThemeToggle } from "@marzneshin/features/theme-switch";
16import { useAuth, Logout } from "@marzneshin/features/auth";
17import { useScreenBreakpoint } from "@marzneshin/hooks/use-screen-breakpoint";
18import { useTranslation } from "react-i18next";
19
20export const HeaderMenu: FC = () => {
21
22    const isDesktop = useScreenBreakpoint("md");
23    const { isSudo } = useAuth();
24    const { t } = useTranslation();
25
26    return (
27        <DropdownMenu>
28            <DropdownMenuTrigger asChild>
29                <Button
30                    variant="secondary"
31                    className="bg-gray-800 text-secondary dark:hover:bg-secondary-foreground dark:hover:text-secondary dark:text-secondary-foreground"
32                    size="icon"
33                >
34                    <MenuIcon />
35                </Button>
36            </DropdownMenuTrigger>
37            <DropdownMenuContent>
38                <DropdownMenuLabel>Menu</DropdownMenuLabel>
39                <DropdownMenuSeparator />
40                {(!isDesktop && isSudo()) && (
41                    <>
42                        <DropdownMenuItem className="w-full">
43                            <Link to="/settings" className="hstack gap-1 items-center justify-between w-full h-fit p-0">
44                                {t("settings")}
45                                <Settings className="size-4" />
46                            </Link>
47                        </DropdownMenuItem>
48                        <DropdownMenuSeparator />
49                        <DropdownMenuItem className="w-full">
50                            <Link to="/admins" className="hstack gap-1 items-center justify-between w-full h-fit p-0" >
51                                {t("admins")}
52                                <ShieldCheck className="size-4" />
53                            </Link>
54                        </DropdownMenuItem>
55                        <DropdownMenuSeparator />
56                    </>
57                )}
58                <DropdownMenuItem className="w-full">
59                    <Logout />
60                </DropdownMenuItem>
61                <DropdownMenuSeparator />
62                <DropdownMenuGroup>
63                    <LanguageSwitchMenu />
64                </DropdownMenuGroup>
65                <DropdownMenuSeparator />
66                <DropdownMenuGroup>
67                    <ThemeToggle />
68                </DropdownMenuGroup>
69            </DropdownMenuContent>
70        </DropdownMenu >
71    )
72};