"use client";

import { useRouter } from "next/navigation";
import { useTransition } from "react";
import { deleteGameAction } from "@/lib/admin-actions";

/** Delete button with a native confirmation step. */
export function DeleteGameButton({ id, title }: { id: number; title: string }) {
  const router = useRouter();
  const [pending, startTransition] = useTransition();

  return (
    <button
      type="button"
      disabled={pending}
      onClick={() => {
        if (
          window.confirm(`Delete "${title}"? This cannot be undone.`)
        ) {
          startTransition(async () => {
            await deleteGameAction(id);
            router.refresh();
          });
        }
      }}
      className="rounded-lg border border-red-500/40 bg-red-600/10 px-3 py-1.5 text-xs font-semibold text-red-300 hover:bg-red-600/20 disabled:opacity-50"
    >
      {pending ? "Deleting…" : "Delete"}
    </button>
  );
}