React Context Provider Login

GlobalContext.js

const GlobalContext = createContext({
  state: {
    isLoggedIn: false,
  },
  actions: {
    setIsLoggedIn: () => {},
  },
});

const GlobalProvider = ({ children }) => {
  const [isLoggedIn, setIsLoggedIn] = useState();
  const value = {
    state: {
      isLoggedIn,
    },
    actions: { setIsLoggedIn },
  };
  return (
    <GlobalContext.Provider value={value}>{children}</GlobalContext.Provider>
  );
};

 

App.js

if (!isLoggedIn) {
    return <Login />;
  } else {
    return (
    ...

 

Login.js

const Login = () => {
  const {
    state: { isLoggedIn },
    actions: { setIsLoggedIn },
  } = useContext(GlobalContext);
  
  ...
  
  const handleSubmit = () => {
    setIsLoggedIn(true);
  };