move rest into pages

pages/components/dateSelect.js

@@ -10,7 +10,7 @@ import 'react-dates/initialize'
 import { DateRangePicker, SingleDatePicker } from 'react-dates'
 
 import Required from './required'
-import { dateFormat } from '../lib/dateHelper'
+import { dateFormat } from '../helpers/date'
 
 const fetcher = (path) => fetch(path).then((r) => r.json())
 

pages/components/required.js

@@ -1,4 +1,2 @@
-import react from 'react'
-
 const Required = () => <span>*</span>
 export default Required

pages/components/wizard.js

@@ -11,7 +11,7 @@ import Contact from './contact'
 //import Driver from './driver'
 
 function WizardInternal() {
-  const { onSubmit, state } = useContext(WizardContext)
+  const { onSubmit, state, storeData } = useContext(WizardContext)
   const { postData, postDataSuccess, postDataError } = state
 
   if (postDataSuccess) {
@@ -23,7 +23,7 @@ function WizardInternal() {
           Sollen die eingegebenen Daten in Deinem Browser für die nächste
           Buchung gespeichert werden?
         </p>
-        <Button>Ja, bitte speichern</Button>
+        <Button onClick={storeData}>Ja, bitte speichern</Button>
       </>
     )
   }

pages/context/wizardStore.js

@@ -1,4 +1,6 @@
-import React, { useReducer } from 'react'
+import React, { useReducer, useEffect } from 'react'
+
+import { storeFormData, loadFormData } from '../helpers/storage'
 
 export const WizardContext = React.createContext()
 
@@ -93,6 +95,11 @@ async function createBooking(formData) {
 export default function WizardStore({ children }) {
   const [state, dispatch] = useReducer(debugReducer, initialState)
 
+  useEffect(() => {
+    const data = loadFormData()
+    dispatch({ type: ACTIONS.SET_FORM_DATA, payload: data })
+  }, [])
+
   const onChangeEvent = (event) => {
     const { name, value } = event.target
 
@@ -121,9 +128,11 @@ export default function WizardStore({ children }) {
     }
   }
 
+  const storeData = () => storeFormData(state.formData)
+
   return (
     <WizardContext.Provider
-      value={{ state, dispatch, onChangeEvent, onChange, onSubmit }}
+      value={{ state, dispatch, onChangeEvent, onChange, onSubmit, storeData }}
     >
       {children}
     </WizardContext.Provider>

pages/helpers/storage.js

@@ -0,0 +1,17 @@
+const FORM_DATA_KEY = 'pfadiBussleFormData'
+
+function getStorage() {
+  return localStorage
+}
+
+export function storeFormData({ org, name, email, street, zip, city }) {
+  getStorage().setItem(
+    FORM_DATA_KEY,
+    JSON.stringify({ org, name, email, street, zip, city })
+  )
+}
+
+export function loadFormData() {
+  const dataAsString = getStorage().getItem(FORM_DATA_KEY)
+  return JSON.parse(dataAsString || '{}')
+}

pages/index.js

@@ -1,6 +1,6 @@
 import Head from 'next/head'
 
-import Wizard from '../components/wizard'
+import Wizard from './components/wizard'
 
 export default function Home() {
   return (