"use client";

import { useState, useTransition } from "react";
import { Button } from "@/components/ui/button";
import { OtpCodeStep } from "@/features/auth/components/otp-code-step";
import { requestInvitationOtpAction, verifyInvitationOtpAction } from "@/features/auth/actions/accept-invitation";

export function AcceptInvitationForm({ token, email, businessName }: { token: string; email: string; businessName: string }) {
  const [codeRequested, setCodeRequested] = useState(false);
  const [error, setError] = useState<string | null>(null);
  const [isPending, startTransition] = useTransition();

  const sendCode = () => {
    setError(null);
    startTransition(async () => {
      const result = await requestInvitationOtpAction(token);
      if (!result.ok) {
        setError(result.error ?? "Something went wrong. Please try again.");
        return;
      }
      setCodeRequested(true);
    });
  };

  const verifyCode = async (code: string) => {
    const result = await verifyInvitationOtpAction(token, code);
    // On success, verifyInvitationOtpAction signs the user in and redirects
    // server-side — nothing else to do here.
    return { ok: result.ok, error: result.error };
  };

  const resendCode = async () => {
    const result = await requestInvitationOtpAction(token);
    return { ok: result.ok, error: result.error };
  };

  if (codeRequested) {
    return <OtpCodeStep email={email} onVerify={verifyCode} onResend={resendCode} verifyLabel="Accept & Sign In" />;
  }

  return (
    <div className="space-y-4">
      <p className="text-muted text-sm">
        You&apos;ve been invited to join <span className="text-ink font-bold">{businessName}</span>. Verify your
        email to get started — no password needed.
      </p>
      {error && (
        <p role="alert" className="text-danger text-sm font-medium">
          {error}
        </p>
      )}
      <Button type="button" className="mt-4 w-full" isLoading={isPending} onClick={sendCode}>
        Send Verification Code
      </Button>
    </div>
  );
}