diff --git a/packages/vendure/src/checkout/use-submit-checkout.tsx b/packages/vendure/src/checkout/use-submit-checkout.tsx index bc457ceb0..db3c25f77 100644 --- a/packages/vendure/src/checkout/use-submit-checkout.tsx +++ b/packages/vendure/src/checkout/use-submit-checkout.tsx @@ -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 = { query: addPaymentToOrder, }, async fetcher({ input: item, options, fetch }) { - const transitionResponse = await fetch({ + const transitionResponse = await fetch({ ...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({ @@ -47,7 +50,7 @@ export const handler: MutationHook = { message: 'No Eligible payment methods', }) } - const paymentResponse = await fetch({ + const paymentResponse = await fetch({ ...options, variables: { input: { @@ -58,20 +61,22 @@ export const handler: MutationHook = { }, }, }) - 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', diff --git a/packages/vendure/src/commerce.config.json b/packages/vendure/src/commerce.config.json index 70806f062..511eb150e 100644 --- a/packages/vendure/src/commerce.config.json +++ b/packages/vendure/src/commerce.config.json @@ -1,6 +1,7 @@ { "provider": "vendure", "features": { - "wishlist": false + "wishlist": false, + "customCheckout": true } } diff --git a/packages/vendure/src/customer/address/use-addresses.tsx b/packages/vendure/src/customer/address/use-addresses.tsx index 1c5c5ed44..7127b012a 100644 --- a/packages/vendure/src/customer/address/use-addresses.tsx +++ b/packages/vendure/src/customer/address/use-addresses.tsx @@ -15,7 +15,6 @@ export const handler: SWRHook = { }, useHook: ({ useData }) => function useHook(input) { - console.log(input, 'hello') const response = useData({ swrOptions: { revalidateOnFocus: false, ...input?.swrOptions }, }) diff --git a/packages/vendure/src/customer/card/use-add-item.tsx b/packages/vendure/src/customer/card/use-add-item.tsx index f6b0058c6..2f139a952 100644 --- a/packages/vendure/src/customer/card/use-add-item.tsx +++ b/packages/vendure/src/customer/card/use-add-item.tsx @@ -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 @@ -36,10 +39,30 @@ export const handler: MutationHook = { countryCode: 'JP', }, } - const data = await fetch({ + const data = await fetch({ ...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({ + ...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({ ...options, query: eligibleShippingMethods, @@ -56,17 +79,19 @@ export const handler: MutationHook = { }) } - 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, }) } }, diff --git a/packages/vendure/src/utils/fragments/cart-fragment.ts b/packages/vendure/src/utils/fragments/cart-fragment.ts index d3ce50953..918c024ee 100644 --- a/packages/vendure/src/utils/fragments/cart-fragment.ts +++ b/packages/vendure/src/utils/fragments/cart-fragment.ts @@ -4,6 +4,7 @@ export const cartFragment = /* GraphQL */ ` fragment Cart on Order { id code + state createdAt totalQuantity subTotal diff --git a/packages/vendure/src/utils/mutations/add-payment-to-order.ts b/packages/vendure/src/utils/mutations/add-payment-to-order.ts index 01a2675c6..698371d2e 100644 --- a/packages/vendure/src/utils/mutations/add-payment-to-order.ts +++ b/packages/vendure/src/utils/mutations/add-payment-to-order.ts @@ -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 diff --git a/packages/vendure/src/utils/mutations/set-order-for-customer.ts b/packages/vendure/src/utils/mutations/set-customer-for-order.ts similarity index 75% rename from packages/vendure/src/utils/mutations/set-order-for-customer.ts rename to packages/vendure/src/utils/mutations/set-customer-for-order.ts index 98808ce8b..c72ec7e51 100644 --- a/packages/vendure/src/utils/mutations/set-order-for-customer.ts +++ b/packages/vendure/src/utils/mutations/set-customer-for-order.ts @@ -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} diff --git a/packages/vendure/src/utils/mutations/set-order-billing-address.ts b/packages/vendure/src/utils/mutations/set-order-billing-address.ts index d9cbf486a..0602c3a86 100644 --- a/packages/vendure/src/utils/mutations/set-order-billing-address.ts +++ b/packages/vendure/src/utils/mutations/set-order-billing-address.ts @@ -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 diff --git a/packages/vendure/src/utils/mutations/set-order-shipping-address.ts b/packages/vendure/src/utils/mutations/set-order-shipping-address.ts index c83121a2e..d503b6cba 100644 --- a/packages/vendure/src/utils/mutations/set-order-shipping-address.ts +++ b/packages/vendure/src/utils/mutations/set-order-shipping-address.ts @@ -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 diff --git a/packages/vendure/src/utils/mutations/set-order-shipping-method.ts b/packages/vendure/src/utils/mutations/set-order-shipping-method.ts index 54c0c0ccb..44f259fd6 100644 --- a/packages/vendure/src/utils/mutations/set-order-shipping-method.ts +++ b/packages/vendure/src/utils/mutations/set-order-shipping-method.ts @@ -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 diff --git a/packages/vendure/src/utils/mutations/transition-order-to-state.ts b/packages/vendure/src/utils/mutations/transition-order-to-state.ts index 638eefc4f..8f012fe2f 100644 --- a/packages/vendure/src/utils/mutations/transition-order-to-state.ts +++ b/packages/vendure/src/utils/mutations/transition-order-to-state.ts @@ -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 } } }