"use client";

import { useRouter } from "next/navigation";
import { useState } from "react";
import { useConfirm } from "@/components/shared/use-confirm";

export function ReviewDeleteButton({ reviewId }: { reviewId: number }) {
  const router = useRouter();
  const [loading, setLoading] = useState(false);
  const { confirm: askConfirm, dialog: confirmDialog } = useConfirm();

  async function handleDelete() {
    if (!(await askConfirm({ title: "Delete review", message: "Are you sure you want to delete this review?" }))) return;
    setLoading(true);
    try {
      const res = await fetch(`/api/admin/reviews/${reviewId}`, {
        method: "DELETE",
      });
      if (res.ok) {
        router.refresh();
      } else {
        alert("Failed to delete review");
      }
    } catch {
      alert("Failed to delete review");
    } finally {
      setLoading(false);
    }
  }

  return (
    <>
      {confirmDialog}
      <button
        onClick={handleDelete}
        disabled={loading}
        className="text-red-400 hover:text-red-300 text-sm transition-colors disabled:opacity-50"
      >
        {loading ? "..." : "Delete"}
      </button>
    </>
  );
}