"use client";

import { useRouter } from "next/navigation";

export function ApprovalButtons({ id }: { id: string }) {
  const router = useRouter();

  async function review(action: "approve" | "reject") {
    const body = action === "reject"
      ? { rejectionReason: prompt("Why is this adhoc record rejected?") ?? "" }
      : undefined;
    if (action === "reject" && !body?.rejectionReason.trim()) return;
    await fetch(`/api/adhoc-records/${id}/${action}`, {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: body ? JSON.stringify(body) : undefined
    });
    router.refresh();
  }

  return (
    <div className="flex gap-2">
      <button className="rounded-lg bg-brand-secondary px-3 py-1 text-xs font-semibold text-white" onClick={() => void review("approve")} type="button">Approve</button>
      <button className="rounded-lg bg-brand-primary px-3 py-1 text-xs font-semibold text-white" onClick={() => void review("reject")} type="button">Reject</button>
    </div>
  );
}
