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

import { useBankCards } from './hooks'

type Context = ReturnType<typeof useBankCards>
type Props = { children: ReactNode }

const CardsContext = createContext({} as Context)

export const CardsStore = ({ children }: Props) => {
  const value = useBankCards()
  return (
    <CardsContext.Provider value={value}>
      {children}
    </CardsContext.Provider>
  )
}

export const useCardsStore = () => useContext(CardsContext)