shopify: changes

framework/commerce/with-config.js

@@ -4,7 +4,7 @@
 
 const merge = require('deepmerge')
 
-const PROVIDERS = ['bigcommerce']
+const PROVIDERS = ['bigcommerce', 'shopify']
 
 function getProviderName() {
   return process.env.BIGCOMMERCE_STOREFRONT_API_URL ? 'bigcommerce' : null

framework/shopify/api/index.ts

@@ -3,7 +3,6 @@ import fetchGraphqlApi from './utils/fetch-graphql-api'
 
 export interface ShopifyConfig extends CommerceAPIConfig {}
 
-// TODO(bc)
 const API_URL =
   process.env.SHOPIFY_STORE_DOMAIN ||
   process.env.NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN

framework/shopify/api/utils/fetch-graphql-api.ts

@@ -21,7 +21,7 @@ const fetchGraphqlApi: GraphQLFetcher = async (
   fetchOptions
 ) => {
   const config = getConfig()
-  const url = `https://${config.commerceUrl}/api/2020-10/graphql.json`
+  const url = `https://${config.commerceUrl}/api/2021-01/graphql.json`
 
   const res = await fetch(url, {
     ...fetchOptions,

framework/shopify/cart/use-cart.tsx

@@ -1,9 +1,16 @@
 import { useCommerce } from '../index'
+import useCart, { UseCart, FetchCartInput } from '@commerce/cart/use-cart'
+import type { Cart } from '../types'
 
-export function emptyHook() {
+// export default useCart as UseCart<typeof handler>
+export default useCart as UseCart
+
+export const handler = () => {
   const { checkout } = useCommerce()
   const { lineItems, totalPriceV2 } = checkout || {}
 
+  console.log(checkout)
+
   return {
     data: {
       subTotal: totalPriceV2?.amount || 0,
@@ -38,5 +45,3 @@ export function emptyHook() {
     isLoading: false,
   }
 }
-
-export default emptyHook

framework/shopify/config.json

@@ -0,0 +1,5 @@
+{
+  "features": {
+    "wishlist": false
+  }
+}

framework/shopify/next.config.js

@@ -0,0 +1,11 @@
+const providerConfig = require('./config.json')
+
+module.exports = {
+  commerce: {
+    provider: 'shopify',
+    ...providerConfig,
+  },
+  images: {
+    domains: ['cdn.shopify.com'],
+  },
+}

framework/shopify/product/use-price.tsx

@@ -1,2 +1,2 @@
-export * from '@commerce/use-price'
-export { default } from '@commerce/use-price'
+export * from '@commerce/product/use-price'
+export { default } from '@commerce/product/use-price'

framework/shopify/provider.ts

@@ -0,0 +1,34 @@
+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'
+import { handler as useRemoveItem } from './cart/use-remove-item'
+
+import { handler as useWishlist } from './wishlist/use-wishlist'
+import { handler as useWishlistAddItem } from './wishlist/use-add-item'
+import { handler as useWishlistRemoveItem } from './wishlist/use-remove-item'
+
+import { handler as useCustomer } from './customer/use-customer'
+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 fetcher from './fetcher'
+
+export const shopifyProvider = {
+  locale: 'en-us',
+  cartCookie: 'sp_cartId',
+  fetcher,
+  cart: { useCart, useAddItem, useUpdateItem, useRemoveItem },
+  wishlist: {
+    useWishlist,
+    useAddItem: useWishlistAddItem,
+    useRemoveItem: useWishlistRemoveItem,
+  },
+  customer: { useCustomer },
+  products: { useSearch },
+  auth: { useLogin, useLogout, useSignup },
+}
+
+export type ShopifyProvider = typeof shopifyProvider