Skip to content
This repository was archived by the owner on Feb 23, 2024. It is now read-only.

Commit 4e25cfd

Browse files
haszarimikejolley
haszari
and
mikejolley
authored
Handle change to logged-in status in checkout API AJAX requests (#3429)
* refactor and reorder checkout processing * improve handling of checkout POST with mixed success: - return coupon errors in a property - don't throw from coupon validation: - return info about errors to route handler - tweak logic in route handler to prevent subsequent processing - default payment result to fail to avoid accidental successful checkout - in client, catch errors and new customer id: - render any errors as notices - i.e. coupon error - if a customer ID is included, push into store (so UI updates) * fix linter whitespace issue from rebase merge * fix MIA order validation/errors (due to rebase): - reinstate thrown exception when validating order - return exception was an experiment, now solved in #3454 * hide "Create account" checkbox if account is created during an error response: - update store with new user id - remove stale response.errors handling; - current approach (#3454) is to add data to error response * show a notice informing user that they have signed up * white space * Handle header and update typedef * Remove "errors" schema * remove errors Co-authored-by: Mike Jolley <[email protected]>
1 parent f9e7481 commit 4e25cfd

File tree

7 files changed

+47
-34
lines changed

7 files changed

+47
-34
lines changed

‎assets/js/base/context/cart-checkout/checkout-state/actions.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ const {
1616
SET_NO_ERROR,
1717
INCREMENT_CALCULATING,
1818
DECREMENT_CALCULATING,
19+
SET_CUSTOMER_ID,
1920
SET_ORDER_ID,
2021
SET_SHOULD_CREATE_ACCOUNT,
2122
SET_ORDER_NOTES,
@@ -62,6 +63,10 @@ export const actions = {
6263
decrementCalculating: () => ( {
6364
type: DECREMENT_CALCULATING,
6465
} ),
66+
setCustomerId: ( customerId ) => ( {
67+
type: SET_CUSTOMER_ID,
68+
customerId,
69+
} ),
6570
setOrderId: ( orderId ) => ( {
6671
type: SET_ORDER_ID,
6772
orderId,

‎assets/js/base/context/cart-checkout/checkout-state/constants.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ export const TYPES = {
4343
SET_PROCESSING: 'set_checkout_is_processing',
4444
SET_HAS_ERROR: 'set_checkout_has_error',
4545
SET_NO_ERROR: 'set_checkout_no_error',
46+
SET_CUSTOMER_ID: 'set_checkout_customer_id',
4647
SET_ORDER_ID: 'set_checkout_order_id',
4748
SET_ORDER_NOTES: 'set_checkout_order_notes',
4849
INCREMENT_CALCULATING: 'increment_calculating',

‎assets/js/base/context/cart-checkout/checkout-state/index.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ const CheckoutContext = createContext( {
6161
setAfterProcessing: ( response ) => void response,
6262
incrementCalculating: () => void null,
6363
decrementCalculating: () => void null,
64+
setCustomerId: ( id ) => void id,
6465
setOrderId: ( id ) => void id,
6566
setOrderNotes: ( orderNotes ) => void orderNotes,
6667
},
@@ -147,6 +148,8 @@ export const CheckoutStateProvider = ( {
147148
void dispatch( actions.incrementCalculating() ),
148149
decrementCalculating: () =>
149150
void dispatch( actions.decrementCalculating() ),
151+
setCustomerId: ( id ) =>
152+
void dispatch( actions.setCustomerId( id ) ),
150153
setOrderId: ( orderId ) =>
151154
void dispatch( actions.setOrderId( orderId ) ),
152155
setOrderNotes: ( orderNotes ) =>

‎assets/js/base/context/cart-checkout/checkout-state/reducer.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ const {
2121
SET_NO_ERROR,
2222
INCREMENT_CALCULATING,
2323
DECREMENT_CALCULATING,
24+
SET_CUSTOMER_ID,
2425
SET_ORDER_ID,
2526
SET_ORDER_NOTES,
2627
SET_SHOULD_CREATE_ACCOUNT,
@@ -72,14 +73,15 @@ export const prepareResponseData = ( data ) => {
7273
* @param {Object} action Incoming action object.
7374
* @param {string} action.url URL passed in.
7475
* @param {string} action.type Type of action.
76+
* @param {string} action.customerId Customer ID.
7577
* @param {string} action.orderId Order ID.
7678
* @param {Array} action.orderNotes Order notes.
7779
* @param {boolean} action.shouldCreateAccount True if shopper has requested a user account (signup checkbox).
7880
* @param {Object} action.data Other action payload.
7981
*/
8082
export const reducer = (
8183
state = DEFAULT_STATE,
82-
{ url, type, orderId, orderNotes, shouldCreateAccount, data }
84+
{ url, type, customerId, orderId, orderNotes, shouldCreateAccount, data }
8385
) => {
8486
let newState = state;
8587
switch ( type ) {
@@ -191,6 +193,12 @@ export const reducer = (
191193
calculatingCount: Math.max( 0, state.calculatingCount - 1 ),
192194
};
193195
break;
196+
case SET_CUSTOMER_ID:
197+
newState = {
198+
...state,
199+
customerId,
200+
};
201+
break;
194202
case SET_ORDER_ID:
195203
newState = {
196204
...state,

‎assets/js/base/context/cart-checkout/checkout/processor/index.js‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -191,6 +191,11 @@ const CheckoutProcessor = () => {
191191
// Update nonce.
192192
triggerFetch.setNonce( fetchResponse.headers );
193193

194+
// Update user using headers.
195+
dispatchActions.setCustomerId(
196+
fetchResponse.headers.get( 'X-WC-Store-API-User' )
197+
);
198+
194199
// Handle response.
195200
fetchResponse.json().then( function ( response ) {
196201
if ( ! fetchResponse.ok ) {
@@ -221,7 +226,14 @@ const CheckoutProcessor = () => {
221226
// Update nonce.
222227
triggerFetch.setNonce( errorResponse.headers );
223228

224-
// If updated cart state was returned, also update that.
229+
// If new customer ID returned, update the store.
230+
if ( errorResponse.headers?.get( 'X-WC-Store-API-User' ) ) {
231+
dispatchActions.setCustomerId(
232+
errorResponse.headers.get( 'X-WC-Store-API-User' )
233+
);
234+
}
235+
236+
// If updated cart state was returned, update the store.
225237
if ( response.data?.cart ) {
226238
receiveCart( response.data.cart );
227239
}

‎assets/js/type-defs/checkout.js‎

Lines changed: 15 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,26 @@
11
/**
22
* @typedef {Object} CheckoutDispatchActions
33
*
4-
* @property {function()} resetCheckout Dispatches an action that resets
5-
* the checkout to a pristine state.
6-
* @property {function(string)} setRedirectUrl Dispatches an action that sets the
7-
* redirectUrl to the given value.
8-
* @property {function(boolean=)} setHasError Dispatches an action that sets the
9-
* checkout status to having an error.
10-
* @property {function(Object)} setAfterProcessing Dispatches an action that sets the
11-
* checkout status to after processing and
12-
* also sets the response data accordingly.
13-
* @property {function()} incrementCalculating Dispatches an action that increments
14-
* the calculating state for checkout by one.
15-
* @property {function()} decrementCalculating Dispatches an action that decrements
16-
* the calculating state for checkout by one.
17-
* @property {function(number|string)} setOrderId Dispatches an action that stores the draft
18-
* order ID and key to state.
19-
* @property {function(string)} setOrderNotes Dispatches an action that sets the order
20-
* notes.
4+
* @property {function():void} resetCheckout Dispatches an action that resets the checkout to a pristine state.
5+
* @property {function(string):void} setRedirectUrl Dispatches an action that sets the redirectUrl.
6+
* @property {function(boolean=):void} setHasError Dispatches an action that sets the checkout status to having an error.
7+
* @property {function(Object):void} setAfterProcessing Dispatches an action that sets the checkout status to after processing and also sets the response data accordingly.
8+
* @property {function():void} incrementCalculating Dispatches an action that increments the calculating state for checkout by one.
9+
* @property {function():void} decrementCalculating Dispatches an action that decrements the calculating state for checkout by one.
10+
* @property {function(number|string):void} setOrderId Dispatches an action that stores the draft order ID and key.
11+
* @property {function(string):void} setOrderNotes Dispatches an action that sets the order notes.
12+
* @property {function(number):void} setCustomerId Dispatches an action that stores the customer ID.
2113
*/
2214

2315
/**
2416
* @typedef {Object} CheckoutStatusConstants
2517
*
26-
* @property {string} PRISTINE Checkout is in it's initialized state.
27-
* @property {string} IDLE When checkout state has changed but there is no
28-
* activity happening.
29-
* @property {string} BEFORE_PROCESSING This is the state before checkout processing
30-
* begins after the checkout button has been
31-
* pressed/submitted.
32-
* @property {string} PROCESSING After BEFORE_PROCESSING status emitters have
33-
* finished successfully. Payment processing is
34-
* started on this checkout status.
35-
* @property {string} AFTER_PROCESSING After server side checkout processing is completed
36-
* this status is set.
37-
* @property {string} COMPLETE After the AFTER_PROCESSING event emitters have
38-
* completed. This status triggers the checkout
39-
* redirect.
18+
* @property {string} PRISTINE Checkout is in it's initialized state.
19+
* @property {string} IDLE When checkout state has changed but there is no activity happening.
20+
* @property {string} BEFORE_PROCESSING This is the state before checkout processing begins after the checkout button has been pressed/submitted.
21+
* @property {string} PROCESSING After BEFORE_PROCESSING status emitters have finished successfully. Payment processing is started on this checkout status.
22+
* @property {string} AFTER_PROCESSING After server side checkout processing is completed this status is set.
23+
* @property {string} COMPLETE After the AFTER_PROCESSING event emitters have completed. This status triggers the checkout redirect.
4024
*/
4125

4226
export {};

‎src/StoreApi/Routes/Checkout.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ protected function get_route_update_response( WP_REST_Request $request ) {
183183
/**
184184
* Update and process an order.
185185
*
186-
* 1. Obtain Draft Order.
186+
* 1. Obtain Draft Order
187187
* 2. Process Request
188188
* 3. Process Customer
189189
* 4. Validate Order

0 commit comments

Comments
 (0)