- creating the right sidebar

- designing the artboard
- optimizing dark mode performance
- optimizing input onChange handler

src/contexts/ResumeContext.js

@@ -1,76 +1,28 @@
-import firebase from "gatsby-plugin-firebase";
-import React, { createContext, useContext, useEffect, useState } from "react";
-import { v4 as uuidv4 } from "uuid";
-import { transformCollectionSnapshot } from "../utils";
-import UserContext from "./UserContext";
+import { set } from "lodash";
+import React, { createContext, useReducer } from "react";
 
-const defaultState = {
-  resumes: [],
-  createResume: async () => {},
-  deleteResume: async () => {},
+const initialState = {
+  profile: {
+    photograph: "",
+    firstName: "",
+    lastName: "",
+  },
 };
 
-const ResumeContext = createContext(defaultState);
+const ResumeContext = createContext(initialState);
 
 const ResumeProvider = ({ children }) => {
-  const [resumes, setResumes] = useState([null]);
-  const [collectionRef, setCollectionRef] = useState(null);
-  const { user } = useContext(UserContext);
-
-  useEffect(() => {
-    if (user) {
-      setCollectionRef(`users/${user.uid}/resumes`);
+  const [state, dispatch] = useReducer((state, { type, payload }) => {
+    switch (type) {
+      case "on_input":
+        return set({ ...state }, payload.path, payload.value);
+      default:
+        throw new Error();
     }
-  }, [user]);
-
-  useEffect(() => {
-    if (collectionRef) {
-      firebase
-        .firestore()
-        .collection(collectionRef)
-        .onSnapshot((snapshot) =>
-          transformCollectionSnapshot(snapshot, setResumes)
-        );
-    }
-  }, [collectionRef]);
-
-  const createResume = async ({ name }) => {
-    const id = uuidv4();
-    const createdAt = firebase.firestore.FieldValue.serverTimestamp();
-    await firebase.firestore().collection(collectionRef).doc(id).set({
-      id,
-      name,
-      createdAt,
-      updatedAt: createdAt,
-    });
-  };
-
-  const updateResume = async (resume) => {
-    const { id, name } = resume;
-
-    if (resumes.find((x) => x.id === id) === resume) return;
-
-    await firebase.firestore().collection(collectionRef).doc(id).update({
-      id,
-      name,
-      updatedAt: firebase.firestore.FieldValue.serverTimestamp(),
-    });
-  };
-
-  const deleteResume = async (resume) => {
-    const { id } = resume;
-    await firebase.firestore().collection(collectionRef).doc(id).delete();
-  };
+  }, initialState);
 
   return (
-    <ResumeContext.Provider
-      value={{
-        resumes,
-        createResume,
-        updateResume,
-        deleteResume,
-      }}
-    >
+    <ResumeContext.Provider value={{ state, dispatch }}>
       {children}
     </ResumeContext.Provider>
   );