import { createContext, useContext } from 'react'
import { LoginForm } from '../components'
import { useModal } from '../components/DrawerWrapper/DrawerWrapper'
import { openRootModal } from './RootModal'

const LoginContext = createContext<{
  openLoginForm: (loginUrl: string) => void
}>({
  openLoginForm: (loginUrl: string) => {},
})

export default function LoginFormProvider({ children }) {
  const modal = useModal()

  const onLogin = (loginUrl: string) => {
    openRootModal({
      key: 'login',
    })
  }

  return (
    <LoginContext.Provider
      value={{
        openLoginForm: onLogin,
      }}
    >
      {children}
    </LoginContext.Provider>
  )
}

export const useLoginForm = () => {
  const context = useContext(LoginContext)
  return {
    openLoginForm: context.openLoginForm,
  }
}
