feat(checkout): CHECKOUT-10150 add billing form in payment step#3140
Conversation
|
cursor review |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
|
cursor review |
|
cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
1 issue from previous review remains unresolved.
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit b8fb01e. Configure here.
| onUnhandledError(error: Error): void; | ||
| } | ||
|
|
||
| const getFieldsWithExtraFields = ( |
There was a problem hiding this comment.
Will move all these commonalities to a new hook called useBilling in the next PR.
|
cursor review |
0b7d521 to
261aeb5
Compare
|
cursor review |
|
cursor review |
|
cursor review |
|
cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit 529fb36. Configure here.
529fb36 to
b767cf1
Compare
| {themeV2 && ( | ||
| <PaymentBillingBlock | ||
| methodId={selectedMethod?.id} | ||
| onUnhandledError={onUnhandledError ?? noop} | ||
| /> | ||
| )} |
There was a problem hiding this comment.
Just to confirm my understanding on the overall process:
- Add a new billing form as a block inside the payment form.
- Handle the billing form saving process there.
- Hide the existing billing step when applicable.
Did I miss anything?
There was a problem hiding this comment.
For this PR, we are not hiding the existing billing step yet. This PR just adds the billing form below the list of payment methods and place order button will validate and save the billing address first and then submit order.
There was a problem hiding this comment.
When enhanced UI is enabled*
There was a problem hiding this comment.
Sounds good.
Yeah, I forgot to mention it was about the whole project's roadmap.
|
Converting this to draft since this will need to change once we merge #3146 |
2d5ba99 to
e665afe
Compare
|
cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit e665afe. Configure here.
…nstead of using existing component
…m is resetting or loading
e665afe to
c9bf6bc
Compare
|
cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit 2f14789. Configure here.
| // Lets the themeV2 payment billing form register a callback the payment submit | ||
| // awaits, so the order can't finalize against a stale billing address. Pass | ||
| // null to unregister. Optional: only the themeV2 billing form uses it. | ||
| registerEnsureBillingAddressSaved?( | ||
| ensureBillingAddressSaved: EnsureBillingAddressSaved | null, | ||
| ): void; |
There was a problem hiding this comment.
If possible, can we avoid using register concept here?
We used register concept to handle one-to-many relationships, here it appears to be an on/off hook.
There was a problem hiding this comment.
The rest of the PR looks good.
|
checkout-js deployed to Staging US |
⚡️ Lighthouse results🖥️ Desktop:
📱 Mobile:
|
|
checkout-js deployed to Integration US |
|
checkout-js deployed to Production US |
4 participants
What/Why?
Place Orderbutton is clicked.Rollout/Rollback
Revert this PR.
Testing
Experiment OFF
Experiment ON
Screen.Recording.2026-07-09.at.3.48.59.pm.mov
Note
Medium Risk
Changes order placement and billing persistence on the payment step for themeV2; incorrect gating could block orders or submit with stale billing, though behavior is scoped to themeV2 and covered by new integration tests.
Overview
For checkoutV2 / themeV2, billing moves into the payment step:
PaymentBillingBlockandPaymentBillingFormreplace the placeholder, reusing billing UI patterns (address book, Amazon Pay static address, order comments) without a separate Continue action.Place Order now validates and persists billing first via
ensureBillingAddressSavedonPaymentContext; invalid or unsaved billing blockssubmitOrder. The submit button is disabled while billing countries load or billing/checkout updates are in flight.Shared
billingFormConfigcentralizes initial values and validation (including Amazon Pay) for both the standalone billing step and the embedded form.Reviewed by Cursor Bugbot for commit 7fc573d. Bugbot is set up for automated code reviews on this repo. Configure here.