commerce/lib/commerce/index.tsx

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

const Commerce = createContext<Connector | any>(null)

export type CommerceProps = {
  children?: ReactNode | any
  connector: Connector
}

export type Connector = {
  fetcher: Fetcher<any>
  locale: string
}

export type Fetcher<T> = (...args: any) => T | Promise<T>

export function CommerceProvider({ children, connector }: CommerceProps) {
  if (!connector) {
    throw new Error(
      'CommerceProvider requires a valid headless commerce connector'
    )
  }

  return <Commerce.Provider value={connector}>{children}</Commerce.Provider>
}

export function useCommerce<T extends Connector>() {
  return useContext(Commerce) as T
}