diff --git a/src/components/auth/MFAChallenge.tsx b/src/components/auth/MFAChallenge.tsx index 0b1d9993..4e87922f 100644 --- a/src/components/auth/MFAChallenge.tsx +++ b/src/components/auth/MFAChallenge.tsx @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useState } from 'react'; import { supabase } from '@/integrations/supabase/client'; import { useToast } from '@/hooks/use-toast'; import { getErrorMessage } from '@/lib/errorHandler'; @@ -17,37 +17,23 @@ export function MFAChallenge({ factorId, onSuccess, onCancel }: MFAChallengeProp const { toast } = useToast(); const [code, setCode] = useState(''); const [loading, setLoading] = useState(false); - const [challengeId, setChallengeId] = useState(null); - - // Create MFA challenge on mount - useEffect(() => { - const createChallenge = async () => { - try { - const { data, error } = await supabase.auth.mfa.challenge({ factorId }); - if (error) throw error; - setChallengeId(data.id); - } catch (error: unknown) { - toast({ - variant: "destructive", - title: "MFA Challenge Failed", - description: getErrorMessage(error) - }); - onCancel(); - } - }; - - createChallenge(); - }, [factorId, onCancel, toast]); const handleVerify = async () => { - if (code.length !== 6 || !challengeId) return; + if (code.length !== 6) return; setLoading(true); try { + // Create fresh challenge for each verification attempt + const { data: challengeData, error: challengeError } = + await supabase.auth.mfa.challenge({ factorId }); + + if (challengeError) throw challengeError; + + // Immediately verify with fresh challenge const { data, error } = await supabase.auth.mfa.verify({ factorId, - challengeId, - code + challengeId: challengeData.id, + code: code.trim() }); if (error) throw error;