Monorepo with Turborepo (#651)

* Moved everything

* Figuring out how to make imports work

* Updated exports

* Added missing exports

* Added @vercel/commerce-local to `site`

* Updated commerce config

* Updated exports and commerce config

* Updated commerce hoc

* Fixed exports in local

* Added publish config

* Updated imports in site

* It's actually working

* Don't use debugger in dev for better speeds

* Improved DX when editing packages

* Set up eslint with husky

* Updated prettier config

* Added prettier setup to every package

* Moved bigcommerce

* Moved Bigcommerce to src and package updates

* Updated setup of bigcommerce

* Moved definitions script

* Moved commercejs

* Move to src

* Fixed types in commercejs

* Moved kibocommerce

* Moved kibocommerce to src

* Added package/tsconfig to kibocommerce

* Fixed imports and other things

* Moved ordercloud

* Moved ordercloud to src

* Fixed imports

* Added missing prettier files

* Moved Saleor

* Moved Saleor to src

* Fixed imports

* Replaced all imports to @commerce

* Added prettierignore/rc to all providers

* Moved shopify to src

* Build shopify in packages

* Moved Spree

* Moved spree to src

* Updated spree

* Moved swell

* Moved swell to src

* Fixed type imports in swell

* Moved Vendure to packages

* Moved vendure to src

* Fixed imports in vendure

* Added codegen to saleor

* Updated codegen setup for shopify

* Added codegen to vendure

* Added codegen to kibocommerce

* Added all packages to site's deps

* Updated codegen setup in bigcommerce

* Minor fixes

* Updated providers' names in site

* Updated packages based on Bel's changes

* Updated turbo to latest

* Fixed ts complains

* Set npm engine in root

* New lockfile install

* remove engines

* Regen lockfile

* Switched from npm to yarn

* Updated typesVersions in all packages

* Moved dep

* Updated SWR to the just released 1.2.0

* Removed "isolatedModules" from packages

* Updated list of providers and default

* Updated swell declaration

* Removed next import from kibocommerce

* Added COMMERCE_PROVIDER log

* Added another log

* Updated turbo config

* Updated docs

* Removed test logs

Co-authored-by: Jared Palmer <jared@jaredpalmer.com>

packages/local/.env.template

@@ -0,0 +1 @@
+COMMERCE_PROVIDER=local

packages/local/.prettierignore

@@ -0,0 +1,2 @@
+node_modules
+dist

packages/local/.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "useTabs": false
+}

packages/local/README.md

@@ -0,0 +1 @@
+# Next.js Local Provider

packages/local/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@vercel/commerce-local",
+  "version": "0.0.1",
+  "license": "MIT",
+  "scripts": {
+    "build": "rm -fr dist/* && tsc",
+    "dev": "npm run build -- --watch",
+    "prettier-fix": "prettier --write ."
+  },
+  "sideEffects": false,
+  "type": "module",
+  "exports": {
+    ".": "./dist/index.js",
+    "./*": [
+      "./dist/*.js",
+      "./dist/*/index.js"
+    ],
+    "./next.config": "./dist/next.config.cjs"
+  },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "src/*",
+        "src/*/index"
+      ],
+      "next.config": [
+        "dist/next.config.d.cts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "typesVersions": {
+      "*": {
+        "*": [
+          "dist/*.d.ts",
+          "dist/*/index.d.ts"
+        ],
+        "next.config": [
+          "dist/next.config.d.cts"
+        ]
+      }
+    }
+  },
+  "dependencies": {
+    "@vercel/commerce": "^0.0.1",
+    "@vercel/fetch": "^6.1.1"
+  },
+  "peerDependencies": {
+    "next": "^12",
+    "react": "^17",
+    "react-dom": "^17"
+  },
+  "devDependencies": {
+    "@types/node": "^17.0.8",
+    "@types/react": "^17.0.38",
+    "lint-staged": "^12.1.7",
+    "next": "^12.0.8",
+    "prettier": "^2.5.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "typescript": "^4.5.4"
+  },
+  "lint-staged": {
+    "**/*.{js,jsx,ts,tsx,json}": [
+      "prettier --write",
+      "git add"
+    ]
+  }
+}

packages/local/src/api/endpoints/cart/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/catalog/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/catalog/products.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/checkout/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/customer/address.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/customer/card.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/customer/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/login/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/logout/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/signup/index.ts

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/endpoints/wishlist/index.tsx

@@ -0,0 +1 @@
+export default function noopApi(...args: any[]): void {}

packages/local/src/api/index.ts

@@ -0,0 +1,42 @@
+import type { CommerceAPI, CommerceAPIConfig } from '@vercel/commerce/api'
+import { getCommerceApi as commerceApi } from '@vercel/commerce/api'
+import createFetcher from './utils/fetch-local'
+
+import getAllPages from './operations/get-all-pages'
+import getPage from './operations/get-page'
+import getSiteInfo from './operations/get-site-info'
+import getCustomerWishlist from './operations/get-customer-wishlist'
+import getAllProductPaths from './operations/get-all-product-paths'
+import getAllProducts from './operations/get-all-products'
+import getProduct from './operations/get-product'
+
+export interface LocalConfig extends CommerceAPIConfig {}
+const config: LocalConfig = {
+  commerceUrl: '',
+  apiToken: '',
+  cartCookie: '',
+  customerCookie: '',
+  cartCookieMaxAge: 2592000,
+  fetch: createFetcher(() => getCommerceApi().getConfig()),
+}
+
+const operations = {
+  getAllPages,
+  getPage,
+  getSiteInfo,
+  getCustomerWishlist,
+  getAllProductPaths,
+  getAllProducts,
+  getProduct,
+}
+
+export const provider = { config, operations }
+
+export type Provider = typeof provider
+export type LocalAPI<P extends Provider = Provider> = CommerceAPI<P | any>
+
+export function getCommerceApi<P extends Provider>(
+  customProvider: P = provider as any
+): LocalAPI<P> {
+  return commerceApi(customProvider as any)
+}

packages/local/src/api/operations/get-all-pages.ts

@@ -0,0 +1,19 @@
+export type Page = { url: string }
+export type GetAllPagesResult = { pages: Page[] }
+import type { LocalConfig } from '../index'
+
+export default function getAllPagesOperation() {
+  function getAllPages({
+    config,
+    preview,
+  }: {
+    url?: string
+    config?: Partial<LocalConfig>
+    preview?: boolean
+  }): Promise<GetAllPagesResult> {
+    return Promise.resolve({
+      pages: [],
+    })
+  }
+  return getAllPages
+}

packages/local/src/api/operations/get-all-product-paths.ts

@@ -0,0 +1,15 @@
+import data from '../../data.json'
+
+export type GetAllProductPathsResult = {
+  products: Array<{ path: string }>
+}
+
+export default function getAllProductPathsOperation() {
+  function getAllProductPaths(): Promise<GetAllProductPathsResult> {
+    return Promise.resolve({
+      products: data.products.map(({ path }) => ({ path })),
+    })
+  }
+
+  return getAllProductPaths
+}

packages/local/src/api/operations/get-all-products.ts

@@ -0,0 +1,25 @@
+import { Product } from '@vercel/commerce/types/product'
+import { GetAllProductsOperation } from '@vercel/commerce/types/product'
+import type { OperationContext } from '@vercel/commerce/api/operations'
+import type { LocalConfig, Provider } from '../index'
+import data from '../../data.json'
+
+export default function getAllProductsOperation({
+  commerce,
+}: OperationContext<any>) {
+  async function getAllProducts<T extends GetAllProductsOperation>({
+    query = '',
+    variables,
+    config,
+  }: {
+    query?: string
+    variables?: T['variables']
+    config?: Partial<LocalConfig>
+    preview?: boolean
+  } = {}): Promise<{ products: Product[] | any[] }> {
+    return {
+      products: data.products,
+    }
+  }
+  return getAllProducts
+}

packages/local/src/api/operations/get-customer-wishlist.ts

@@ -0,0 +1,6 @@
+export default function getCustomerWishlistOperation() {
+  function getCustomerWishlist(): any {
+    return { wishlist: {} }
+  }
+  return getCustomerWishlist
+}

packages/local/src/api/operations/get-page.ts

@@ -0,0 +1,13 @@
+export type Page = any
+export type GetPageResult = { page?: Page }
+
+export type PageVariables = {
+  id: number
+}
+
+export default function getPageOperation() {
+  function getPage(): Promise<GetPageResult> {
+    return Promise.resolve({})
+  }
+  return getPage
+}

packages/local/src/api/operations/get-product.ts

@@ -0,0 +1,26 @@
+import type { LocalConfig } from '../index'
+import { Product } from '@vercel/commerce/types/product'
+import { GetProductOperation } from '@vercel/commerce/types/product'
+import data from '../../data.json'
+import type { OperationContext } from '@vercel/commerce/api/operations'
+
+export default function getProductOperation({
+  commerce,
+}: OperationContext<any>) {
+  async function getProduct<T extends GetProductOperation>({
+    query = '',
+    variables,
+    config,
+  }: {
+    query?: string
+    variables?: T['variables']
+    config?: Partial<LocalConfig>
+    preview?: boolean
+  } = {}): Promise<Product | {} | any> {
+    return {
+      product: data.products.find(({ slug }) => slug === variables!.slug),
+    }
+  }
+
+  return getProduct
+}

packages/local/src/api/operations/get-site-info.ts

@@ -0,0 +1,43 @@
+import { OperationContext } from '@vercel/commerce/api/operations'
+import { Category } from '@vercel/commerce/types/site'
+import { LocalConfig } from '../index'
+
+export type GetSiteInfoResult<
+  T extends { categories: any[]; brands: any[] } = {
+    categories: Category[]
+    brands: any[]
+  }
+> = T
+
+export default function getSiteInfoOperation({}: OperationContext<any>) {
+  function getSiteInfo({
+    query,
+    variables,
+    config: cfg,
+  }: {
+    query?: string
+    variables?: any
+    config?: Partial<LocalConfig>
+    preview?: boolean
+  } = {}): Promise<GetSiteInfoResult> {
+    return Promise.resolve({
+      categories: [
+        {
+          id: 'new-arrivals',
+          name: 'New Arrivals',
+          slug: 'new-arrivals',
+          path: '/new-arrivals',
+        },
+        {
+          id: 'featured',
+          name: 'Featured',
+          slug: 'featured',
+          path: '/featured',
+        },
+      ],
+      brands: [],
+    })
+  }
+
+  return getSiteInfo
+}

packages/local/src/api/operations/index.ts

@@ -0,0 +1,6 @@
+export { default as getPage } from './get-page'
+export { default as getSiteInfo } from './get-site-info'
+export { default as getAllPages } from './get-all-pages'
+export { default as getProduct } from './get-product'
+export { default as getAllProducts } from './get-all-products'
+export { default as getAllProductPaths } from './get-all-product-paths'

packages/local/src/api/utils/fetch-local.ts

@@ -0,0 +1,34 @@
+import { FetcherError } from '@vercel/commerce/utils/errors'
+import type { GraphQLFetcher } from '@vercel/commerce/api'
+import type { LocalConfig } from '../index'
+import fetch from './fetch'
+
+const fetchGraphqlApi: (getConfig: () => LocalConfig) => GraphQLFetcher =
+  (getConfig) =>
+  async (query: string, { variables, preview } = {}, fetchOptions) => {
+    const config = getConfig()
+    const res = await fetch(config.commerceUrl, {
+      ...fetchOptions,
+      method: 'POST',
+      headers: {
+        ...fetchOptions?.headers,
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        query,
+        variables,
+      }),
+    })
+
+    const json = await res.json()
+    if (json.errors) {
+      throw new FetcherError({
+        errors: json.errors ?? [{ message: 'Failed to fetch for API' }],
+        status: res.status,
+      })
+    }
+
+    return { data: json.data, res }
+  }
+
+export default fetchGraphqlApi

packages/local/src/api/utils/fetch.ts

@@ -0,0 +1,3 @@
+import zeitFetch from '@vercel/fetch'
+
+export default zeitFetch()

packages/local/src/auth/index.ts

@@ -0,0 +1,3 @@
+export { default as useLogin } from './use-login'
+export { default as useLogout } from './use-logout'
+export { default as useSignup } from './use-signup'

packages/local/src/auth/use-login.tsx

@@ -0,0 +1,16 @@
+import { MutationHook } from '@vercel/commerce/utils/types'
+import useLogin, { UseLogin } from '@vercel/commerce/auth/use-login'
+
+export default useLogin as UseLogin<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher() {
+    return null
+  },
+  useHook: () => () => {
+    return async function () {}
+  },
+}

packages/local/src/auth/use-logout.tsx

@@ -0,0 +1,17 @@
+import { MutationHook } from '@vercel/commerce/utils/types'
+import useLogout, { UseLogout } from '@vercel/commerce/auth/use-logout'
+
+export default useLogout as UseLogout<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher() {
+    return null
+  },
+  useHook:
+    ({ fetch }) =>
+    () =>
+    async () => {},
+}

packages/local/src/auth/use-signup.tsx

@@ -0,0 +1,19 @@
+import { useCallback } from 'react'
+import useCustomer from '../customer/use-customer'
+import { MutationHook } from '@vercel/commerce/utils/types'
+import useSignup, { UseSignup } from '@vercel/commerce/auth/use-signup'
+
+export default useSignup as UseSignup<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher() {
+    return null
+  },
+  useHook:
+    ({ fetch }) =>
+    () =>
+    () => {},
+}

packages/local/src/cart/index.ts

@@ -0,0 +1,4 @@
+export { default as useCart } from './use-cart'
+export { default as useAddItem } from './use-add-item'
+export { default as useRemoveItem } from './use-remove-item'
+export { default as useUpdateItem } from './use-update-item'

packages/local/src/cart/use-add-item.tsx

@@ -0,0 +1,17 @@
+import useAddItem, { UseAddItem } from '@vercel/commerce/cart/use-add-item'
+import { MutationHook } from '@vercel/commerce/utils/types'
+
+export default useAddItem as UseAddItem<typeof handler>
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () => {
+      return async function addItem() {
+        return {}
+      }
+    },
+}

packages/local/src/cart/use-cart.tsx

@@ -0,0 +1,42 @@
+import { useMemo } from 'react'
+import { SWRHook } from '@vercel/commerce/utils/types'
+import useCart, { UseCart } from '@vercel/commerce/cart/use-cart'
+
+export default useCart as UseCart<typeof handler>
+
+export const handler: SWRHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher() {
+    return {
+      id: '',
+      createdAt: '',
+      currency: { code: '' },
+      taxesIncluded: '',
+      lineItems: [],
+      lineItemsSubtotalPrice: '',
+      subtotalPrice: 0,
+      totalPrice: 0,
+    }
+  },
+  useHook:
+    ({ useData }) =>
+    (input) => {
+      return useMemo(
+        () =>
+          Object.create(
+            {},
+            {
+              isEmpty: {
+                get() {
+                  return true
+                },
+                enumerable: true,
+              },
+            }
+          ),
+        []
+      )
+    },
+}

packages/local/src/cart/use-remove-item.tsx

@@ -0,0 +1,20 @@
+import { MutationHook } from '@vercel/commerce/utils/types'
+import useRemoveItem, {
+  UseRemoveItem,
+} from '@vercel/commerce/cart/use-remove-item'
+
+export default useRemoveItem as UseRemoveItem<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () => {
+      return async function removeItem(input) {
+        return {}
+      }
+    },
+}

packages/local/src/cart/use-update-item.tsx

@@ -0,0 +1,20 @@
+import { MutationHook } from '@vercel/commerce/utils/types'
+import useUpdateItem, {
+  UseUpdateItem,
+} from '@vercel/commerce/cart/use-update-item'
+
+export default useUpdateItem as UseUpdateItem<any>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () => {
+      return async function addItem() {
+        return {}
+      }
+    },
+}

packages/local/src/checkout/use-checkout.tsx

@@ -0,0 +1,16 @@
+import { SWRHook } from '@vercel/commerce/utils/types'
+import useCheckout, {
+  UseCheckout,
+} from '@vercel/commerce/checkout/use-checkout'
+
+export default useCheckout as UseCheckout<typeof handler>
+
+export const handler: SWRHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ useData }) =>
+    async (input) => ({}),
+}

packages/local/src/commerce.config.json

@@ -0,0 +1,10 @@
+{
+  "provider": "local",
+  "features": {
+    "wishlist": false,
+    "cart": false,
+    "search": false,
+    "customerAuth": false,
+    "customCheckout": false
+  }
+}

packages/local/src/customer/address/use-add-item.tsx

@@ -0,0 +1,17 @@
+import useAddItem, {
+  UseAddItem,
+} from '@vercel/commerce/customer/address/use-add-item'
+import { MutationHook } from '@vercel/commerce/utils/types'
+
+export default useAddItem as UseAddItem<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () =>
+    async () => ({}),
+}

packages/local/src/customer/card/use-add-item.tsx

@@ -0,0 +1,17 @@
+import useAddItem, {
+  UseAddItem,
+} from '@vercel/commerce/customer/card/use-add-item'
+import { MutationHook } from '@vercel/commerce/utils/types'
+
+export default useAddItem as UseAddItem<typeof handler>
+
+export const handler: MutationHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () =>
+    async () => ({}),
+}

packages/local/src/customer/index.ts

@@ -0,0 +1 @@
+export { default as useCustomer } from './use-customer'

packages/local/src/customer/use-customer.tsx

@@ -0,0 +1,17 @@
+import { SWRHook } from '@vercel/commerce/utils/types'
+import useCustomer, {
+  UseCustomer,
+} from '@vercel/commerce/customer/use-customer'
+
+export default useCustomer as UseCustomer<typeof handler>
+export const handler: SWRHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook: () => () => {
+    return async function addItem() {
+      return {}
+    }
+  },
+}

packages/local/src/data.json

@@ -0,0 +1,235 @@
+{
+  "products": [
+    {
+      "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0LzU0NDczMjUwMjQ0MjA=",
+      "name": "New Short Sleeve T-Shirt",
+      "vendor": "Next.js",
+      "path": "/new-short-sleeve-t-shirt",
+      "slug": "new-short-sleeve-t-shirt",
+      "price": { "value": 25, "currencyCode": "USD" },
+      "descriptionHtml": "<p><span>Show off your love for Next.js and Vercel with this unique,&nbsp;</span><strong>limited edition</strong><span>&nbsp;t-shirt. This design is part of a limited run, numbered drop at the June 2021 Next.js Conf. It features a unique, handcrafted triangle design. Get it while supplies last – only 200 of these shirts will be made!&nbsp;</span><strong>All proceeds will be donated to charity.</strong></p>",
+      "images": [
+        {
+          "url": "/assets/drop-shirt-0.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/drop-shirt-1.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/drop-shirt-2.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        }
+      ],
+      "variants": [
+        {
+          "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0LzU0NDczMjUwMjQ0MjAss=",
+          "options": [
+            {
+              "__typename": "MultipleChoiceOption",
+              "id": "asd",
+              "displayName": "Size",
+              "values": [
+                {
+                  "label": "XL"
+                }
+              ]
+            }
+          ]
+        }
+      ],
+      "options": [
+        {
+          "id": "option-color",
+          "displayName": "Color",
+          "values": [
+            {
+              "label": "color",
+              "hexColors": ["#222"]
+            }
+          ]
+        },
+        {
+          "id": "option-size",
+          "displayName": "Size",
+          "values": [
+            {
+              "label": "S"
+            },
+            {
+              "label": "M"
+            },
+            {
+              "label": "L"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "Z2lkOi8vc2hvcGlmeS9Qcm9ksdWN0LzU0NDczMjUwMjQ0MjA=",
+      "name": "Lightweight Jacket",
+      "vendor": "Next.js",
+      "path": "/lightweight-jacket",
+      "slug": "lightweight-jacket",
+      "price": { "value": 249.99, "currencyCode": "USD" },
+      "descriptionHtml": "<p><span>Show off your love for Next.js and Vercel with this unique,&nbsp;</span><strong>limited edition</strong><span>&nbsp;t-shirt. This design is part of a limited run, numbered drop at the June 2021 Next.js Conf. It features a unique, handcrafted triangle design. Get it while supplies last – only 200 of these shirts will be made!&nbsp;</span><strong>All proceeds will be donated to charity.</strong></p>",
+      "images": [
+        {
+          "url": "/assets/lightweight-jacket-0.png",
+          "altText": "Lightweight Jacket",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/lightweight-jacket-1.png",
+          "altText": "Lightweight Jacket",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/lightweight-jacket-2.png",
+          "altText": "Lightweight Jacket",
+          "width": 1000,
+          "height": 1000
+        }
+      ],
+      "variants": [
+        {
+          "id": "Z2lkOid8vc2hvcGlmeS9Qcm9kdWN0LzU0NDczMjUwMjQ0MjAss=",
+          "options": [
+            {
+              "__typename": "MultipleChoiceOption",
+              "id": "asd",
+              "displayName": "Size",
+              "values": [
+                {
+                  "label": "XL"
+                }
+              ]
+            }
+          ]
+        }
+      ],
+      "options": [
+        {
+          "id": "option-color",
+          "displayName": "Color",
+          "values": [
+            {
+              "label": "color",
+              "hexColors": ["#222"]
+            }
+          ]
+        },
+        {
+          "id": "option-size",
+          "displayName": "Size",
+          "values": [
+            {
+              "label": "S"
+            },
+            {
+              "label": "M"
+            },
+            {
+              "label": "L"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "Z2lkOis8vc2hvcGlmsddeS9Qcm9kdWN0LzU0NDczMjUwMjQ0MjA=",
+      "name": "Shirt",
+      "vendor": "Next.js",
+      "path": "/shirt",
+      "slug": "shirt",
+      "price": { "value": 25, "currencyCode": "USD" },
+      "descriptionHtml": "<p><span>Show off your love for Next.js and Vercel with this unique,&nbsp;</span><strong>limited edition</strong><span>&nbsp;t-shirt. This design is part of a limited run, numbered drop at the June 2021 Next.js Conf. It features a unique, handcrafted triangle design. Get it while supplies last – only 200 of these shirts will be made!&nbsp;</span><strong>All proceeds will be donated to charity.</strong></p>",
+      "images": [
+        {
+          "url": "/assets/t-shirt-0.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/t-shirt-1.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/t-shirt-2.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/t-shirt-3.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        },
+        {
+          "url": "/assets/t-shirt-4.png",
+          "altText": "Shirt",
+          "width": 1000,
+          "height": 1000
+        }
+      ],
+      "variants": [
+        {
+          "id": "Z2lkOi8vc2hvcGlmeS9Qcms9kdWN0LzU0NDczMjUwMjQ0MjAss=",
+          "options": [
+            {
+              "__typename": "MultipleChoiceOption",
+              "id": "asd",
+              "displayName": "Size",
+              "values": [
+                {
+                  "label": "XL"
+                }
+              ]
+            }
+          ]
+        }
+      ],
+      "options": [
+        {
+          "id": "option-color",
+          "displayName": "Color",
+          "values": [
+            {
+              "label": "color",
+              "hexColors": ["#222"]
+            }
+          ]
+        },
+        {
+          "id": "option-size",
+          "displayName": "Size",
+          "values": [
+            {
+              "label": "S"
+            },
+            {
+              "label": "M"
+            },
+            {
+              "label": "L"
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}

packages/local/src/fetcher.ts

@@ -0,0 +1,11 @@
+import { Fetcher } from '@vercel/commerce/utils/types'
+
+export const fetcher: Fetcher = async () => {
+  console.log('FETCHER')
+  const res = await fetch('./data.json')
+  if (res.ok) {
+    const { data } = await res.json()
+    return data
+  }
+  throw res
+}

packages/local/src/index.tsx

@@ -0,0 +1,12 @@
+import {
+  getCommerceProvider,
+  useCommerce as useCoreCommerce,
+} from '@vercel/commerce'
+import { localProvider, LocalProvider } from './provider'
+
+export { localProvider }
+export type { LocalProvider }
+
+export const CommerceProvider = getCommerceProvider(localProvider)
+
+export const useCommerce = () => useCoreCommerce<LocalProvider>()

packages/local/src/next.config.cjs

@@ -0,0 +1,8 @@
+const commerce = require('./commerce.config.json')
+
+module.exports = {
+  commerce,
+  images: {
+    domains: ['localhost'],
+  },
+}

packages/local/src/product/index.ts

@@ -0,0 +1,2 @@
+export { default as usePrice } from './use-price'
+export { default as useSearch } from './use-search'

packages/local/src/product/use-price.tsx

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

packages/local/src/product/use-search.tsx

@@ -0,0 +1,17 @@
+import { SWRHook } from '@vercel/commerce/utils/types'
+import useSearch, { UseSearch } from '@vercel/commerce/product/use-search'
+export default useSearch as UseSearch<typeof handler>
+
+export const handler: SWRHook<any> = {
+  fetchOptions: {
+    query: '',
+  },
+  async fetcher({ input, options, fetch }) {},
+  useHook: () => () => {
+    return {
+      data: {
+        products: [],
+      },
+    }
+  },
+}

packages/local/src/provider.ts

@@ -0,0 +1,22 @@
+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'
+import { handler as useRemoveItem } from './cart/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'
+
+export const localProvider = {
+  locale: 'en-us',
+  cartCookie: 'session',
+  fetcher: fetcher,
+  cart: { useCart, useAddItem, useUpdateItem, useRemoveItem },
+  customer: { useCustomer },
+  products: { useSearch },
+  auth: { useLogin, useLogout, useSignup },
+}
+
+export type LocalProvider = typeof localProvider

packages/local/src/wishlist/use-add-item.tsx

@@ -0,0 +1,13 @@
+import { useCallback } from 'react'
+
+export function emptyHook() {
+  const useEmptyHook = async (options = {}) => {
+    return useCallback(async function () {
+      return Promise.resolve()
+    }, [])
+  }
+
+  return useEmptyHook
+}
+
+export default emptyHook

packages/local/src/wishlist/use-remove-item.tsx

@@ -0,0 +1,17 @@
+import { useCallback } from 'react'
+
+type Options = {
+  includeProducts?: boolean
+}
+
+export function emptyHook(options?: Options) {
+  const useEmptyHook = async ({ id }: { id: string | number }) => {
+    return useCallback(async function () {
+      return Promise.resolve()
+    }, [])
+  }
+
+  return useEmptyHook
+}
+
+export default emptyHook

packages/local/src/wishlist/use-wishlist.tsx

@@ -0,0 +1,43 @@
+import { HookFetcher } from '@vercel/commerce/utils/types'
+import type { Product } from '@vercel/commerce/types/product'
+
+const defaultOpts = {}
+
+export type Wishlist = {
+  items: [
+    {
+      product_id: number
+      variant_id: number
+      id: number
+      product: Product
+    }
+  ]
+}
+
+export interface UseWishlistOptions {
+  includeProducts?: boolean
+}
+
+export interface UseWishlistInput extends UseWishlistOptions {
+  customerId?: number
+}
+
+export const fetcher: HookFetcher<Wishlist | null, UseWishlistInput> = () => {
+  return null
+}
+
+export function extendHook(
+  customFetcher: typeof fetcher,
+  // swrOptions?: SwrOptions<Wishlist | null, UseWishlistInput>
+  swrOptions?: any
+) {
+  const useWishlist = ({ includeProducts }: UseWishlistOptions = {}) => {
+    return { data: null }
+  }
+
+  useWishlist.extend = extendHook
+
+  return useWishlist
+}
+
+export default extendHook(fetcher)

packages/local/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "outDir": "dist",
+    "baseUrl": "src",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "declaration": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "esModuleInterop": true,
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "incremental": true,
+    "jsx": "react-jsx"
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "dist"]
+}