Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[PWA-1514] Cannot place order again after initial order was declined #3091

Merged
merged 4 commits into from
Mar 31, 2021
Merged

[PWA-1514] Cannot place order again after initial order was declined #3091

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f6e1bef
PWA-1514: [bug]: Cannot place order again after initial order was dec…
eug123 Mar 29, 2021
7111c50
PWA-1514: [bug]: Cannot place order again after initial order was dec…
eug123 Mar 29, 2021
2a52669
Merge branch 'develop' into PWA-1514
eug123 Mar 29, 2021
58c9254
Merge branch 'develop' into PWA-1514
dpatil-magento Mar 31, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions packages/peregrine/lib/talons/CheckoutPage/PlaceOrderErrors.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,4 @@
* https://devdocs.magento.com/guides/v2.3/graphql/mutations/place-order.html#errors
*/

export const PAYMENT_ERROR =
'Unable to place order: Transaction has been declined. Please try again later.';
export const PAYMENT_ERROR = 'Unable to place order:';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did making this error text more generic catch a case that was being missed previously?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I have different error message, when having order declined by sandbox using mentioned order amount, which would not trigger payment form reset. And it seems there could be more message variation starting with Unable to place order

4 changes: 2 additions & 2 deletions packages/peregrine/lib/talons/CheckoutPage/__tests__/useCheckoutPage.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -280,7 +280,7 @@ test("should place order and cleanup when we have order details and place order
const removeCart = jest.fn();
const fetchCartId = jest.fn();

useCartContext.mockReturnValueOnce([
useCartContext.mockReturnValue([
{ cartId: '123' },
{ createCart, removeCart }
]);
Expand Down Expand Up @@ -312,7 +312,7 @@ test('should set checkout step and review order button click state when an error
});
const fetchCartId = jest.fn();

useCartContext.mockReturnValueOnce([
useCartContext.mockReturnValue([
{ cartId: '123' },
{ createCart, removeCart }
]);
Expand Down
24 changes: 13 additions & 11 deletions packages/peregrine/lib/talons/CheckoutPage/useCheckoutPage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,7 @@ export const useCheckoutPage = (props = {}) => {
{
data: placeOrderData,
error: placeOrderError,
loading: placeOrderLoading,
called: placeOrderCalled
loading: placeOrderLoading
}
] = useMutation(placeOrderMutation);

Expand Down Expand Up @@ -130,19 +129,19 @@ export const useCheckoutPage = (props = {}) => {

const resetReviewOrderButtonClicked = useCallback(() => {
setReviewOrderButtonClicked(false);
}, [setReviewOrderButtonClicked]);
}, []);

const setShippingInformationDone = useCallback(() => {
if (checkoutStep === CHECKOUT_STEP.SHIPPING_ADDRESS) {
setCheckoutStep(CHECKOUT_STEP.SHIPPING_METHOD);
}
}, [checkoutStep, setCheckoutStep]);
}, [checkoutStep]);

const setShippingMethodDone = useCallback(() => {
if (checkoutStep === CHECKOUT_STEP.SHIPPING_METHOD) {
setCheckoutStep(CHECKOUT_STEP.PAYMENT);
}
}, [checkoutStep, setCheckoutStep]);
}, [checkoutStep]);

const setPaymentInformationDone = useCallback(() => {
if (checkoutStep === CHECKOUT_STEP.PAYMENT) {
Expand All @@ -153,18 +152,21 @@ export const useCheckoutPage = (props = {}) => {
});
setCheckoutStep(CHECKOUT_STEP.REVIEW);
}
}, [checkoutStep, setCheckoutStep]);
}, [checkoutStep]);

const [isPlacingOrder, setIsPlacingOrder] = useState(false);

const handlePlaceOrder = useCallback(async () => {
// Fetch order details and then use an effect to actually place the
// order. If/when Apollo returns promises for invokers from useLazyQuery
// we can just await this function and then perform the rest of order
// placement.
getOrderDetails({
await getOrderDetails({
variables: {
cartId
}
});
setIsPlacingOrder(true);
}, [cartId, getOrderDetails]);

// Go back to checkout if shopper logs in
Expand All @@ -182,7 +184,6 @@ export const useCheckoutPage = (props = {}) => {
cartId
}
});

// Cleanup stale cart and customer info.
await removeCart();
await clearCartDataFromCache(apolloClient);
Expand All @@ -200,7 +201,8 @@ export const useCheckoutPage = (props = {}) => {
}
}

if (orderDetailsData && !placeOrderCalled) {
if (orderDetailsData && isPlacingOrder) {
setIsPlacingOrder(false);
placeOrderAndCleanup();
}
}, [
Expand All @@ -210,8 +212,8 @@ export const useCheckoutPage = (props = {}) => {
fetchCartId,
orderDetailsData,
placeOrder,
placeOrderCalled,
removeCart
removeCart,
isPlacingOrder
]);

return {
Expand Down