Login.js

...
function Login() {
  useEffect(
    () =>
      auth.onAuthStateChanged(async user => {
        if (user) {
          const metadataRef = await database.ref(`metadata/${user.uid}/refreshTime`);
          const callback = () => {
            user.getIdToken(true);
          };
          metadataRef.on('value', callback);
          const token = await user.getIdToken();
          const idTokenResult = await user.getIdTokenResult();
          const hasuraClaim = await idTokenResult.claims['https://hasura.io/jwt/claims'];
          if (hasuraClaim) {
            const initialApolloGraph = initialApollo(token);
            initialApolloGraph
              .query({
                query: getUser,
                variables: {
                  id: user.uid,
                },
              })
              .then(users => {
                if (users.data.user_by_pk !== null) {
                  console.log(users);
                } else {
                  initialApolloGraph
                    .mutate({
                      mutation: addUser,
                      variables: {
                        objects: [
                          {
                            id: user.uid,
                            email: user.email,
                            displayName: user.displayName,
                            photoURL: user.photoURL,
                          },
                        ],
                      },
                      context: {},
                    })
                    .then(() => console.log('success'))
                    .catch(result => console.log(result));
                }
              })
              .catch(err => {
                console.log(err);
              });
          }
        }
      }),
    []
  );
  const signinWithGoogle = async () => {
    try {
      await auth.signInWithPopup(googleAuthProvider);
    } catch (error) {
      console.log(error);
    }
  };
  const signOut = async () => {
    try {
      await auth.signOut();
    } catch (error) {
      console.log(error);
    }
  };
  return (
    <div>
      <button onClick={signinWithGoogle}>login</button>
      <button onClick={signOut}>Sign out</button>
    </div>
  );
}
...