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