In #42678, the “Order Review” step was pulled out of the step flow for Checkout and made persistent. This PR introduces a default summary view of that step to make the already-completed information easier to scan.
Summary mode (default):
Edit mode:
As part of the PR, I needed to make the following changes to the composite checkout package:
- I attempted to decouple step flow control from the
CheckoutStepBody
wherever possible. CheckoutStep(s)
act as a wrapper for CheckoutStepBody
and handle mechanics of progressing through steps.
- I introduced an
areStepsActive
prop to CheckoutSteps
to allow for the entire set of steps to be inactive when another element of Checkout is focused.
To Test:
- Add an item to your cart and visit Checkout with
?flags=composite-checkout-force
- Verify that the “Your Order” section renders in a summary mode, without a tax line item, remove buttons, or plan variations
- Click “Edit” on “Your Order”
- Verify that the section renders in an edit mode, with all items returned as before and an additional “save order” button.
- Verify that the other Checkout steps are rendered, collapsed and inactive.
- Verify that clicking “save order” returns the section to summary mode.
- Commence jerk testing the rest of Signup. Add and remove items, progress through steps, edit
and complete steps, return to edit your order, make sure that Checkout progress is maintained… your journey awaits.
Unfortunately, no screenshots were provided by the developer.