fix(auth): add missing verification code input fields

This commit is contained in:
Haitao Pan 2026-01-25 11:07:46 +08:00
parent a0050806ff
commit dfb90f48ed

View File

@ -880,12 +880,48 @@ export default function RegisterContent() {
</p>
) : null}
{hasRequestedCode && !isVerified ? (
<div className="space-y-4">
<div className="rounded-2xl border border-dashed border-sky-200 bg-sky-50/80 px-4 py-3 text-sm text-sky-700">
<strong>10 </strong>
<br />
</div>
<div className="flex justify-between gap-2">
{codeDigits.map((digit, index) => (
<input
key={index}
ref={(el) => {
codeInputRefs.current[index] = el
}}
id={`verification-code-${index}`}
name={`verification-code-${index}`}
type="text"
inputMode="numeric"
autoComplete="one-time-code"
pattern="\d{1}"
maxLength={1}
className="h-12 w-full rounded-xl border border-slate-200 bg-white/90 text-center text-lg font-semibold text-slate-900 shadow-sm transition focus:border-sky-500 focus:outline-none focus:ring-2 focus:ring-sky-200"
value={digit}
onChange={(e) => handleCodeChange(index, e.target.value)}
onKeyDown={(e) => handleCodeKeyDown(index, e)}
onPaste={(e) => index === 0 && handleCodePaste(0, e)}
/>
))}
</div>
<div className="text-center">
<button
type="button"
onClick={handleResend}
disabled={isResending || resendCooldown > 0}
className="text-sm font-medium text-sky-600 transition hover:text-sky-500 disabled:cursor-not-allowed disabled:opacity-50"
>
{resendLabel}
</button>
</div>
</div>
) : null}
</div>
<label className="flex items-start gap-3 text-sm text-slate-600">