"use client"
import { useState } from "react";
import { Trash } from "lucide-react";
import {
  AlertDialog,
  AlertDialogAction,
  AlertDialogCancel,
  AlertDialogContent,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
  AlertDialogTrigger,
} from "@/components/ui/alert-dialog";
import { Button } from "@/components/ui/button";
import { toast, Flip } from "react-toastify";
import { useRouter, usePathname, redirect } from "next/navigation";

interface DeleteProps {
  item: string;
  id: string;
}

const Delete: React.FC<DeleteProps> = ({ item, id }) => {
  const [loading, setLoading] = useState(false);
  const router = useRouter();
  const pathname = usePathname();

  const onDelete = async () => {
    try {
      setLoading(true);
      const itemType =
        item === "products"
          ? "products"
          : item === "variants"
            ? "variants"
            : item === "collections"
              ? "collections"
              : item == "categories"
                ? "categories"
                : item === "coupons"
                  ? "coupons"
                  : item

      const res = await fetch(`/api/admin/${itemType}/${id}`, {
        method: "DELETE",
      });
      if (res.ok) {
        setLoading(false);
        toast.success(`${itemType} Deleted`, {
          position: "bottom-right",
          autoClose: 4000,
          hideProgressBar: false,
          closeOnClick: true,
          pauseOnHover: true,
          draggable: true,
          progress: undefined,
          theme: "colored",
          transition: Flip,
        });
        if (itemType == "coupons") {
          // console.log(itemType)
          // console.log("REFRESHING")
          window.location.reload()
        }
        else if (pathname === `/admin/${itemType}`) {
          router.refresh();
        } else {
          router.push(`/admin/${itemType}`);

        }
      } else if (res.status === 405) {
        toast.error(
          `Cannot delete ${itemType} with linked products. Please remove the linked products first.`,
          {
            position: "bottom-right",
            autoClose: 4000,
            hideProgressBar: false,
            closeOnClick: true,
            pauseOnHover: true,
            draggable: true,
            progress: undefined,
            theme: "colored",
            transition: Flip,
          }
        );
        if (pathname === `/admin/${itemType}`) {
          router.refresh();
        } else {
          router.push(`/admin/${itemType}`);
        }
      }
    } catch (err) {
      console.log(err);
    }
  };
  return (
    <AlertDialog>
      <AlertDialogTrigger asChild>
        <div className="inline-block">
          <Button className="bg-red-1 text-white">
            <Trash className="h-4 w-4 max-sm:w-3 max-sm:h-3" />
          </Button>
        </div>
      </AlertDialogTrigger>
      <AlertDialogContent className="bg-white text-grey-1 max-sm:w-[90%] rounded-md">
        <AlertDialogHeader>
          <AlertDialogTitle className="text-red-1">
            Are you absolutely sure?
          </AlertDialogTitle>
          <AlertDialogDescription>
            This action cannot be undone. This will permanently delete your{" "}
            {item}.
          </AlertDialogDescription>
        </AlertDialogHeader>
        <AlertDialogFooter>
          <AlertDialogCancel>Cancel</AlertDialogCancel>
          <AlertDialogAction className="bg-red-1 text-white" onClick={onDelete}>
            Delete
          </AlertDialogAction>
        </AlertDialogFooter>
      </AlertDialogContent>
    </AlertDialog>
  );
};

export default Delete;