Files
diplom-frontend/app/components/custom-ui/settings-button.tsx
2025-05-20 04:16:03 +03:00

38 lines
1.3 KiB
TypeScript

import { Settings } from "lucide-react";
import { ModalType, useModalStore } from "~/stores/modal-store";
import { useTokenStore } from "~/stores/token-store";
import { Button } from "../ui/button";
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from "../ui/dropdown-menu";
export function SettingsButton() {
const setToken = useTokenStore(state => state.setToken)
const onOpen = useModalStore(state => state.onOpen)
const onUpdateProfile = () => {
onOpen(ModalType.UPDATE_PROFILE)
}
const onLogout = () => {
setToken(undefined)
window.location.reload()
}
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon">
<Settings className="size-5 m-1.5" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem onClick={onUpdateProfile}>
Update profile
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem variant="destructive" onClick={onLogout}>
Logout
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)
}