React Native Firebase reCAPTCHA - reactjs

Question

I am following the react native firebase docs (https://rnfirebase.io/docs/v5.x.x/auth/phone-auth) on Phone Authorization and am confused about the need (or no need) for reCAPTCHA.
The docs do not pass a second parameter to the signInWithPhoneNumber() method but when calling the method I receive an error asking for the recaptchaVerifier as the second parameter. Because I am writing the app for both iOs and Android I utilized the Web connection to Firebase and am not using the generated JSON file. I believe this is my issue as it thinks I am calling the API from a non-mobile device.
Is Firebase Web the best way to connect a React Native cross platform application? If it is, is there a way to generate the reCAPTCHA code?
The firebase docs talk about an invisible reCAPTCHA but they only provide code for HTML with a button ID and whatnot. (I did try to give and an ID as a prop but found no success) https://firebase.google.com/docs/auth/web/phone-auth
My config file:
import firebase from 'firebase';
class Config {
constructor() {
if (!firebase.apps.length) {
firebase.initializeApp({
apiKey: "AIaskdjf93rlaksdjf99999",
authDomain: "myDomain.firebaseapp.com",
databaseURL: "https://myDomain.firebaseio.com",
projectId: "myDomain",
storageBucket: "",
messagingSenderId: "88827277272",
appId: "somenumbersomitted",
measurementId: "akjdsfkljad"
});
}
}
login = async (user, success_callback, failed_callback) => {
await firebase
.auth()
.signInWithEmailAndPassword(user.userName, user.password)
.then(success_callback, failed_callback);
};
//todo:: need to update signInWithPhoneNumber second param to be the recaptcha token
loginWithPhone = async (phoneNumber, success_callback, failed_callback) => {
var applicationVerifier = ?????;
await firebase
.auth()
.signInWithPhoneNumber(phoneNumber, applicationVerifier)
.then(success_callback, failed_callback);
};
//todo: figure out how to get this method to work in RN. Not able to take in button ID...
recaptchaVerifier = async (phoneNumber, success_callback, failed_callback) =>{
window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': function(response) {
loginWithPhone(phoneNumber, success_callback, failed_callback);
}
});
};
}
const config = new Config();
export default config;

Answer 1

I managed to get phone number authentication working on React Native by using https://rnfirebase.io/ and the following code:
const sendSmsCode = async (phoneNumber: string) => {
const isUserPhoneNumberLinked = await getIsUserPhoneNumberLinked(
phoneNumber
);
if (!isUserPhoneNumberLinked) {
} else {
try {
let confirmationResult = await firebase
.auth()
.signInWithPhoneNumber(phoneNumber, true);
Promise.resolve();
setIsSmsCodeSent(true);
confirmationRef.current = confirmationResult;
} catch (error) {
throw error;
}
}
};
And then you can use confirmationRef.current.confirm() to confirm the sms code:
const verifySmsCode = async () => {
const result = await confirmationRef.current.confirm(smsCode);
if (result.user) {
dispatch(authenticatedUserAction());
}
};