import React, { useEffect } from 'react'
import FormOne from "./components/formone"
import FormTwo from "./components/formtwo"
import FormThree from "./components/formthree"
import FormFour from "./components/formfour"
import { useData } from '@ttk/app-loader'

export default React.memo(Page)
function Page(props) {
  const step = useData([props, 'status', 'step'])

  let form

  switch(step) {
    case 2: 
      form = <FormTwo {...props}/>; break;
    case 3:
      form = <FormThree {...props}/>; break;
    case 4:
      form = <FormFour {...props}/>; break;
    default:
      form = <FormOne {...props}/>; break;
  }

  return (
    <div>
      {form}
    </div>
  )
}


