Did I understand the user auth().signInWithCredential correctly?

[TommyLeong]

I'm using the following to do Google Sign In now, basically I need only information of the user's name and id.

import { GoogleSignin } from '@react-native-google-signin/google-signin';
const userInfo = await GoogleSignin.signIn();

# Below is the value receive from userinfo
{
    "scopes": [
        "https://www.googleapis.com/auth/userinfo.profile",
        "https://www.googleapis.com/auth/userinfo.email"
    ],
    "serverAuthCode": null,
    "idToken": null,
    "user": {
        "photo": null,
        "givenName": "user",
        "familyName": "user",
        "email": "[email protected]",
        "name": "user",
        "id": "123"
    }
}

However from the social-auth (google), it shows that I should sign in with auth().signInWithCredential(googleCredential); I can see that there are more data return from the from auth().signInWithCredential(googleCredential);. Eg, refreshToken, locale, etc. Also realizing, signing in with this method, will display the user's identity inside Firebase Console's Authentication tab. (Signing in with await GoogleSignin.signIn(); will not see the user identity in Firebase Console)

So in short, my understanding is..

1. We shouldn't stop the sign in process with await GoogleSignin.signIn();. The reason we are doing this is to get the google id token return.
2. Hence with the id token return, i shall get the google credential from auth.GoogleAuthProvider.credential(userInfo.idToken,);
3. Then use the google credential to sign in with auth().signInWithCredential(googleCredential);

Did I understand correctly?

[mikehardy]

I think what you describe is correct. This is what I do:

  async googleSignIn(link?: boolean): Promise<boolean> {
    try {
      await GoogleSignin.hasPlayServices();
      GoogleSignin.configure({
        webClientId: AppConfig.getGoogleWebClientId(),
        offlineAccess: true,
      });
      const data = await GoogleSignin.signIn();
      console.log('UserStore::googleSignIn - user result is:', JSON.stringify(data, null, 2));

      this.removeUserChangeListener();

      const providers = await this.getProvidersForEmail(data.user.email);
      console.log(
        'UserStore::googleSignIn - got providers for email: ',
        JSON.stringify(providers, null, 2)
      );
      // if google.com is not in the providers, it is first login via google.
      let googleProvider = false;
      let passwordProvider = false;
      for (let i = 0; i < providers.length; i++) {
        if (providers[i] === 'google.com') {
          googleProvider = true;
        } else if (providers[i] === 'password') {
          passwordProvider = true;
        }
      }

      // If there are providers, but not google, google actually just automatically does it right.
      // That doesn't work for facebook though
      if (providers.length !== 0 && !googleProvider) {
        if (passwordProvider) {
          console.log(
            'UserStore::googleSignIn -  other providers but google auto-connects if it is password provider'
          );
        } else {
          this.handleCredentialInUse();
          return Promise.resolve(false);
        }
      }

      // If there are no other providers we should ask if they already have an account
      if (
        providers.length === 0 &&
        (!firebase.auth().currentUser?.providerData ||
          firebase.auth().currentUser?.providerData.length === 0)
      ) {
        console.log('UserStore::googleSignIn - no other providers. See if they are sure');
        const choice = await UserStore.firstLoginDialog();

        if (choice === 'Other Accounts') {
          console.log('UserStore::googleSignIn - user wants to handle other accounts');
          return Promise.resolve(false);
        }
        console.log(
          'UserStore::googleSignIn - user is just fine continuing and creating new account'
        );

        this.setIsNewUser(true);
      }

      // create a new firebase credential with the token
      const credential = firebase.auth.GoogleAuthProvider.credential(
        data.idToken
        // data.accessToken
      );
      console.log('UserStore::googleSignIn - credential was', JSON.stringify(credential, null, 2));
      let firebaseUserCredential;
      if (!link) {
        // login with credential
        firebaseUserCredential = await firebase.auth().signInWithCredential(credential);
        Analytics.setAnalyticsUser(firebaseUserCredential.user.uid); // TODO, set our own ID?
        Analytics.setAnalyticsUserProperties({ email: firebaseUserCredential.user.email });
        Analytics.analyticsEvent('successGoogleSignIn');
      } else {
        const { currentUser } = firebase.auth();
        if (!currentUser) {
          return Promise.resolve(false);
        }
        firebaseUserCredential = await currentUser.linkWithCredential(credential);
        Analytics.setAnalyticsUser(currentUser.uid); // TODO, set our own ID?
        Analytics.setAnalyticsUserProperties({ email: currentUser.email });
        Analytics.analyticsEvent('successGoogleLink');
      }
      const { currentUser } = firebase.auth();
      if (firebaseUserCredential.additionalUserInfo?.profile?.picture && currentUser) {
        try {
          await currentUser.updateProfile({
            photoURL: firebaseUserCredential.additionalUserInfo?.profile?.picture,
          });
        } catch (e) {
          console.log('UserStore::googleSignIn - error setting photoURL?', e);
        }
      }

      console.log(
        'UserStore::googleSignIn - firebaseCredential was',
        JSON.stringify(firebaseUserCredential, null, 2)
      );
      this.userChangedHandler(
        firebaseUserCredential.user,
        firebaseUserCredential.additionalUserInfo
      );
      return Promise.resolve(true);
    } catch (error) {
      if (error.code === statusCodes.SIGN_IN_CANCELLED) {
        // user cancelled the login flow
        console.log('UserStore::googleSignIn - user cancelled');
      } else if (error.code === statusCodes.IN_PROGRESS) {
        // operation (e.g. sign in) is in progress already
        console.log('UserStore::googleSignIn - signin already in progress');
      } else if (error.code === statusCodes.PLAY_SERVICES_NOT_AVAILABLE) {
        // play services not available or outdated
        console.log('UserStore::googleSignIn - play services not available');
      } else if (
        error.code === 'auth/email-already-in-use' ||
        error.code === 'auth/credential-already-in-use'
      ) {
        console.log('UserStore::googleSignIn - email already in use, instruct on unlink/delete');
        this.handleAccountInUse();
      } else if (error.code === 'auth/account-exists-with-different-credential') {
        this.handleCredentialInUse();
      } else {
        // some other error happened
        console.log('UserStore::googleSignIn - unknown error?', error);
        RX.Alert.show(
          I18NService.translate('ConnectedAccountsConnectionError'),
          I18NService.translate(error.code)
        );
      }
    } finally {
      this.addUserChangedListener();
    }

    return Promise.resolve(false);
  }

So many different failure modes, it's crazy 😅

[TommyLeong]

Hi Mike, thanks for the responding as well as showing the way you're handling (impressive handling).

Can I also conclude that using only await GoogleSignin.signIn(); to sign in, does not actually signed in or it's incomplete? Can I actually stop at the 1st step instead of moving into 2nd step? (Likely not stopping at 1st step, but im trying to get a bigger picture why is there a need of "2 times sign in")

1st step = const data = await GoogleSignin.signIn();
2nd step = firebaseUserCredential = await firebase.auth().signInWithCredential(credential);

[mikehardy]

The Google SignIn SDK just signs you in to a google account, there is zero relation to a Firebase user authentication until you pass the credential in to Firebase for authentication there. Both phases are necessary.

And then handling / coordinating all the other junk becomes necessary since there may be collisions in a number of ways - that's the fun part!

[TommyLeong]

Hi Mike, revisiting this topic again. Say if, my use case does not use Firebase backend services (eg, firestore, database, etc) after user login. I don't actually require to further authenticate user with firebase.auth().signInWithCredential(credential);.

Any user who passed await GoogleSignin.signIn(); will still considered as an authenticated user, correct?

[mikehardy]

Any user who passed await GoogleSignin.signIn(); will still considered as an authenticated user, correct?

So you have a google OAUTH token, that's good.

But you will not have a firebase token. If you definitely use zero firebase backend services then there is no concept of a firebase user session really where the specific user needs to authenticate to have rights to backend services, so, this could work. Seems like it's a rare scenario at that point, like - I'm not even sure why you ask this on a react-native-firebase discussion as you are not actually using react-native-firebase at that point? But I guess you could still be doing ads or app distribution etc 🤔 so - sure, it could make sense.