Updated core types for commerce provider

This commit is contained in:
Luis Alvarez 2021-08-04 21:28:08 -05:00
parent 0e7e7b7d5f
commit ba889ff2b1

View File

@ -47,46 +47,42 @@ export type Provider = CommerceConfig & {
}
}
export type CommerceProps<P extends Provider> = {
children?: ReactNode
provider: P
config: CommerceConfig
}
export type CommerceConfig = Omit<
CommerceContextValue<any>,
'providerRef' | 'fetcherRef'
>
export type CommerceContextValue<P extends Provider> = {
providerRef: MutableRefObject<P>
fetcherRef: MutableRefObject<Fetcher>
export type CommerceConfig = {
locale: string
cartCookie: string
}
export type CommerceContextValue<P extends Provider> = {
providerRef: MutableRefObject<P>
fetcherRef: MutableRefObject<Fetcher>
} & CommerceConfig
export type CommerceProps<P extends Provider> = {
children?: ReactNode
provider: P
}
/**
* These are the properties every provider should allow when implementing
* the core commerce provider
*/
export type CommerceProviderProps = {
children?: ReactNode
} & Partial<CommerceConfig>
export function CommerceProvider<P extends Provider>({
provider,
children,
config,
}: CommerceProps<P>) {
if (!config) {
throw new Error('CommerceProvider requires a valid config object')
}
const providerRef = useRef(provider)
// TODO: Remove the fetcherRef
const fetcherRef = useRef(provider.fetcher)
// Because the config is an object, if the parent re-renders this provider
// will re-render every consumer unless we memoize the config
// If the parent re-renders this provider will re-render every
// consumer unless we memoize the config
const { locale, cartCookie } = providerRef.current
const cfg = useMemo(
() => ({
providerRef,
fetcherRef,
locale: config.locale,
cartCookie: config.cartCookie,
}),
[config.locale, config.cartCookie]
() => ({ providerRef, fetcherRef, locale, cartCookie }),
[locale, cartCookie]
)
return <Commerce.Provider value={cfg}>{children}</Commerce.Provider>