import React, { useState } from 'react'; import { Head, useForm } from '@inertiajs/react'; export default function TwoFactorChallenge() { const [useRecovery, setUseRecovery] = useState(false); const { data, setData, post, processing, errors } = useForm({ code: '' }); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); post(route('two-factor.verify'), { preserveScroll: true }); }; return (
{/* Logo */}

Two-Factor Authentication

{useRecovery ? 'Enter a recovery code to continue' : 'Enter the 6-digit code from your authenticator app'}

setData('code', e.target.value)} autoFocus className={`w-full h-12 border rounded-xl px-4 text-center font-mono font-bold text-lg tracking-[0.4em] outline-none transition-all ${errors.code ? 'border-red-300 bg-red-50' : 'border-gray-200 focus:border-[#3D4E4B] focus:ring-2 focus:ring-[#3D4E4B]/10'}`} placeholder={useRecovery ? 'xxxxxxxxxx-xxxxxxxxxx' : '000000'} /> {errors.code && (

{errors.code}

)}
← Back to login
); }