"use client";

import {useState, useTransition} from "react";
import {closeContract, cancelContract} from "@/features/contracts/server/actions";
import {Button} from "@/components/ui/button";
import {CheckCircle, XCircle} from "lucide-react";

type ContractActionsProps = {
  contractId: string;
  tenantSlug: string;
  status: string;
};

export function ContractActions({contractId, tenantSlug, status}: ContractActionsProps) {
  const [isPending, startTransition] = useTransition();
  const [result, setResult] = useState<{success: boolean; error?: string} | null>(null);

  if (status !== "ACTIVE" && status !== "OVERDUE") return null;

  return (
    <div className="flex flex-wrap gap-2">
      {result && !result.success && (
        <p className="w-full text-sm text-red-600">{result.error}</p>
      )}
      <Button
        disabled={isPending}
        className="bg-green-600 hover:bg-green-700"
        onClick={() => startTransition(async () => {
          const r = await closeContract(contractId, tenantSlug);
          setResult(r);
        })}
      >
        <CheckCircle className="mr-2 h-4 w-4" />
        {isPending ? "Processing..." : "Mark Returned"}
      </Button>
      <Button
        variant="outline"
        disabled={isPending}
        className="border-red-200 text-red-600 hover:bg-red-50"
        onClick={() => startTransition(async () => {
          if (!confirm("Cancel this contract?")) return;
          const r = await cancelContract(contractId, tenantSlug);
          setResult(r);
        })}
      >
        <XCircle className="mr-2 h-4 w-4" />
        Cancel Contract
      </Button>
    </div>
  );
}