make form just simple

context/wizardStore.js

@@ -3,23 +3,11 @@ import React, { useReducer } from 'react'
 export const WizardContext = React.createContext()
 
 export const ACTIONS = {
-  NEXT_STEP: 'nextStep',
-  PREV_STEP: 'prevStep',
   SET_FORM_DATA: 'setFormData',
 }
 
 function reducer(state, action) {
   switch (action.type) {
-    case ACTIONS.NEXT_STEP:
-      return {
-        ...state,
-        currentStep: state.currentStep + 1, // wizards steps unkown here
-      }
-    case ACTIONS.PREV_STEP:
-      return {
-        ...state,
-        currentStep: Math.max(0, state.currentStep - 1),
-      }
     case ACTIONS.SET_FORM_DATA:
       return {
         ...state,
@@ -59,27 +47,35 @@ async function createBooking(state) {
 
 const initialState = {
   formData: {
-    name: 'Thomas Ruoff',
-    email: 'thomasruoff@gmail.com',
     multipleDays: null,
   },
-  currentStep: 0,
-  bookedOn: [
-    '2020-07-10',
-    '2020-07-11',
-    '2020-07-12',
-    '2020-07-23',
-    '2020-08-01',
-  ],
 }
 
 export default function WizardStore({ children }) {
   const [state, dispatch] = useReducer(debugReducer, initialState)
 
-  const onSubmit = () => createBooking(state)
+  const storeBooking = () => createBooking(state)
+
+  const onChangeEvent = (event) => {
+    const { name, value } = event.target
+
+    dispatch({
+      type: ACTIONS.SET_FORM_DATA,
+      payload: { [name]: value },
+    })
+  }
+
+  const onChange = (data) => {
+    dispatch({
+      type: ACTIONS.SET_FORM_DATA,
+      payload: data,
+    })
+  }
 
   return (
-    <WizardContext.Provider value={{ state, dispatch, onSubmit }}>
+    <WizardContext.Provider
+      value={{ state, dispatch, onChangeEvent, onChange, storeBooking }}
+    >
       {children}
     </WizardContext.Provider>
   )