import React, { createContext, ReactNode, useCallback, useContext, useState } from 'react'
import RegistrationModal from '../components/RegistrationModal';


export interface PlayerContextType {
  openRegistrationModal: () => void
}

const ModalContext = createContext<PlayerContextType>({
  openRegistrationModal: () => { }
});

const ModalProvider = ({ children }: { children: ReactNode }) => {
  const [registrationModalOpen, setIsRegistrationModalOpen] = useState(false)
  const openRegistrationModal = useCallback(() => {
    setIsRegistrationModalOpen(true)
  }, [])
  return (
    <ModalContext.Provider value={{
      openRegistrationModal
    }}>
      {children}
      <RegistrationModal setIsOpen={setIsRegistrationModalOpen} isOpen={registrationModalOpen} />
    </ModalContext.Provider>
  );
}

export const useModal = () => {
  return useContext(ModalContext);
}

export default ModalProvider

