diff --git a/framework/commerce/index.tsx b/framework/commerce/index.tsx index 7ecb44dc1..8cafb5ad4 100644 --- a/framework/commerce/index.tsx +++ b/framework/commerce/index.tsx @@ -47,46 +47,42 @@ export type Provider = CommerceConfig & { } } -export type CommerceProps

= { - children?: ReactNode - provider: P - config: CommerceConfig -} - -export type CommerceConfig = Omit< - CommerceContextValue, - 'providerRef' | 'fetcherRef' -> - -export type CommerceContextValue

= { - providerRef: MutableRefObject

- fetcherRef: MutableRefObject +export type CommerceConfig = { locale: string cartCookie: string } +export type CommerceContextValue

= { + providerRef: MutableRefObject

+ fetcherRef: MutableRefObject +} & CommerceConfig + +export type CommerceProps

= { + children?: ReactNode + provider: P +} + +/** + * These are the properties every provider should allow when implementing + * the core commerce provider + */ +export type CommerceProviderProps = { + children?: ReactNode +} & Partial + export function CommerceProvider

({ provider, children, - config, }: CommerceProps

) { - 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 {children}