Que estoy haciendo mal. A continuación se muestra mi código. // Importaciones

 import { getAuth, signInWithPopup, GoogleAuthProvider } from "firebase/auth"; import { app } from "../../firebase.config"; import { useStateValue } from "../../context/StateProvider"; import { actionType } from "../../context/Reducer"; const firebaseAuth = getAuth(app); const googleAuthProvider = new GoogleAuthProvider(); const [{user}, dispatch] = useStateValue(); const [isMenu, setIsMenu] = useState(false); const login = async () => { // const response = await signInWithPopup(firebaseAuth, googleAuthProvider); // console.log(response); if (!user) { const { user: { refreshToken, providerData }, } = await signInWithPopup(firebaseAuth, googleAuthProvider); dispatch({ type: actionType.SET_USER, user: providerData[0], }); localStorage.setItem("user", JSON.stringify(providerData[0])); } else { setIsMenu(!isMenu); } };

// EstadoProveedor.js

 import React, {createContext , useContext, useReducer } from 'react'; export const StateContext = createContext(); export const StateProvider = ({Reducer,InitialState,children}) => ( <StateContext.Provider value = {useReducer(Reducer,InitialState)} > {children} </StateContext.Provider> ) export const useStateValue = () => useContext(StateContext);

// reductor.js

 export const actionType = { SET_USER : 'SET_USER' } export const Reducer = (state, action) => { // console.log(action); switch(action.type) { case actionType.SET_USER: return { ...state, user: action.user, }; default: return state; } }

// EstadoInicial.js

 import { fetchUser } from '../utils/fetchUserFromLocalStorage'; const userInfo = fetchUser(); export const InitialState = { user : userInfo }

// Error que estoy recibiendo

 Header.jsx:31 Uncaught TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator)) at Header (Header.jsx:31:1) at renderWithHooks (react-dom.development.js:16305:1) at mountIndeterminateComponent (react-dom.development.js:20074:1) at beginWork (react-dom.development.js:21587:1) at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1) at invokeGuardedCallback (react-dom.development.js:4277:1) at beginWork$1 (react-dom.development.js:27451:1) at performUnitOfWork (react-dom.development.js:26557:1) at workLoopSync (react-dom.development.js:26466:1)

Había importado todo perfectamente y también lo usé de manera correcta. Mi página no muestra nada. Está compilado perfectamente con 0 error. El error que recibo es typeerror pero no vi ningún tipo de error. Por favor, ayúdame.