preserving form content on refresh

src/components/dashboard/AddProvider.tsx

@@ -48,13 +48,26 @@ function AddProvider(props) {
     const [descriptions, setDescriptions] = useState(null);
     const [single, setSingle] = useState(null);
     const [error, setError] = useState("");
+    const [firstLoad, setFirstLoad] = useState(true);
     const [content, setContent] = useState(
         'ex. "Changing lives one bit at a time..."'
     );
     const handleUpdate = (updatedContent: string) => {
         setContent(updatedContent);
     };
 
+    useEffect(() => {
+        console.log((sessionStorage.getItem("item")))
+        if (firstLoad === false) {
+            sessionStorage.setItem('item', JSON.stringify(item))
+        } else {
+            if(JSON.parse(sessionStorage.getItem("item")) !== null) {
+                setItem(JSON.parse(sessionStorage.getItem("item")))
+            }
+            setFirstLoad(false)
+        }
+    }, [item])
+
     useEffect(() => {
         async function fetchData() {
             const collections = props.firestore.collection("categories");
@@ -195,6 +208,7 @@ function AddProvider(props) {
     };
 
     async function addFirestore() {
+        sessionStorage.clear()
         setIsLoading(true);
         const i = {
             ...item,
@@ -256,6 +270,7 @@ function AddProvider(props) {
     }
 
     async function updateFirestore() {
+        sessionStorage.clear()
         setIsLoading(true);
         const i = {
             ...item,

src/components/dashboard/RowForm.tsx

@@ -79,7 +79,7 @@ const RowForm = (props) => {
     };
 
     const [item, setItem] = useState(
-        props.item.facilityName ? props.item : defaultItem
+        props.item.facilityName ? props.item : JSON.parse(sessionStorage.getItem("item")) || defaultItem
     );
     const [showModal, setShowModal] = useState(false);
 

src/components/dashboard/index.tsx

@@ -129,6 +129,7 @@ function Dashboard({ firestore, team, selectItem }) {
             }
         }
         fetchData()
+        sessionStorage.clear()
         setIsLoading(false);
     }, [team, isLoading]);