Update types (#831)

* Update product types

* Cart types progress, add zod & initial schema validator

* Update normalize.ts

* Update with-schema-parser.ts

* Updated types, schemas & providers

* Fix providers after schema parse errors

* Fix paths

* More provider fixes

* Fix kibocommerce & commercejs

* Add customer updated types & fixes

* Add checkout & customer types

* Import core types only from commerce

* Update tsconfig.json

* Convert hooks interfaces to types

* Requested changes

* Change to relative paths

* Move Zod dependency

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

@@ -1,6 +1,6 @@
 import { GetAPISchema, createEndpoint } from '@vercel/commerce/api'
 import checkoutEndpoint from '@vercel/commerce/api/endpoints/checkout'
-import type { CheckoutSchema } from '../../../types/checkout'
+import type { CheckoutSchema } from '@vercel/commerce/types/checkout'
 import type { CommercejsAPI } from '../..'
 
 import submitCheckout from './submit-checkout'

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

@@ -1,6 +1,6 @@
 import { GetAPISchema, createEndpoint } from '@vercel/commerce/api'
 import loginEndpoint from '@vercel/commerce/api/endpoints/login'
-import type { LoginSchema } from '../../../types/login'
+import type { LoginSchema } from '@vercel/commerce/types/login'
 import type { CommercejsAPI } from '../..'
 import login from './login'
 

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

@@ -1,5 +1,5 @@
 import type { CommercejsConfig } from '..'
-import { GetAllPagesOperation } from '../../types/page'
+import { GetAllPagesOperation } from '@vercel/commerce/types/page'
 
 export type Page = { url: string }
 export type GetAllPagesResult = { pages: Page[] }

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

@@ -1,9 +1,5 @@
 import type { OperationContext } from '@vercel/commerce/api/operations'
-import type {
-  GetAllProductPathsOperation,
-  CommercejsProduct,
-} from '../../types/product'
-
+import type { GetAllProductPathsOperation } from '@vercel/commerce/types/product'
 import type { CommercejsConfig, Provider } from '..'
 
 export type GetAllProductPathsResult = {
@@ -22,7 +18,7 @@ export default function getAllProductPathsOperation({
     const { data } = await sdkFetch('products', 'list')
 
     // Match a path for every product retrieved
-    const productPaths = data.map(({ permalink }: CommercejsProduct) => ({
+    const productPaths = data.map(({ permalink }: { permalink: string }) => ({
       path: `/${permalink}`,
     }))
 

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

@@ -1,5 +1,5 @@
 import type { OperationContext } from '@vercel/commerce/api/operations'
-import type { GetAllProductsOperation } from '../../types/product'
+import type { GetAllProductsOperation } from '@vercel/commerce/types/product'
 import type { CommercejsConfig, Provider } from '../index'
 
 import { normalizeProduct } from '../../utils/normalize-product'

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

@@ -1,4 +1,4 @@
-import { GetPageOperation } from '../../types/page'
+import { GetPageOperation } from '@vercel/commerce/types/page'
 
 export type Page = any
 export type GetPageResult = { page?: Page }

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

@@ -1,5 +1,5 @@
 import type { OperationContext } from '@vercel/commerce/api/operations'
-import type { GetProductOperation } from '../../types/product'
+import type { GetProductOperation } from '@vercel/commerce/types/product'
 import type { CommercejsConfig, Provider } from '../index'
 import { normalizeProduct } from '../../utils/normalize-product'
 

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

@@ -1,5 +1,8 @@
 import type { OperationContext } from '@vercel/commerce/api/operations'
-import type { Category, GetSiteInfoOperation } from '../../types/site'
+import type {
+  Category,
+  GetSiteInfoOperation,
+} from '@vercel/commerce/types/site'
 import { normalizeCategory } from '../../utils/normalize-category'
 import type { CommercejsConfig, Provider } from '../index'
 

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

@@ -2,7 +2,7 @@ import type { AddItemHook } from '@vercel/commerce/types/cart'
 import type { MutationHook } from '@vercel/commerce/utils/types'
 import { useCallback } from 'react'
 import useAddItem, { UseAddItem } from '@vercel/commerce/cart/use-add-item'
-import type { CommercejsCart } from '../types/cart'
+import type { CommercejsCart } from '../types'
 import { normalizeCart } from '../utils/normalize-cart'
 import useCart from './use-cart'
 

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

@@ -2,7 +2,7 @@ import { useMemo } from 'react'
 import type { GetCartHook } from '@vercel/commerce/types/cart'
 import { SWRHook } from '@vercel/commerce/utils/types'
 import useCart, { UseCart } from '@vercel/commerce/cart/use-cart'
-import type { CommercejsCart } from '../types/cart'
+import type { CommercejsCart } from '../types'
 import { normalizeCart } from '../utils/normalize-cart'
 
 export default useCart as UseCart<typeof handler>

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

@@ -1,8 +1,10 @@
 import { useCallback } from 'react'
 import type { MutationHook } from '@vercel/commerce/utils/types'
 import type { RemoveItemHook } from '@vercel/commerce/types/cart'
-import useRemoveItem, { UseRemoveItem } from '@vercel/commerce/cart/use-remove-item'
-import type { CommercejsCart } from '../types/cart'
+import useRemoveItem, {
+  UseRemoveItem,
+} from '@vercel/commerce/cart/use-remove-item'
+import type { CommercejsCart } from '../types'
 import { normalizeCart } from '../utils/normalize-cart'
 import useCart from './use-cart'
 

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

@@ -1,4 +1,8 @@
-import type { UpdateItemHook, LineItem } from '@vercel/commerce/types/cart'
+import type {
+  UpdateItemHook,
+  LineItem,
+  Cart,
+} from '@vercel/commerce/types/cart'
 import type {
   HookFetcherContext,
   MutationHookContext,
@@ -6,8 +10,10 @@ import type {
 import { ValidationError } from '@vercel/commerce/utils/errors'
 import debounce from 'lodash.debounce'
 import { useCallback } from 'react'
-import useUpdateItem, { UseUpdateItem } from '@vercel/commerce/cart/use-update-item'
-import type { CommercejsCart } from '../types/cart'
+import useUpdateItem, {
+  UseUpdateItem,
+} from '@vercel/commerce/cart/use-update-item'
+import type { CommercejsCart } from '../types'
 import { normalizeCart } from '../utils/normalize-cart'
 import useCart from './use-cart'
 

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

@@ -1,25 +1,17 @@
-import type { AddItemHook } from '@vercel/commerce/types/customer/address'
-import type { MutationHook } from '@vercel/commerce/utils/types'
-import { useCallback } from 'react'
-import useAddItem, { UseAddItem } from '@vercel/commerce/customer/address/use-add-item'
-import { useCheckoutContext } from '@components/checkout/context'
+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<AddItemHook> = {
+export const handler: MutationHook<any> = {
   fetchOptions: {
-    query: '_',
-    method: '_',
+    query: '',
   },
-  useHook: () =>
-    function useHook() {
-      const { setAddressFields } = useCheckoutContext()
-      return useCallback(
-        async function addItem(input) {
-          setAddressFields(input)
-          return undefined
-        },
-        [setAddressFields]
-      )
-    },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () =>
+    async () => ({}),
 }

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

@@ -1,25 +1,17 @@
-import type { AddItemHook } from '@vercel/commerce/types/customer/card'
-import type { MutationHook } from '@vercel/commerce/utils/types'
-import { useCallback } from 'react'
-import useAddItem, { UseAddItem } from '@vercel/commerce/customer/card/use-add-item'
-import { useCheckoutContext } from '@components/checkout/context'
+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<AddItemHook> = {
+export const handler: MutationHook<any> = {
   fetchOptions: {
-    url: '_',
-    method: '_',
+    query: '',
   },
-  useHook: () =>
-    function useHook() {
-      const { setCardFields } = useCheckoutContext()
-      return useCallback(
-        async function addItem(input) {
-          setCardFields(input)
-          return undefined
-        },
-        [setCardFields]
-      )
-    },
+  async fetcher({ input, options, fetch }) {},
+  useHook:
+    ({ fetch }) =>
+    () =>
+    async () => ({}),
 }

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

@@ -1,9 +1,11 @@
 import Cookies from 'js-cookie'
 import { decode } from 'jsonwebtoken'
 import { SWRHook } from '@vercel/commerce/utils/types'
-import useCustomer, { UseCustomer } from '@vercel/commerce/customer/use-customer'
+import useCustomer, {
+  UseCustomer,
+} from '@vercel/commerce/customer/use-customer'
 import { CUSTOMER_COOKIE, API_URL } from '../constants'
-import type { CustomerHook } from '../types/customer'
+import type { CustomerHook } from '@vercel/commerce/types/customer'
 
 export default useCustomer as UseCustomer<typeof handler>
 export const handler: SWRHook<CustomerHook> = {
@@ -13,12 +15,13 @@ export const handler: SWRHook<CustomerHook> = {
   },
   async fetcher({ options, fetch }) {
     const token = Cookies.get(CUSTOMER_COOKIE)
+
     if (!token) {
       return null
     }
 
     const decodedToken = decode(token) as { cid: string }
-    const customer = await fetch({
+    const customer = await fetch<any>({
       query: options.query,
       method: options.method,
       variables: [
@@ -29,7 +32,16 @@ export const handler: SWRHook<CustomerHook> = {
         token,
       ],
     })
+
     return customer
+      ? {
+          id: customer.id,
+          firstName: customer.firstname,
+          lastName: customer.lastname,
+          email: customer.email,
+          phone: customer.phone,
+        }
+      : null
   },
   useHook:
     ({ useData }) =>

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

@@ -1,7 +1,7 @@
 import { SWRHook } from '@vercel/commerce/utils/types'
 import useSearch, { UseSearch } from '@vercel/commerce/product/use-search'
 import { SearchProductsHook } from '@vercel/commerce/types/product'
-import type { CommercejsProduct } from '../types/product'
+import type { CommercejsProduct } from '../types'
 import { getProductSearchVariables } from '../utils/product-search'
 import { normalizeProduct } from '../utils/normalize-product'
 

packages/commercejs/src/types.ts

@@ -0,0 +1,6 @@
+export type { Cart as CommercejsCart } from '@chec/commerce.js/types/cart'
+export type { LineItem as CommercejsLineItem } from '@chec/commerce.js/types/line-item'
+export type { CheckoutCapture as CommercejsCheckoutCapture } from '@chec/commerce.js/types/checkout-capture'
+export type { Product as CommercejsProduct } from '@chec/commerce.js/types/product'
+export type { Variant as CommercejsVariant } from '@chec/commerce.js/types/variant'
+export type { Category as CommercejsCategory } from '@chec/commerce.js/types/category'

packages/commercejs/src/types/cart.ts

@@ -1,4 +0,0 @@
-export * from '@vercel/commerce/types/cart'
-
-export type { Cart as CommercejsCart } from '@chec/commerce.js/types/cart'
-export type { LineItem as CommercejsLineItem } from '@chec/commerce.js/types/line-item'

packages/commercejs/src/types/checkout.ts

@@ -1,3 +0,0 @@
-export * from '@vercel/commerce/types/checkout'
-
-export type { CheckoutCapture as CommercejsCheckoutCapture } from '@chec/commerce.js/types/checkout-capture'

packages/commercejs/src/types/common.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/common'

packages/commercejs/src/types/customer.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/customer'

packages/commercejs/src/types/index.ts

@@ -1,25 +0,0 @@
-import * as Cart from './cart'
-import * as Checkout from './checkout'
-import * as Common from './common'
-import * as Customer from './customer'
-import * as Login from './login'
-import * as Logout from './logout'
-import * as Page from './page'
-import * as Product from './product'
-import * as Signup from './signup'
-import * as Site from './site'
-import * as Wishlist from './wishlist'
-
-export type {
-  Cart,
-  Checkout,
-  Common,
-  Customer,
-  Login,
-  Logout,
-  Page,
-  Product,
-  Signup,
-  Site,
-  Wishlist,
-}

packages/commercejs/src/types/login.ts

@@ -1,9 +0,0 @@
-import { LoginBody, LoginTypes } from '@vercel/commerce/types/login'
-export * from '@vercel/commerce/types/login'
-
-export type LoginHook<T extends LoginTypes = LoginTypes> = {
-  data: null
-  actionInput: LoginBody
-  fetcherInput: LoginBody
-  body: T['body']
-}

packages/commercejs/src/types/logout.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/logout'

packages/commercejs/src/types/page.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/page'

packages/commercejs/src/types/product.ts

@@ -1,4 +0,0 @@
-export * from '@vercel/commerce/types/product'
-
-export type { Product as CommercejsProduct } from '@chec/commerce.js/types/product'
-export type { Variant as CommercejsVariant } from '@chec/commerce.js/types/variant'

packages/commercejs/src/types/signup.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/signup'

packages/commercejs/src/types/site.ts

@@ -1,3 +0,0 @@
-export * from '@vercel/commerce/types/site'
-
-export type { Category as CommercejsCategory } from '@chec/commerce.js/types/category'

packages/commercejs/src/types/wishlist.ts

@@ -1 +0,0 @@
-export * from '@vercel/commerce/types/wishlist'

packages/commercejs/src/utils/normalize-cart.ts

@@ -1,9 +1,5 @@
-import type {
-  Cart,
-  LineItem,
-  CommercejsCart,
-  CommercejsLineItem,
-} from '../types/cart'
+import type { Cart, LineItem } from '@vercel/commerce/types/cart'
+import type { CommercejsCart, CommercejsLineItem } from '../types'
 
 type CommercejsLineItemType = CommercejsLineItem & { image: { url: string } }
 

packages/commercejs/src/utils/normalize-category.ts

@@ -9,6 +9,6 @@ export function normalizeCategory(
     id,
     name,
     slug,
-    path: slug,
+    path: `/${slug}`,
   }
 }

packages/commercejs/src/utils/normalize-checkout.ts

@@ -1,6 +1,6 @@
 import type { CardFields } from '@vercel/commerce/types/customer/card'
 import type { AddressFields } from '@vercel/commerce/types/customer/address'
-import type { CommercejsCheckoutCapture } from '../types/checkout'
+import type { CommercejsCheckoutCapture } from '../types'
 
 /**
  * Creates a checkout payload suitable for test checkouts.

packages/commercejs/src/utils/normalize-product.ts

@@ -1,8 +1,5 @@
-import type {
-  Product,
-  CommercejsProduct,
-  CommercejsVariant,
-} from '../types/product'
+import type { Product } from '@vercel/commerce/types/product'
+import type { CommercejsProduct, CommercejsVariant } from '../types'
 
 function getOptionsFromVariantGroups(
   variantGroups: CommercejsProduct['variant_groups']
@@ -26,6 +23,7 @@ function normalizeVariants(
   if (!Array.isArray(variants)) return []
   return variants?.map((variant) => ({
     id: variant.id,
+    sku: variant.sku ?? variant.id,
     options: Object.entries(variant.options).map(
       ([variantGroupId, variantOptionId]) => {
         const variantGroupFromId = variantGroups.find(
@@ -62,7 +60,7 @@ export function normalizeProduct(
     description,
     descriptionHtml: description,
     slug: permalink,
-    path: permalink,
+    path: `/${permalink}`,
     images: assets.map(({ url, description, filename }) => ({
       url,
       alt: description || filename,

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

@@ -1,16 +1,6 @@
+import type { Wishlist } from '@vercel/commerce/types/wishlist'
 import { HookFetcher } from '@vercel/commerce/utils/types'
 
-export type Wishlist = {
-  items: [
-    {
-      product_id: number
-      variant_id: number
-      id: number
-      product: any
-    }
-  ]
-}
-
 export interface UseWishlistOptions {
   includeProducts?: boolean
 }