"use client";
import React from "react";
import {
  Dialog,
  DialogClose,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
  DialogTrigger,
} from "./ui/dialog";
import {Button} from "./ui/button";
import {useLogoutUser} from "@/hooks/users";
import {toast} from "react-toastify";
import Loader from "./Loader";
import {useRouter} from "next/navigation";

export default function ProfileLogoutDropdown() {
  const {mutateAsync, isPending} = useLogoutUser();

  const router = useRouter();
  const handleLogout = async () => {
    try {
      const {message} = await mutateAsync();
      router.push("/login");
    } catch (error) {
      toast.error("asdasdsad");
    }
  };
  return (
    <>
      <Dialog>
        <form>
          <DialogTrigger asChild>
            <Button variant="link">خروج از حساب</Button>
          </DialogTrigger>
          <DialogContent className="sm:max-w-[425px]">
            <DialogHeader>
              <DialogTitle>خروج از حساب</DialogTitle>
              <DialogDescription>
                آیا برای خروج از حساب مطمئن هستید؟
              </DialogDescription>
            </DialogHeader>

            <DialogFooter>
              <DialogClose asChild>
                <Button variant="outline">انصراف</Button>
              </DialogClose>
              <Button onClick={handleLogout} type="submit">
                {isPending ? <Loader size="size-2" /> : " بله ، خروج از حساب"}
              </Button>
            </DialogFooter>
          </DialogContent>
        </form>
      </Dialog>
    </>
  );
}
