Merge branch 'main' into spree-framework-poc

framework/spree/.env.template

@@ -2,7 +2,7 @@
 
 COMMERCE_PROVIDER=spree
 
-{# - public (available in the web browser) #}
+{# - NEXT_PUBLIC_* are exposed to the web browser and the server #}
 NEXT_PUBLIC_SPREE_API_HOST=http://localhost:4000
 NEXT_PUBLIC_SPREE_DEFAULT_LOCALE=en-us
 NEXT_PUBLIC_SPREE_CART_COOKIE_NAME=spree_cart_token

framework/spree/index.tsx

@@ -1,37 +1,11 @@
-import * as React from 'react'
-import { ReactNode } from 'react'
+import { getCommerceProvider, useCommerce as useCoreCommerce } from '@commerce'
+import { spreeProvider } from './provider'
+import type { SpreeProvider } from './provider'
 
-import {
-  CommerceConfig,
-  CommerceProvider as CoreCommerceProvider,
-  useCommerce as useCoreCommerce,
-} from '@commerce'
+export { spreeProvider }
+export type { SpreeProvider }
 
-import { provider } from './provider'
-import type { Provider } from './provider'
-import { requireConfigValue } from './isomorphic-config'
+export const CommerceProvider =
+  getCommerceProvider<SpreeProvider>(spreeProvider)
 
-export type SpreeProps = {
-  children: ReactNode
-  locale: string
-}
-
-export const spreeCommerceConfigDefaults: CommerceConfig = {
-  locale: requireConfigValue('defaultLocale') as string,
-  cartCookie: requireConfigValue('cartCookieName') as string,
-}
-
-export type SpreeConfig = CommerceConfig
-
-export function CommerceProvider({ children, ...restProps }: SpreeProps) {
-  return (
-    <CoreCommerceProvider<Provider>
-      provider={provider}
-      config={{ ...spreeCommerceConfigDefaults, ...restProps }}
-    >
-      {children}
-    </CoreCommerceProvider>
-  )
-}
-
-export const useCommerce = () => useCoreCommerce<Provider>()
+export const useCommerce = () => useCoreCommerce<SpreeProvider>()

framework/spree/provider.ts

@@ -1,6 +1,4 @@
-import type { Provider } from '@commerce'
 import fetcher from './fetcher'
-
 import { handler as useCart } from './cart/use-cart'
 import { handler as useAddItem } from './cart/use-add-item'
 import { handler as useUpdateItem } from './cart/use-update-item'
@@ -10,10 +8,11 @@ import { handler as useSearch } from './product/use-search'
 import { handler as useLogin } from './auth/use-login'
 import { handler as useLogout } from './auth/use-logout'
 import { handler as useSignup } from './auth/use-signup'
+import { requireConfigValue } from './isomorphic-config'
 
-const provider = {
-  locale: '', // Not an optional key in TypeScript, but already set in config. So, just make it an empty string.
-  cartCookie: '', // Not an optional key in TypeScript, but already set in config. So, just make it an empty string.
+const spreeProvider = {
+  locale: requireConfigValue('defaultLocale') as string,
+  cartCookie: requireConfigValue('cartCookieName') as string,
   fetcher,
   cart: { useCart, useAddItem, useUpdateItem, useRemoveItem },
   customer: { useCustomer },
@@ -21,6 +20,6 @@ const provider = {
   auth: { useLogin, useLogout, useSignup },
 }
 
-export { provider }
+export { spreeProvider }
 
-export type { Provider }
+export type SpreeProvider = typeof spreeProvider