How to create user collection in firestore after sign in with google?

Question

i am trying to create a user collection in firebase firestore after when user sign in with google. i use these lines of code

const signInWithGoogle = async () => {
    const provider = new fb.auth.GoogleAuthProvider();
    fb.auth().useDeviceLanguage();
    try {
      await fb.auth().signInWithRedirect(provider)
      fb.auth().getRedirectResult().then(function(result) {
        console.log("user sign in", result)
        DB.collection("users").add({
          username: result.additionalUserInfo.profile.given_name,
          name : result.user.displayName,
          photo: result.user.photoURL,
          email: result.user.email,
          uid: result.user.uid,
        });
      }).catch(function (error) {
      console.log("error", error.message)
    });
    } catch (error) {
      console.log(error.message);
    }
  };

but when i click on sign in button, user get sign in but after the signin this code could run

.then(function(result) {
        console.log("user sign in", result)
        DB.collection("users").add({
          username: result.additionalUserInfo.profile.given_name,
          name : result.user.displayName,
          photo: result.user.photoURL,
          email: result.user.email,
          uid: result.user.uid,
        });
      }).catch(function (error) {
      console.log("error", error.message)
    })

but that code , did not called after user sign in. neither console.log("user sign in",result) msg show in console section

Answer 1

so this is the previous code , i had used

const signInWithGoogle = async () => {
    const provider = new fb.auth.GoogleAuthProvider();
    fb.auth().useDeviceLanguage();
    try {
      await fb.auth().signInWithRedirect(provider)
      fb.auth().getRedirectResult().then(function(result) {
        console.log("user sign in", result)
        DB.collection("users").add({
          username: result.additionalUserInfo.profile.given_name,
          name : result.user.displayName,
          photo: result.user.photoURL,
          email: result.user.email,
          uid: result.user.uid,
        });
      }).catch(function (error) {
      console.log("error", error.message)
    });
    } catch (error) {
      console.log(error.message);
    }
  };

But the problem was that the second code(getRedirectResult()) was executed while the first code (signInWithRedirect(provider) was running. so its obvious that the second code will give null value in result. because first code is not done.

To solve that problem , i separate these codes in diff files. so in 'signin.js' file i write this code.

const signInWithGoogle = async () => {
    try {
      const provider = new fb.auth.GoogleAuthProvider();
      fb.auth().signInWithRedirect(provider) 
    } catch (error) {
      console.log(error.message);
    }
  }

and the rest of the code is written in the "App.js" file.

fb.auth().getRedirectResult().then(function(result) {
    DB.collection("users").add({
      username: result.additionalUserInfo.profile.given_name,
      name : result.user.displayName,
      photo: result.user.photoURL,
      email: result.user.email,
      uid: result.user.uid,
  });
}); 

And doing that solves the problem.

i recorded a youtube video also for this solution . you can watch here https://youtu.be/EKHk8tpd7dI