- designing the dashboard

- resume preview
- create resume modal

src/contexts/ModalContext.js

@@ -2,17 +2,23 @@ import React, { createContext, useState } from "react";
 
 const defaultState = {
   authModal: {},
+  createResumeModal: {},
 };
 
 const ModalContext = createContext(defaultState);
 
 const ModalProvider = ({ children }) => {
   const [authOpen, setAuthOpen] = useState(false);
+  const [createResumeOpen, setCreateResumeOpen] = useState(false);
 
   return (
     <ModalContext.Provider
       value={{
         authModal: { isOpen: authOpen, setOpen: setAuthOpen },
+        createResumeModal: {
+          isOpen: createResumeOpen,
+          setOpen: setCreateResumeOpen,
+        },
       }}
     >
       {children}

src/contexts/UserContext.js

@@ -13,7 +13,7 @@ const defaultUser = {
 
 const defaultState = {
   user: defaultUser,
-  logout: () => {},
+  logout: async () => {},
   loginWithGoogle: async () => {},
 };
 
@@ -23,10 +23,16 @@ const UserProvider = ({ children }) => {
   const [firebaseUser, loading] = useAuthState(firebase.auth());
   const [user, setUser] = useState(null);
 
+  useEffect(() => {
+    const user = JSON.parse(localStorage.getItem("user"));
+    setUser(user);
+  }, []);
+
   useEffect(() => {
     if (firebaseUser) {
       const user = pick(firebaseUser, Object.keys(defaultUser));
       setUser(user);
+      localStorage.setItem("user", JSON.stringify(user));
 
       const addUserToDatabase = async () => {
         const docRef = firebase.firestore().collection("users").doc(user.uid);
@@ -48,8 +54,9 @@ const UserProvider = ({ children }) => {
     }
   };
 
-  const logout = () => {
-    firebase.auth().signOut();
+  const logout = async () => {
+    await firebase.auth().signOut();
+    localStorage.removeItem("user");
     setUser(null);
   };
 
@@ -57,8 +64,8 @@ const UserProvider = ({ children }) => {
     <UserContext.Provider
       value={{
         user,
-        loading,
         logout,
+        loading,
         loginWithGoogle,
       }}
     >