"use client";

import { useTransition } from "react";
import { useRouter } from "next/navigation";
import { toast } from "sonner";
import { ConfirmButton } from "@/components/ui/confirm-button";
import { checkIn } from "@/actions/checkin";
import { LogIn } from "lucide-react";

export function CheckInButton({ id, client }: { id: string; client: string }) {
  const router = useRouter();
  const [pending, startTransition] = useTransition();

  function handle() {
    return new Promise<void>((resolve) => {
      startTransition(async () => {
        const result = await checkIn(id);
        if (result?.error) toast.error(result.error);
        else {
          toast.success(`${client} a été enregistré dans sa chambre`);
          router.refresh();
        }
        resolve();
      });
    });
  }

  return (
    <ConfirmButton
      variant="accent"
      size="sm"
      title={`Effectuer le check-in de ${client} ?`}
      description="La chambre passera en statut 'Occupée'."
      confirmLabel="Confirmer l'arrivée"
      onConfirm={handle}
      disabled={pending}
    >
      <LogIn className="w-4 h-4" />
      Check-in
    </ConfirmButton>
  );
}
