crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-17 15:06:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(vendure): Fix issues with custom checkout flow

Browse Source
This commit is contained in:
Michael Bromley 2022-05-26 21:22:17 +02:00
parent 042558513e
commit 3c22b10635
11 changed files with 65 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
packages/vendure/src/checkout/use-submit-checkout.tsx
View File

@ -6,9 +6,9 @@ import { CommerceError } from '@vercel/commerce/utils/errors'
import type { MutationHook } from '@vercel/commerce/utils/types'
import { useCallback } from 'react'
import {
AddPaymentToOrderMutation,
EligiblePaymentMethodsQuery,
TransitionOrderToStateResult,
AddPaymentToOrderResult,
TransitionOrderToStateMutation,
} from '../../schema'
import { addPaymentToOrder } from '../utils/mutations/add-payment-to-order'
import { transitionOrderToState } from '../utils/mutations/transition-order-to-state'
@ -21,17 +21,20 @@ export const handler: MutationHook<SubmitCheckoutHook> = {
query: addPaymentToOrder,
},
async fetcher({ input: item, options, fetch }) {
const transitionResponse = await fetch<TransitionOrderToStateResult>({
const transitionResponse = await fetch<TransitionOrderToStateMutation>({
...options,
query: transitionOrderToState,
variables: {
state: 'ArrangingPayment',
},
})
if (transitionResponse.__typename === 'OrderStateTransitionError') {
if (
transitionResponse.transitionOrderToState?.__typename ===
'OrderStateTransitionError'
) {
throw new CommerceError({
code: transitionResponse.errorCode,
message: transitionResponse.message,
code: transitionResponse.transitionOrderToState.errorCode,
message: transitionResponse.transitionOrderToState.message,
})
} else {
const paymentMethodsResponse = await fetch<EligiblePaymentMethodsQuery>({
@ -47,7 +50,7 @@ export const handler: MutationHook<SubmitCheckoutHook> = {
message: 'No Eligible payment methods',
})
}
const paymentResponse = await fetch<AddPaymentToOrderResult>({
const paymentResponse = await fetch<AddPaymentToOrderMutation>({
...options,
variables: {
input: {
@ -58,20 +61,22 @@ export const handler: MutationHook<SubmitCheckoutHook> = {
},
},
})
if (paymentResponse.__typename === 'Order') {
const addPaymentToOrderResultType =
paymentResponse.addPaymentToOrder.__typename
if (addPaymentToOrderResultType === 'Order') {
return {
hasPayment: true,
hasShipping: true,
}
} else if (
paymentResponse.__typename === 'IneligiblePaymentMethodError' ||
paymentResponse.__typename === 'NoActiveOrderError' ||
paymentResponse.__typename === 'OrderPaymentStateError' ||
paymentResponse.__typename === 'OrderStateTransitionError' ||
paymentResponse.__typename === 'PaymentDeclinedError' ||
paymentResponse.__typename === 'PaymentFailedError'
addPaymentToOrderResultType === 'IneligiblePaymentMethodError' ||
addPaymentToOrderResultType === 'NoActiveOrderError' ||
addPaymentToOrderResultType === 'OrderPaymentStateError' ||
addPaymentToOrderResultType === 'OrderStateTransitionError' ||
addPaymentToOrderResultType === 'PaymentDeclinedError' ||
addPaymentToOrderResultType === 'PaymentFailedError'
) {
throw new CommerceError(paymentResponse)
throw new CommerceError(paymentResponse.addPaymentToOrder)
} else {
throw new CommerceError({
message: 'Something went wrong with Payment request',

3
packages/vendure/src/commerce.config.json
View File

@ -1,6 +1,7 @@
{
"provider": "vendure",
"features": {
"wishlist": false
"wishlist": false,
"customCheckout": true
}
}

1
packages/vendure/src/customer/address/use-addresses.tsx
View File

@ -15,7 +15,6 @@ export const handler: SWRHook<GetAddressesHook> = {
},
useHook: ({ useData }) =>
function useHook(input) {
console.log(input, 'hello')
const response = useData({
swrOptions: { revalidateOnFocus: false, ...input?.swrOptions },
})

37
packages/vendure/src/customer/card/use-add-item.tsx
View File

@ -8,13 +8,16 @@ import { MutationHook } from '@vercel/commerce/utils/types'
import { useCallback } from 'react'
import { setOrderBillingAddress } from '../../utils/mutations/set-order-billing-address'
import {
ActiveOrderResult,
EligibleShippingMethodsQuery,
MutationSetOrderBillingAddressArgs,
SetCustomerForOrderMutation,
SetCustomerForOrderMutationVariables,
SetOrderBillingAddressMutation,
SetOrderShippingMethodResult,
} from '../../../schema'
import { eligibleShippingMethods } from '../../utils/queries/eligible-shipping-methods'
import { setOrderShippingMethod } from '../../utils/mutations/set-order-shipping-method'
import { setCustomerForOrder } from '../../utils/mutations/set-customer-for-order'
export default useAddItem as UseAddItem<typeof handler>
@ -36,10 +39,30 @@ export const handler: MutationHook<AddItemHook> = {
countryCode: 'JP',
},
}
const data = await fetch<ActiveOrderResult>({
const data = await fetch<SetOrderBillingAddressMutation>({
...options,
variables,
})
if (
data.setOrderBillingAddress.__typename === 'Order' &&
!data.setOrderBillingAddress.customer
) {
// A Customer must be assigned to the Order before we will be able to
// transition to the ArrangingPayment state.
await fetch<SetCustomerForOrderMutation>({
...options,
query: setCustomerForOrder,
variables: {
input: {
firstName: item.firstName,
lastName: item.lastName,
// TODO: we need an input for email address
// ref: https://github.com/vercel/commerce/issues/616
emailAddress: 'guest-customer@test.com',
},
} as SetCustomerForOrderMutationVariables,
})
}
const eligibleMethods = await fetch<EligibleShippingMethodsQuery>({
...options,
query: eligibleShippingMethods,
@ -56,17 +79,19 @@ export const handler: MutationHook<AddItemHook> = {
})
}
if (data.__typename === 'Order') {
if (data.setOrderBillingAddress.__typename === 'Order') {
// TODO: Not sure what card we should return
return {
id: '',
mask: '',
provider: '',
}
} else if (data.__typename === 'NoActiveOrderError') {
} else if (
data.setOrderBillingAddress.__typename === 'NoActiveOrderError'
) {
throw new CommerceError({
code: data.errorCode,
message: data.message,
code: data.setOrderBillingAddress.errorCode,
message: data.setOrderBillingAddress.message,
})
}
},

1
packages/vendure/src/utils/fragments/cart-fragment.ts
View File

@ -4,6 +4,7 @@ export const cartFragment = /* GraphQL */ `
fragment Cart on Order {
id
code
state
createdAt
totalQuantity
subTotal

1
packages/vendure/src/utils/mutations/add-payment-to-order.ts
View File

@ -3,6 +3,7 @@ import { cartFragment } from '../fragments/cart-fragment'
export const addPaymentToOrder = /* GraphQL */ `
mutation addPaymentToOrder($input: PaymentInput!) {
addPaymentToOrder(input: $input) {
__typename
...Cart
... on OrderPaymentStateError {
errorCode

5
packages/vendure/src/utils/mutations/set-order-for-customer.ts → packages/vendure/src/utils/mutations/set-customer-for-order.ts
View File

@ -3,7 +3,12 @@ import { cartFragment } from '../fragments/cart-fragment'
export const setCustomerForOrder = /* GraphQL */ `
mutation setCustomerForOrder($input: CreateCustomerInput!) {
setCustomerForOrder(input: $input) {
__typename
...Cart
... on ErrorResult {
errorCode
message
}
}
}
${cartFragment}

1
packages/vendure/src/utils/mutations/set-order-billing-address.ts
View File

@ -3,6 +3,7 @@ import { cartFragment } from '../../utils/fragments/cart-fragment'
export const setOrderBillingAddress = /* GraphQL */ `
mutation setOrderBillingAddress ($input: CreateAddressInput!){
setOrderBillingAddress(input: $input) {
__typename
...Cart
... on NoActiveOrderError {
errorCode

1
packages/vendure/src/utils/mutations/set-order-shipping-address.ts
View File

@ -3,6 +3,7 @@ import { cartFragment } from '../../utils/fragments/cart-fragment'
export const setOrderShippingAddress = /* GraphQL */ `
mutation setOrderShippingAddress($input: CreateAddressInput!) {
setOrderShippingAddress(input: $input) {
__typename
...Cart
... on NoActiveOrderError {
errorCode

1
packages/vendure/src/utils/mutations/set-order-shipping-method.ts
View File

@ -3,6 +3,7 @@ import { cartFragment } from '../../utils/fragments/cart-fragment'
export const setOrderShippingMethod = /* GraphQL */ `
mutation setOrderShippingMethod($shippingMethodId: ID!) {
setOrderShippingMethod(shippingMethodId: $shippingMethodId) {
__typename
...Cart
... on OrderModificationError {
errorCode

2
packages/vendure/src/utils/mutations/transition-order-to-state.ts
View File

@ -3,10 +3,12 @@ import { cartFragment } from '../fragments/cart-fragment'
export const transitionOrderToState = /* GraphQL */ `
mutation transitionOrderToState($state: String!) {
transitionOrderToState(state: $state) {
__typename
...Cart
... on OrderStateTransitionError {
errorCode
message
transitionError
}
}
}