diff --git a/components/contact.js b/components/contact.js index af6d821..754be19 100644 --- a/components/contact.js +++ b/components/contact.js @@ -1,9 +1,9 @@ import React, { useContext } from 'react' -import { AppContext } from '../context/appStore' +import { WizardContext } from '../context/wizardStore' import Required from './required' export default function Contact() { - const { state, onChangeEvent } = useContext(AppContext) + const { state, onChangeEvent } = useContext(WizardContext) const { name, email, street, zip, city } = state.formData diff --git a/components/dateSelect.js b/components/dateSelect.js index 017076d..e836e75 100644 --- a/components/dateSelect.js +++ b/components/dateSelect.js @@ -1,7 +1,7 @@ import React, { useContext, useState, useRef, useEffect } from 'react' import useSWR from 'swr' -import { AppContext } from '../context/appStore' +import { WizardContext } from '../context/wizardStore' import { DateUtils } from 'react-day-picker' import DayPickerInput from 'react-day-picker/DayPickerInput' @@ -19,7 +19,7 @@ import 'moment/locale/de' const fetcher = (path) => fetch(path).then((r) => r.json()) export default function DateSelect() { - const { state, onChange } = useContext(AppContext) + const { state, onChange } = useContext(WizardContext) const [range, setRange] = useState({ form: state.startDate && new Date(state.startDate), to: state.endDate && new Date(state.endDate), diff --git a/components/reason.js b/components/reason.js index 69c969c..f3d1f4a 100644 --- a/components/reason.js +++ b/components/reason.js @@ -1,9 +1,9 @@ import React, { useContext } from 'react' -import { AppContext } from '../context/appStore' +import { WizardContext } from '../context/wizardStore' import Required from './required' export default function Contact() { - const { state, onChangeEvent } = useContext(AppContext) + const { state, onChangeEvent } = useContext(WizardContext) const { formDataChanged } = state const { purpose, destination, org } = state.formData diff --git a/components/wizard.js b/components/wizard.js index 75eea3d..e79f89b 100644 --- a/components/wizard.js +++ b/components/wizard.js @@ -1,19 +1,58 @@ import React, { useContext } from 'react' -import { AppContext } from '../context/appStore' +import Link from 'next/link' + +import WizardStore, { WizardContext } from '../context/wizardStore' import DateSelect from './dateSelect' import Reason from './reason' import Contact from './contact' //import Driver from './driver' -export default function Wizard() { - const { onSubmit, state, forgetData } = useContext(AppContext) - const { postData, postDataSuccess, postDataError, dataStoredLoaded } = state +function WizardInternal() { + const { onSubmit, state, forgetData, storeData } = useContext(WizardContext) + const { + postData, + postDataSuccess, + postDataError, + dataStoredLoaded, + dataStored, + booking, + } = state if (postDataSuccess) { - // /booking/[id] takes over - return null + return ( + <> +
Nach Prüfung bestätigen wir die Buchung bald per E-Mail!
++ + Buchungstatus einsehen + +
+ + {!dataStoredLoaded && typeof dataStored !== 'boolean' && ( + <> ++ Sollen die eingegebenen Daten in Deinem Browser{' '} + für die nächste Buchung gespeichert werden? +
+ + + > + )} + {dataStored === true && ( +Ok, die Daten wurden für die nächste Buchung gespeichert.
+ )} + > + ) } return ( @@ -44,3 +83,11 @@ export default function Wizard() { ) } + +export default function Wizard() { + return ( +