Phone Number Submission Error on Expo

[farmhutsoftwareteam]

`import React, { useState } from 'react'; import { View, Text, TextInput, Button, StyleSheet } from 'react-native'; import { getAuth, signInWithPhoneNumber } from "firebase/auth"; import app from "../config/firebaseConfig"; import { initializeRecaptcha } from "../config/recaptcha";

const AuthForm = () => { const [phoneNumber, setPhoneNumber] = useState(''); const [confirm, setConfirm] = useState(null); const [code, setCode] = useState('');

const handlePhoneNumberSubmit = async () => { try { const auth = getAuth(app); const recaptchaVerifier = initializeRecaptcha(); const confirmation = await signInWithPhoneNumber(auth, phoneNumber, recaptchaVerifier); setConfirm(confirmation); console.log('SMS sent successfully. Confirmation result:', confirmation); } catch (error) { console.error('Phone Number Submission Error:', error); } };

const handleCodeSubmit = async () => { try { await confirm.confirm(code); console.log('Phone Number Verified!'); } catch (error) { console.error('Code Confirmation Error:', error); } };

return ( <View style={styles.container}> {!confirm ? ( <> <Text style={styles.label}>Enter your phone number:</Text> <TextInput style={styles.input} keyboardType="phone-pad" placeholder="Phone Number" value={phoneNumber} onChangeText={setPhoneNumber} /> <Button title="Submit" onPress={handlePhoneNumberSubmit} /> </> ) : ( <> <Text style={styles.label}>Enter the verification code:</Text> <TextInput style={styles.input} keyboardType="number-pad" placeholder="Verification Code" value={code} onChangeText={setCode} /> <Button title="Verify Code" onPress={handleCodeSubmit} /> </> )} </View> ); };

const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', padding: 16, }, label: { fontSize: 18, marginBottom: 8, }, input: { height: 40, borderColor: 'gray', borderWidth: 1, marginBottom: 16, paddingHorizontal: 8, }, });

export default AuthForm;` this is my signin component, this is my recaptcha code

`import { getAuth, RecaptchaVerifier } from "firebase/auth"; import app from "./firebaseConfig";

const auth = getAuth(app);

const initializeRecaptcha = () => { return new RecaptchaVerifier('recaptcha-container', { 'size': 'invisible', 'callback': (response) => { // reCAPTCHA solved, allow signInWithPhoneNumber. console.log('reCAPTCHA solved'); }, 'expired-callback': () => { // Response expired. Ask user to solve reCAPTCHA again. console.log('reCAPTCHA expired'); } }, auth); };

export { initializeRecaptcha };`

and this is the error

Phone Number Submission Error: [TypeError: Cannot read property 'prototype' of undefined]

Expo SK 51