move calendar, so it's not visible when stored

components/wizard/calendar.tsx

@@ -3,7 +3,7 @@ import classnames from 'classnames'
 import useSWR from 'swr'
 import moment, { Moment } from 'moment'
 import { Calendar } from 'react-calendar-component'
-import { dateFormatBackend } from '../helpers/date'
+import { dateFormatBackend } from '../../helpers/date'
 
 const fetcher = (path: string) => fetch(path).then((r) => r.json())
 

components/wizard/index.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link'
 import React, { useContext } from 'react'
 import Contact from './contact'
 import WizardStore, { WizardContext } from './context/wizardStore'
+import Calendar from './calendar'
 import DateSelect from './dateSelect'
 import Reason from './reason'
 
@@ -52,6 +53,8 @@ function WizardInternal() {
   }
 
   return (
+    <>
+      <Calendar />
       <form
         className="form"
         onSubmit={(event) => {
@@ -77,6 +80,7 @@ function WizardInternal() {
           </button>
         </div>
       </form>
+    </>
   )
 }
 

pages/index.tsx

@@ -2,7 +2,6 @@ import Head from 'next/head'
 import React from 'react'
 import Footer from '../components/footer'
 import Header from '../components/header'
-import Calendar from '../components/calendar'
 import Wizard from '../components/wizard/index'
 
 export default function Home() {
@@ -15,7 +14,6 @@ export default function Home() {
 
       <Header />
       <main className="main">
-        <Calendar />
         <Wizard />
       </main>
       <Footer />