1import { Button } from "@marzneshin/common/components";
 2import { cn } from "@marzneshin/common/utils";
 3import { UserType, useUserStatusEnable } from "@marzneshin/modules/users";
 4import { LoaderIcon, UserCheck, UserX } from "lucide-react";
 5import { FC, useCallback, useState } from "react";
 6import { useTranslation } from "react-i18next";
 7
 8interface UserStatusEnableButtonProps {
 9    user: UserType;
10}
11
12export const UserStatusEnableButton: FC<UserStatusEnableButtonProps> = ({ user }) => {
13    const [userStatus, setUserStatus] = useState<boolean>(user.enabled)
14    const { t } = useTranslation()
15    const { mutate: userStatusEnable, isPending } = useUserStatusEnable()
16
17    const handleUserStatusEnabledToggle = useCallback(() => {
18        const tempUserStatus = userStatus;
19        userStatusEnable({ user: user, enabled: !userStatus })
20        setUserStatus(!tempUserStatus)
21    }, [user, userStatus, userStatusEnable]);
22
23    const bgColor = isPending ? 'bg-muted-foreground' : (userStatus ? 'bg-destructive' : 'bg-success')
24
25    return (
26        <Button
27            className={cn(bgColor, "rounded-2xl")}
28            onClick={handleUserStatusEnabledToggle}
29        >
30            {!userStatus ? <UserCheck className="mr-2" /> : <UserX className="mr-2" />}
31            {isPending ? <LoaderIcon className="animate-spin" /> : t(!userStatus ? 'enable' : 'disable')}
32        </Button>
33    )
34}