import React, { useCallback, useState } from 'react'
const StepContext = React.createContext({ step: 0, setStep: (step: number) => {}, resetStep: () => {} })

interface IAppProps {
  children: React.ReactNode
}

const StepContextProvider: React.FunctionComponent<IAppProps> = (props) => {
  const { children } = props
  const [step, setStep] = useState(0)

  const resetStep = useCallback(() => {
    setStep(0)
  }, [])

  return <StepContext.Provider value={{ step, setStep, resetStep }}>{children}</StepContext.Provider>
}

export { StepContextProvider, StepContext }