Cada vez que inicio sesión en un usuario y se me redirige al componente correcto y luego vuelvo a cargar el navegador, aparece un error que dice "Error de tipo: no se pueden leer las propiedades de nulo (leyendo 'correo electrónico')" porque estoy tratando de mostrar el usuario conectado que puedo ver al principio pero no después de actualizar la página.

¿Hay alguien que pueda señalar lo que estoy haciendo mal?

mi contexto

 useEffect(() => { onAuthStateChanged(auth, (data) => { if (data) { // User is signed in setisSignedIn(true); setCurrentUser(data); console.log('state = definitely signed in'); console.log(currentUser); } else { // User is signed out setisSignedIn(false); console.log('state = definitely signed out'); } }); }, [isSignedIn, currentUser]);

Iniciar sesión en un usuario

 const signInUser = (props: ISignIn) => { signInWithEmailAndPassword(auth, props.email, props.password) .then((user) => { setFirebaseError(false); navigate('/swipe'); }) .catch((error) => { setFirebaseError(true); setErrorMsg({ errorMessage: error.message, errorCode: error.code }); navigate('/'); }); };

Uso de usuario actual

 import { useAuth } from '../Utils/Contexs/AuthContext'; export const SwipeView = () => { const { currentUser, signOutUser } = useAuth(); return ( <div> <h1>Swipe View</h1> <p>The current user logged in: {currentUser.email}</p> <button onClick={() => signOutUser()}>Log out</button> </div> ); };

Console.log's

Error de consola