Google One Tap sign-in error: u: Nonces mismatch

export const GoogleOneTap = () => {
    const [google, setGoogle] = useState<typeof window.google | undefined>(undefined)
    const nonce = useRef<string | null>(null)

    const onLoad = () => {
        try {
            if (nonce.current) return

            const { google } = window

            if (!google) {
                throw new Error('window.google not found after loading script')
            }

            const newNonce = crypto.randomUUID()

            google.accounts.id.initialize({
                client_id: clientEnv.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
                callback: onResponse,
                auto_select: false,
                cancel_on_tap_outside: true,
                use_fedcm_for_button: true,
                use_fedcm_for_prompt: true,
                context: 'signin',
                nonce: newNonce
            })

            setGoogle(google)
            nonce.current = newNonce
        } catch (error) {
            console.error('Google One Tap initialize error:', error)
        }
    }

    const onResponse = async (response: google.accounts.id.CredentialResponse) => {
        try {
            if (!nonce.current) {
                throw new Error('Nonce not set')
            }

            await supBrowser.auth['sign-in'].google['one-tap'].$post({
                json: { token: response.credential, nonce: nonce.current }
            })

            window.location.reload()
        } catch (error) {
            console.error('Google One Tap sign-in error:', error)
            toast.error(error instanceof Error ? error.message : 'Failed to sign in with Google')
        }
    }
}

const supabaseAuth = c.get('supabaseAuth')
const { token, nonce } = c.req.valid('json')

const { data: newUserData, error } = await supabaseAuth.signInWithIdToken({
    provider: 'google',
    token,
    nonce
})

if (error) throw error