add clear stored data

context/wizardStore.js

@@ -1,6 +1,6 @@
 import React, { useReducer, useEffect } from 'react'
 
-import { storeFormData, loadFormData } from '../helpers/storage'
+import { storeFormData, loadFormData, clearFormData } from '../helpers/storage'
 
 export const WizardContext = React.createContext()
 
@@ -9,6 +9,9 @@ export const ACTIONS = {
   POST_DATA: 'postData',
   POST_DATA_ERROR: 'postDataError',
   POST_DATA_SUCCESS: 'postDataSuccess',
+  DATA_STORED: 'dataStored',
+  DATA_STORED_LOADED: 'dataStoredLoaded',
+  DATA_STORED_FORGOTTEN: 'dataStoredForgotten',
 }
 
 function reducer(state, action) {
@@ -46,6 +49,27 @@ function reducer(state, action) {
         postDataError: null,
         postDataSuccess: true,
       }
+    case ACTIONS.DATA_STORED_LOADED:
+      return {
+        ...state,
+        dataStoredLoaded: true,
+        formData: {
+          ...state.formData,
+          ...action.payload,
+        },
+      }
+    case ACTIONS.DATA_STORED_FORGOTTEN:
+      return {
+        ...state,
+        dataStored: undefined,
+        dataStoredLoaded: undefined,
+        formData: { ...initialState.formData },
+      }
+    case ACTIONS.DATA_STORED:
+      return {
+        ...state,
+        dataStored: action.payload,
+      }
     default:
       throw new Error(`Unkown Action type ${action.type}`)
   }
@@ -63,16 +87,16 @@ const initialState = {
   postDataError: null,
   postDataSuccess: null,
   formData: {
-    //startDate: '2020-08-10',
-    //endDate: '2020-08-17',
-    //purpose: 'Sommerlager 2021',
-    //org: 'VCP Rosenfeld',
-    //destination: 'Lüneburger Heide',
-    //name: 'Thomas Ruoff',
-    //email: 'thomasruoff@gmail.com',
-    //street: 'Mömpelgardgasse 25',
-    //zip: '72348',
-    //city: 'Rosenfeld',
+    startDate: '',
+    endDate: '',
+    purpose: '',
+    org: '',
+    destination: '',
+    name: '',
+    email: '',
+    street: '',
+    zip: '',
+    city: '',
   },
 }
 
@@ -96,7 +120,9 @@ export default function WizardStore({ children }) {
 
   useEffect(() => {
     const data = loadFormData()
-    dispatch({ type: ACTIONS.SET_FORM_DATA, payload: data })
+    if (data !== null) {
+      dispatch({ type: ACTIONS.DATA_STORED_LOADED, payload: data })
+    }
   }, [])
 
   const onChangeEvent = (event) => {
@@ -127,11 +153,30 @@ export default function WizardStore({ children }) {
     }
   }
 
-  const storeData = () => storeFormData(state.formData)
+  const storeData = (value) => {
+    if (value) {
+      storeFormData(state.formData)
+    }
+
+    dispatch({ type: ACTIONS.DATA_STORED, payload: value })
+  }
+
+  const forgetData = () => {
+    clearFormData()
+    dispatch({ type: ACTIONS.DATA_STORED_FORGOTTEN })
+  }
 
   return (
     <WizardContext.Provider
-      value={{ state, dispatch, onChangeEvent, onChange, onSubmit, storeData }}
+      value={{
+        state,
+        dispatch,
+        onChangeEvent,
+        onChange,
+        onSubmit,
+        storeData,
+        forgetData,
+      }}
     >
       {children}
     </WizardContext.Provider>