mirror of
https://github.com/vercel/commerce.git
synced 2025-07-22 20:26:49 +00:00
Checkout changes
This commit is contained in:
@@ -29,36 +29,35 @@ export const handler: MutationHook<AddItemHook> = {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const lineItems = [
|
||||||
|
{
|
||||||
|
variantId: item.variantId,
|
||||||
|
quantity: item.quantity ?? 1,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
let checkoutId = getCheckoutId()
|
let checkoutId = getCheckoutId()
|
||||||
|
|
||||||
if (!checkoutId) {
|
if (!checkoutId) {
|
||||||
const checkout = await checkoutCreate(fetch)
|
return checkoutToCart(await checkoutCreate(fetch, lineItems))
|
||||||
checkoutId = checkout.id
|
} else {
|
||||||
|
const { checkoutLineItemsAdd } = await fetch<
|
||||||
|
Mutation,
|
||||||
|
MutationCheckoutLineItemsAddArgs
|
||||||
|
>({
|
||||||
|
...options,
|
||||||
|
variables: {
|
||||||
|
checkoutId,
|
||||||
|
lineItems,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
return checkoutToCart(checkoutLineItemsAdd)
|
||||||
}
|
}
|
||||||
|
|
||||||
const { checkoutLineItemsAdd } = await fetch<
|
|
||||||
Mutation,
|
|
||||||
MutationCheckoutLineItemsAddArgs
|
|
||||||
>({
|
|
||||||
...options,
|
|
||||||
variables: {
|
|
||||||
checkoutId,
|
|
||||||
lineItems: [
|
|
||||||
{
|
|
||||||
variantId: item.variantId,
|
|
||||||
quantity: item.quantity ?? 1,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
return checkoutToCart(checkoutLineItemsAdd)
|
|
||||||
},
|
},
|
||||||
useHook:
|
useHook:
|
||||||
({ fetch }) =>
|
({ fetch }) =>
|
||||||
() => {
|
() => {
|
||||||
const { mutate } = useCart()
|
const { mutate } = useCart()
|
||||||
|
|
||||||
return useCallback(
|
return useCallback(
|
||||||
async function addItem(input) {
|
async function addItem(input) {
|
||||||
const data = await fetch({ input })
|
const data = await fetch({ input })
|
||||||
|
@@ -2,9 +2,15 @@ import { useMemo } from 'react'
|
|||||||
import useCommerceCart, { UseCart } from '@commerce/cart/use-cart'
|
import useCommerceCart, { UseCart } from '@commerce/cart/use-cart'
|
||||||
|
|
||||||
import { SWRHook } from '@commerce/utils/types'
|
import { SWRHook } from '@commerce/utils/types'
|
||||||
import { checkoutCreate, checkoutToCart } from '../utils'
|
import { checkoutToCart } from '../utils'
|
||||||
import getCheckoutQuery from '../utils/queries/get-checkout-query'
|
import getCheckoutQuery from '../utils/queries/get-checkout-query'
|
||||||
import { GetCartHook } from '../types/cart'
|
import { GetCartHook } from '../types/cart'
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
|
||||||
|
import {
|
||||||
|
SHOPIFY_CHECKOUT_ID_COOKIE,
|
||||||
|
SHOPIFY_CHECKOUT_URL_COOKIE,
|
||||||
|
} from '../const'
|
||||||
|
|
||||||
export default useCommerceCart as UseCart<typeof handler>
|
export default useCommerceCart as UseCart<typeof handler>
|
||||||
|
|
||||||
@@ -14,15 +20,21 @@ export const handler: SWRHook<GetCartHook> = {
|
|||||||
},
|
},
|
||||||
async fetcher({ input: { cartId }, options, fetch }) {
|
async fetcher({ input: { cartId }, options, fetch }) {
|
||||||
if (cartId) {
|
if (cartId) {
|
||||||
const { node } = await fetch({
|
const { node: checkout } = await fetch({
|
||||||
...options,
|
...options,
|
||||||
variables: {
|
variables: {
|
||||||
checkoutId: cartId,
|
checkoutId: cartId,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
return checkoutToCart({
|
if (checkout?.completedAt) {
|
||||||
checkout: node?.completedAt ? await checkoutCreate(fetch) : node,
|
Cookies.remove(SHOPIFY_CHECKOUT_ID_COOKIE)
|
||||||
})
|
Cookies.remove(SHOPIFY_CHECKOUT_URL_COOKIE)
|
||||||
|
return null
|
||||||
|
} else {
|
||||||
|
return checkoutToCart({
|
||||||
|
checkout,
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return null
|
return null
|
||||||
},
|
},
|
||||||
|
@@ -7,25 +7,39 @@ import {
|
|||||||
} from '../const'
|
} from '../const'
|
||||||
|
|
||||||
import checkoutCreateMutation from './mutations/checkout-create'
|
import checkoutCreateMutation from './mutations/checkout-create'
|
||||||
import { Checkout } from '../schema'
|
import {
|
||||||
|
CheckoutCreatePayload,
|
||||||
|
CheckoutLineItemInput,
|
||||||
|
Mutation,
|
||||||
|
MutationCheckoutCreateArgs,
|
||||||
|
} from '../schema'
|
||||||
|
import { FetcherOptions } from '@commerce/utils/types'
|
||||||
|
|
||||||
export const checkoutCreate = async (fetch: any): Promise<Checkout> => {
|
export const checkoutCreate = async (
|
||||||
const data = await fetch({
|
fetch: <T = any, B = Body>(options: FetcherOptions<B>) => Promise<T>,
|
||||||
|
lineItems: CheckoutLineItemInput[]
|
||||||
|
): Promise<CheckoutCreatePayload> => {
|
||||||
|
const { checkoutCreate } = await fetch<Mutation, MutationCheckoutCreateArgs>({
|
||||||
query: checkoutCreateMutation,
|
query: checkoutCreateMutation,
|
||||||
|
variables: {
|
||||||
|
input: { lineItems },
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const checkout = data.checkoutCreate?.checkout
|
const checkout = checkoutCreate?.checkout
|
||||||
const checkoutId = checkout?.id
|
|
||||||
|
|
||||||
if (checkoutId) {
|
if (checkout) {
|
||||||
|
const checkoutId = checkout?.id
|
||||||
const options = {
|
const options = {
|
||||||
expires: SHOPIFY_COOKIE_EXPIRE,
|
expires: SHOPIFY_COOKIE_EXPIRE,
|
||||||
}
|
}
|
||||||
Cookies.set(SHOPIFY_CHECKOUT_ID_COOKIE, checkoutId, options)
|
Cookies.set(SHOPIFY_CHECKOUT_ID_COOKIE, checkoutId, options)
|
||||||
Cookies.set(SHOPIFY_CHECKOUT_URL_COOKIE, checkout.webUrl, options)
|
if (checkout?.webUrl) {
|
||||||
|
Cookies.set(SHOPIFY_CHECKOUT_URL_COOKIE, checkout.webUrl, options)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return checkout
|
return checkoutCreate!
|
||||||
}
|
}
|
||||||
|
|
||||||
export default checkoutCreate
|
export default checkoutCreate
|
||||||
|
@@ -27,16 +27,15 @@ export type CheckoutPayload =
|
|||||||
| CheckoutQuery
|
| CheckoutQuery
|
||||||
|
|
||||||
const checkoutToCart = (checkoutPayload?: Maybe<CheckoutPayload>): Cart => {
|
const checkoutToCart = (checkoutPayload?: Maybe<CheckoutPayload>): Cart => {
|
||||||
const checkout = checkoutPayload?.checkout
|
|
||||||
throwUserErrors(checkoutPayload?.checkoutUserErrors)
|
throwUserErrors(checkoutPayload?.checkoutUserErrors)
|
||||||
|
|
||||||
if (!checkout) {
|
if (!checkoutPayload?.checkout) {
|
||||||
throw new CommerceError({
|
throw new CommerceError({
|
||||||
message: 'Missing checkout object from response',
|
message: 'Missing checkout object from response',
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
return normalizeCart(checkout)
|
return normalizeCart(checkoutPayload?.checkout)
|
||||||
}
|
}
|
||||||
|
|
||||||
export default checkoutToCart
|
export default checkoutToCart
|
||||||
|
Reference in New Issue
Block a user