React for Beginners by D. Truman Neo

Author:D. Truman, Neo
Language: eng
Format: epub
Published: 2022-05-16T00:00:00+00:00

export default Navigation;

Please do the following steps to test our code:

● Run the application again. At this time, we only see the “Log In” link. The “Logout” link is hidden because currentUser is null.

● Go to the Login page.

● Click the “Google Sign In” button.

● Select a Google account and sign in with that account.

● After logging in with Google account successfully, we only see the “Logout” link. The “Log In” link is hidden because currentUser is not null.

● Finally, click the “Logout” link. At this time, we only see the “Log In” link and you know why.

The current code is not good enough. Try these steps to see:

● Run the application again.

● Go to the Login page.

● Click the “Google Sign In” button.

● Select a Google account and sign in with that account.

● After logging in with Google account successfully, refresh the web page and you see the “Log In” link. This is not what we expect because we just logged in recently.

Let’s fix this issue using onAuthStateChanged of firebase/auth.

/src/utils/firebase.utils.js

import { initializeApp } from "firebase/app";

import {

getAuth,

signInWithPopup,

signOut,

GoogleAuthProvider,

onAuthStateChanged

} from 'firebase/auth';

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.