import type { ReactNode } from 'react'
import { createContext, useContext } from 'react'

import type { FormState } from './hooks/useFormState'
import { useFormState } from './hooks/useFormState'

type Context = ReturnType<typeof useFormState>
type Props = {
  children: ReactNode,
  initialState?: FormState,
}

const FormContext = createContext({} as Context)

/**
 * стор формы, содержит состояние формы[значение полей, ошибки]
 * дает доступ к функциям чтения и обновления состояния
 * также часто используемым функциям для валидации полей
 */
export const FormStore = ({
  children,
  initialState,
}: Props) => {
  const formState = useFormState(initialState)
  return (
    <FormContext.Provider value={formState}>
      {children}
    </FormContext.Provider>
  )
}

export const useForm = () => useContext(FormContext)
