From 6bdfe56e9f749402b10b79a5ce752c43c4103d90 Mon Sep 17 00:00:00 2001 From: Catalin Pinte <1243434+cond0r@users.noreply.github.com> Date: Mon, 19 Sep 2022 11:06:22 +0300 Subject: [PATCH] Add checkout & customer types --- packages/commerce/src/types/cart.ts | 31 +---------- packages/commerce/src/types/checkout.ts | 54 ++++++++++++++++--- .../commerce/src/types/customer/address.ts | 15 +----- packages/commerce/src/types/customer/card.ts | 23 ++------ packages/commerce/src/types/product.ts | 16 ++++-- packages/commerce/src/types/wishlist.ts | 9 ++-- .../api/endpoints/checkout/get-checkout.ts | 2 + .../ordercloud/src/checkout/use-checkout.tsx | 6 ++- packages/shopify/src/api/index.ts | 18 ++++++- packages/shopify/src/api/operations/index.ts | 7 --- pnpm-lock.yaml | 12 ++++- 11 files changed, 101 insertions(+), 92 deletions(-) delete mode 100644 packages/shopify/src/api/operations/index.ts diff --git a/packages/commerce/src/types/cart.ts b/packages/commerce/src/types/cart.ts index f0b975be4..686308029 100644 --- a/packages/commerce/src/types/cart.ts +++ b/packages/commerce/src/types/cart.ts @@ -169,7 +169,7 @@ export interface CartItemBody { } /** - * Hooks for add, update & remove items from the cart. + * Cart Hooks for add, update and remove items from the cart */ export type CartHooks = { getCart: GetCartHook @@ -178,9 +178,6 @@ export type CartHooks = { removeItem: RemoveItemHook } -/** - * Hook for getting the cart. - */ export interface GetCartHook { data: Cart | null input: {} @@ -188,9 +185,6 @@ export interface GetCartHook { swrState: { isEmpty: boolean } } -/** - * Hook for adding an item to the cart. - */ export interface AddItemHook { data: Cart input?: CartItemBody @@ -199,9 +193,6 @@ export interface AddItemHook { actionInput: CartItemBody } -/** - * Hook for updating an item in the cart. - */ export interface UpdateItemHook { data: Cart | null | undefined input: { item?: LineItem; wait?: number } @@ -210,9 +201,6 @@ export interface UpdateItemHook { actionInput: CartItemBody & { id: string } } -/** - * Hook for removing an item from the cart. - */ export interface RemoveItemHook { data: Cart | null | undefined input: { item?: LineItem } @@ -222,7 +210,7 @@ export interface RemoveItemHook { } /** - * Cart API Schema. + * Cart API endpoitns & handlers for add, update and remove items from the cart */ export type CartSchema = { endpoint: { @@ -231,9 +219,6 @@ export type CartSchema = { } } -/** - * API Handlers for adding, updating & removing items from the cart. - */ export type CartHandlers = { getCart: GetCartHandler addItem: AddItemHandler @@ -241,31 +226,19 @@ export type CartHandlers = { removeItem: RemoveItemHandler } -/** - * API Handler for getting the cart. - */ export type GetCartHandler = GetCartHook & { body: { cartId?: string } } -/** - * API Handler for adding an item to the cart. - */ export type AddItemHandler = AddItemHook & { body: { cartId: string } } -/** - * API Handler for updating an item in the cart. - */ export type UpdateItemHandler = UpdateItemHook & { data: Cart body: { cartId: string } } -/** - * API Handler for removing an item from the cart. - */ export type RemoveItemHandler = RemoveItemHook & { body: { cartId: string } } diff --git a/packages/commerce/src/types/checkout.ts b/packages/commerce/src/types/checkout.ts index 01bf6716b..6c5d41212 100644 --- a/packages/commerce/src/types/checkout.ts +++ b/packages/commerce/src/types/checkout.ts @@ -1,13 +1,53 @@ import type { UseSubmitCheckout } from '../checkout/use-submit-checkout' import type { Address, AddressFields } from './customer/address' import type { Card, CardFields } from './customer/card' +import type { LineItem } from './cart' -// Index -export type Checkout = any +export type Checkout = { + /** + * Indicates if the payment has been submitted. + */ + hasPayment: boolean + /** + * Indicates if the checkout has shipping information collected. + */ + hasShipping: boolean + /** + * The unique identifier for the address that the customer has selected for shipping. + */ + addressId: string + /** + * The list of payments that the customer has selected for the checkout. + */ + payments?: Card[] + /** + * The unique identifier of the card that the customer has selected for payment. + */ + cardId?: string + /** + * List of items in the checkout. + */ + lineItems?: LineItem[] +} -export type CheckoutBody = any +export type CheckoutBody = { + /** + * The unique identifier for the cart. + */ + cartId?: string + /** + * The Card information. + * @see @vercel/commerce/types/customer/card/CardFields + */ + card: CardFields + /** + * The Address information. + * @see AddressFields + */ + address: AddressFields +} -export type CheckoutTypes = { +export interface CheckoutTypes { card?: Card | CardFields address?: Address | AddressFields checkout?: Checkout @@ -15,7 +55,7 @@ export type CheckoutTypes = { hasShipping?: boolean } -export type SubmitCheckoutHook = { +export interface SubmitCheckoutHook { data: Checkout input?: CheckoutBody fetcherInput: CheckoutBody @@ -23,7 +63,7 @@ export type SubmitCheckoutHook = { actionInput: CheckoutBody } -export type GetCheckoutHook = { +export interface GetCheckoutHook { data: Checkout | null | undefined input: {} fetcherInput: { cartId?: string } @@ -31,7 +71,7 @@ export type GetCheckoutHook = { mutations: { submit: UseSubmitCheckout } } -export type CheckoutHooks = { +export interface CheckoutHooks { submitCheckout?: SubmitCheckoutHook getCheckout: GetCheckoutHook } diff --git a/packages/commerce/src/types/customer/address.ts b/packages/commerce/src/types/customer/address.ts index e0895e3c7..f32fa5cab 100644 --- a/packages/commerce/src/types/customer/address.ts +++ b/packages/commerce/src/types/customer/address.ts @@ -50,8 +50,9 @@ export interface AddressFields { } /** - * Hook for getting a customer's addresses. + * Hooks for managing a customer's addresses. */ + export interface GetAddressesHook { data: Address[] | null input: {} @@ -59,9 +60,6 @@ export interface GetAddressesHook { swrState: { isEmpty: boolean } } -/** - * Hook for adding an address to a customer's account. - */ export interface AddItemHook { data: Address input?: AddressFields @@ -70,9 +68,6 @@ export interface AddItemHook { actionInput: AddressFields } -/** - * Hook for updating an address to a customer's account. - */ export interface UpdateItemHook { data: Address | null input: { item?: AddressFields; wait?: number } @@ -81,9 +76,6 @@ export interface UpdateItemHook { actionInput: AddressFields & { id: string } } -/** - * Hook for deliting an address to a customer's account. - */ export interface RemoveItemHook { data: Address | null | undefined input: { item?: Address } @@ -92,9 +84,6 @@ export interface RemoveItemHook { actionInput: { id: string } } -/** - * Hooks for managing a customer's addresses. - */ export interface CustomerAddressHooks { getAddresses: GetAddressesHook addItem: AddItemHook diff --git a/packages/commerce/src/types/customer/card.ts b/packages/commerce/src/types/customer/card.ts index 15583b11b..406d74b89 100644 --- a/packages/commerce/src/types/customer/card.ts +++ b/packages/commerce/src/types/customer/card.ts @@ -67,8 +67,9 @@ export interface CardFields { } /** - * Hook for getting a customer's cards. + * Hooks for managing a customer's cards. */ + export interface GetCardsHook { data: Card[] | null input: {} @@ -76,9 +77,6 @@ export interface GetCardsHook { swrState: { isEmpty: boolean } } -/** - * Hook for adding a card to a customer's account. - */ export interface AddItemHook { data: Card input?: CardFields @@ -87,9 +85,6 @@ export interface AddItemHook { actionInput: CardFields } -/** - * Hook for updating a card from a customer's account. - */ export interface UpdateItemHook { data: Card | null | undefined input: { item?: CardFields; wait?: number } @@ -98,9 +93,6 @@ export interface UpdateItemHook { actionInput: CardFields & { id: string } } -/** - * Hook for removing a card from a customer's account. - */ export interface RemoveItemHook { data: Card | null | undefined input: { item?: Card } @@ -109,9 +101,6 @@ export interface RemoveItemHook { actionInput: { id: string } } -/** - * Hooks for add, update & remove items from the cart. - */ export interface CustomerCardHooks { getCards: GetCardsHook addItem: AddItemHook @@ -120,7 +109,7 @@ export interface CustomerCardHooks { } /** - * Customer card API handler + * Customer card API handlers. */ export type AddItemHandler = AddItemHook & { body: { cartId: string } @@ -135,9 +124,6 @@ export type RemoveItemHandler = RemoveItemHook & { body: { cartId: string } } -/** - * Customer card API handlers. - */ export type CustomerCardHandlers = { getCards: GetCardsHook addItem: AddItemHandler @@ -145,9 +131,6 @@ export type CustomerCardHandlers = { removeItem: RemoveItemHandler } -/** - * Customer card API endpoints. - */ export type CustomerCardSchema = { endpoint: { options: {} diff --git a/packages/commerce/src/types/product.ts b/packages/commerce/src/types/product.ts index fee515eac..5c0790217 100644 --- a/packages/commerce/src/types/product.ts +++ b/packages/commerce/src/types/product.ts @@ -7,6 +7,7 @@ export interface ProductPrice { value: number /** * The currency code for the price. This is a 3-letter ISO 4217 code. + * @example USD */ currencyCode?: 'USD' | 'EUR' | 'ARS' | 'GBP' | string /** @@ -23,10 +24,12 @@ export interface ProductOption { id: string /** * The product option’s name. + * @example `Color` or `Size` */ displayName: string /** * List of option values. + * @example `["Red", "Green", "Blue"]` */ values: ProductOptionValues[] } @@ -156,6 +159,9 @@ export interface SearchProductsBody { locale?: string } +/** + * Fetches a list of products based on the given search criteria. + */ export interface SearchProductsHook { data: { /** @@ -175,6 +181,7 @@ export interface SearchProductsHook { /** * Product API schema */ + export interface ProductsSchema { endpoint: { options: {} @@ -184,6 +191,10 @@ export interface ProductsSchema { } } +/** + * Product operations + */ + export interface GetAllProductPathsOperation { data: { products: Pick[] } variables: { first?: number } @@ -199,11 +210,6 @@ export interface GetAllProductsOperation { } export interface GetProductOperation { - /** - * Returned data from the operation. - */ data: { product?: Product } - /** - * The variables to pass to the operation.*/ variables: { path: string; slug?: never } | { path?: never; slug: string } } diff --git a/packages/commerce/src/types/wishlist.ts b/packages/commerce/src/types/wishlist.ts index 283fbb4d9..aa6341963 100644 --- a/packages/commerce/src/types/wishlist.ts +++ b/packages/commerce/src/types/wishlist.ts @@ -30,23 +30,22 @@ export interface Wishlist { items: WishlistItem[] /** - * TODO: Spree provider specific + * Some providers require a token to add an item to a wishlist */ token?: string } export interface WishlistItemBody { /** - * The product's variant id. + * The unique identifier for the product variant to associate with the wishlist. */ variantId: string /** - * The product's ID. + * The unique identifier for the product to associate with the wishlist. */ productId: string - /** - * TODO: Spree provider specific + * Some providers require to provide a token to make a request */ wishlistToken?: string } diff --git a/packages/ordercloud/src/api/endpoints/checkout/get-checkout.ts b/packages/ordercloud/src/api/endpoints/checkout/get-checkout.ts index c0ab1a40d..eacf88e83 100644 --- a/packages/ordercloud/src/api/endpoints/checkout/get-checkout.ts +++ b/packages/ordercloud/src/api/endpoints/checkout/get-checkout.ts @@ -39,6 +39,8 @@ const getCheckout: CheckoutEndpoint['handlers']['getCheckout'] = async ({ data: { hasPayment: payments.length > 0, hasShipping: Boolean(address), + addressId: address, + cardId: payments[0]?.ID, }, errors: [], }) diff --git a/packages/ordercloud/src/checkout/use-checkout.tsx b/packages/ordercloud/src/checkout/use-checkout.tsx index f60ebfdd9..67d92708f 100644 --- a/packages/ordercloud/src/checkout/use-checkout.tsx +++ b/packages/ordercloud/src/checkout/use-checkout.tsx @@ -2,7 +2,9 @@ import type { GetCheckoutHook } from '@vercel/commerce/types/checkout' import { useMemo } from 'react' import { SWRHook } from '@vercel/commerce/utils/types' -import useCheckout, { UseCheckout } from '@vercel/commerce/checkout/use-checkout' +import useCheckout, { + UseCheckout, +} from '@vercel/commerce/checkout/use-checkout' import useSubmitCheckout from './use-submit-checkout' export default useCheckout as UseCheckout @@ -24,7 +26,7 @@ export const handler: SWRHook = { Object.create(response, { isEmpty: { get() { - return (response.data?.lineItems?.length ?? 0) <= 0 + return response.data?.lineItems?.length ?? 0 }, enumerable: true, }, diff --git a/packages/shopify/src/api/index.ts b/packages/shopify/src/api/index.ts index 7ae6a4206..6412adaca 100644 --- a/packages/shopify/src/api/index.ts +++ b/packages/shopify/src/api/index.ts @@ -13,7 +13,13 @@ import { import fetchGraphqlApi from './utils/fetch-graphql-api' -import * as operations from './operations' +import getAllPages from './operations/get-all-pages' +import getPage from './operations/get-page' +import getAllProducts from './operations/get-all-products' +import getAllProductPaths from './operations/get-all-product-paths' +import getProduct from './operations/get-product' +import getSiteInfo from './operations/get-site-info' +import login from './operations/login' if (!API_URL) { throw new Error( @@ -41,7 +47,15 @@ const config: ShopifyConfig = { export const provider = { config, - operations, + operations: { + login, + getSiteInfo, + getAllPages, + getPage, + getAllProducts, + getAllProductPaths, + getProduct, + }, } export type Provider = typeof provider diff --git a/packages/shopify/src/api/operations/index.ts b/packages/shopify/src/api/operations/index.ts deleted file mode 100644 index 7872a20b6..000000000 --- a/packages/shopify/src/api/operations/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -export { default as getAllPages } from './get-all-pages' -export { default as getPage } from './get-page' -export { default as getAllProducts } from './get-all-products' -export { default as getAllProductPaths } from './get-all-product-paths' -export { default as getProduct } from './get-product' -export { default as getSiteInfo } from './get-site-info' -export { default as login } from './login' diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f7de6016d..3b191281d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -677,6 +677,7 @@ importers: tabbable: ^5.2.1 tailwindcss: ^3.0.13 typescript: 4.7.4 + zod: ^3.19.0 dependencies: '@radix-ui/react-dropdown-menu': 1.0.0_7ey2zzynotv32rpkwno45fsx4e '@react-spring/web': 9.5.4_biqbaboplfbrettd7655fr4n2y @@ -710,7 +711,8 @@ importers: react-merge-refs: 2.0.1 react-use-measure: 2.1.1_biqbaboplfbrettd7655fr4n2y tabbable: 5.3.3 - tailwindcss: 3.1.8 + tailwindcss: 3.1.8_postcss@8.4.16 + zod: 3.19.1 devDependencies: '@next/bundle-analyzer': 12.3.0 '@types/body-scroll-lock': 3.1.0 @@ -9044,10 +9046,12 @@ packages: resolution: {integrity: sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==} dev: false - /tailwindcss/3.1.8: + /tailwindcss/3.1.8_postcss@8.4.16: resolution: {integrity: sha512-YSneUCZSFDYMwk+TGq8qYFdCA3yfBRdBlS7txSq0LUmzyeqRe3a8fBQzbz9M3WS/iFT4BNf/nmw9mEzrnSaC0g==} engines: {node: '>=12.13.0'} hasBin: true + peerDependencies: + postcss: ^8.0.9 dependencies: arg: 5.0.2 chokidar: 3.5.3 @@ -9844,3 +9848,7 @@ packages: resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==} engines: {node: '>=10'} dev: true + + /zod/3.19.1: + resolution: {integrity: sha512-LYjZsEDhCdYET9ikFu6dVPGp2YH9DegXjdJToSzD9rO6fy4qiRYFoyEYwps88OseJlPyl2NOe2iJuhEhL7IpEA==} + dev: false