'use client'

import Link from 'next/link'
import { useState } from 'react'

/* Resend button + status — real /api/auth/resend-verification endpoint.
   Without SMTP configured the API answers 503 with a clear message. */
export default function VerifyActions({ verified }: { verified: boolean }) {
  const [status, setStatus] = useState('')

  return (
    <>
      <div className="actions">
        <Link className="btn btn-primary" href="/onboarding" data-od-id="continue-onboarding-cta">تم التأكيد، تابع الإعداد</Link>
        {!verified && (
          <button className="btn btn-secondary" id="resendButton" type="button" data-od-id="resend-email-button"
            onClick={async (e) => {
              const button = e.currentTarget
              button.disabled = true
              setStatus('جارٍ الإرسال…')
              const res = await fetch('/api/auth/resend-verification', { method: 'POST' })
              const data = await res.json().catch(() => null)
              if (res.ok || data?.already) {
                setStatus('أرسلنا الرسالة من جديد — افحص صندوق الوارد.')
              } else {
                setStatus(data?.error || 'تعذّر الإرسال، جرّب بعد قليل.')
              }
              setTimeout(() => { button.disabled = false }, 3000)
            }}
          >
            إعادة إرسال الرسالة
          </button>
        )}
      </div>
      <p className="status" id="resendStatus" role="status" aria-live="polite">{status}</p>
    </>
  )
}