/**
 * Email verification pending — "check your email" screen with resend.
 *
 * ⚠️ AUTO-GENERATED BY PRISM - DO NOT EDIT
 */

import React, { useState } from 'react';

export interface EmailVerificationProps {
  onResend: () => Promise<void>;
  onBackToLogin?: () => void;
}

export function EmailVerification({ onResend, onBackToLogin }: EmailVerificationProps): JSX.Element {
  const [resending, setResending] = useState(false);
  const [resent, setResent] = useState(false);

  const handleResend = async () => {
    setResending(true);
    try {
      await onResend();
      setResent(true);
    } finally {
      setResending(false);
    }
  };

  return (
    <div className="w-full max-w-md mx-auto">
      <div className="bg-white rounded-lg shadow-lg p-8 text-center">
        <h2 className="text-2xl font-bold text-nordic-800 mb-4">Check Your Email</h2>
        <p className="text-nordic-600 mb-6">
          We&apos;ve sent a verification link to your email address.
          Please click the link to verify your account.
        </p>

        <div className="space-y-3">
          <button
            onClick={handleResend}
            disabled={resending || resent}
            className="text-sm text-nordic-600 hover:text-nordic-800 underline disabled:text-nordic-400 disabled:cursor-not-allowed"
          >
            {resent ? 'Verification email resent' : resending ? 'Resending...' : 'Resend verification email'}
          </button>

          {onBackToLogin && (
            <div>
              <button
                onClick={onBackToLogin}
                className="text-sm text-nordic-600 hover:text-nordic-800 underline"
              >
                Back to login
              </button>
            </div>
          )}
        </div>
      </div>
    </div>
  );
}
