From d0a1fa69dc71a643815bae37f7532447e6dcac15 Mon Sep 17 00:00:00 2001 From: Avinash Kumar Date: Wed, 11 Feb 2026 12:09:17 -0500 Subject: [PATCH 1/4] UX changes --- .../app/pages/checkout-one-click/index.test.js | 11 +---------- .../partials/one-click-contact-info.jsx | 8 +++----- .../checkout-one-click/partials/one-click-payment.jsx | 11 ++++------- .../partials/one-click-payment.test.js | 2 +- .../partials/one-click-shipping-options.jsx | 4 ++-- 5 files changed, 11 insertions(+), 25 deletions(-) diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/index.test.js b/packages/template-retail-react-app/app/pages/checkout-one-click/index.test.js index c9b45ab1ae..4535324a5b 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/index.test.js +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/index.test.js @@ -751,11 +751,6 @@ describe('Checkout One Click', () => { }) ).toBeInTheDocument() - // Billing address should default to the shipping address - - // Should display billing address that matches shipping address - expect(step3Content.getByText('123 Main St')).toBeInTheDocument() - // Edit billing address // Toggle to edit billing address (not via same-as-shipping label in this flow) // Click the checkbox by role if present; otherwise skip @@ -1208,10 +1203,6 @@ describe('Checkout One Click', () => { }) ).toBeInTheDocument() - // Verify billing address is displayed (it shows John Smith from the mock) - expect(step3Content.getByText('John Smith')).toBeInTheDocument() - expect(step3Content.getByText('123 Main St')).toBeInTheDocument() - // Verify UserRegistration component is hidden for registered customers expect(screen.queryByTestId('sf-user-registration-content')).not.toBeInTheDocument() @@ -2650,7 +2641,7 @@ describe('Checkout One Click', () => { // Click "Edit Payment Info" button const editPaymentButton = screen.getByRole('button', { - name: /toggle_card.action.editPaymentInfo|Edit Payment Info/i + name: /toggle_card.action.changePaymentInfo|Change/i }) await user.click(editPaymentButton) diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx index 19fe7da189..dfba08c1ee 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx @@ -535,8 +535,8 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG id: 'checkout_contact_info.action.sign_out' }) : formatMessage({ - defaultMessage: 'Edit', - id: 'checkout_contact_info.action.edit' + defaultMessage: 'Change', + id: 'checkout_contact_info.action.change' }) } > @@ -671,9 +671,7 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG {customer?.email || form.getValues('email')} {(customer?.phoneHome || form.getValues('phone')) && ( - - {customer?.phoneHome || form.getValues('phone')} - + {customer?.phoneHome || form.getValues('phone')} )} diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.jsx b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.jsx index d196cd228a..551b2fe69d 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.jsx +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.jsx @@ -441,8 +441,8 @@ const Payment = ({ disabled={appliedPayment == null} onEdit={handleEditPayment} editLabel={formatMessage({ - defaultMessage: 'Edit Payment Info', - id: 'toggle_card.action.editPaymentInfo' + defaultMessage: 'Change', + id: 'toggle_card.action.changePaymentInfo' })} > @@ -580,8 +580,7 @@ const Payment = ({ - {(selectedBillingAddress || - (effectiveBillingSameAsShipping && selectedShippingAddress)) && ( + {selectedBillingAddress && !effectiveBillingSameAsShipping && ( - + )} diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.test.js b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.test.js index 3f28e3e19c..ba097f8133 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.test.js +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-payment.test.js @@ -1310,7 +1310,7 @@ describe('Payment Component', () => { // Click Edit Payment Info to enter edit mode const summary = screen.getAllByTestId('toggle-card-summary').pop() const editButton = within(summary).getByRole('button', { - name: /toggle_card.action.editPaymentInfo|Edit Payment Info/i + name: /toggle_card.action.changePaymentInfo|Change/i }) await user.click(editButton) diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-shipping-options.jsx b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-shipping-options.jsx index ca0667faa8..586f0ded71 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-shipping-options.jsx +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-shipping-options.jsx @@ -266,8 +266,8 @@ export default function ShippingOptions() { } onEdit={() => goToStep(STEPS.SHIPPING_OPTIONS)} editLabel={formatMessage({ - defaultMessage: 'Edit Shipping Options', - id: 'toggle_card.action.editShippingOptions' + defaultMessage: 'Change', + id: 'toggle_card.action.changeShippingOptions' })} > From 582cffc2eea9ced0336a07fbdbf5d91b6e75c64e Mon Sep 17 00:00:00 2001 From: Avinash Kumar Date: Wed, 11 Feb 2026 15:18:14 -0500 Subject: [PATCH 2/4] update compiled and source translations --- .../static/translations/compiled/en-GB.json | 16 ++++++++-- .../static/translations/compiled/en-US.json | 16 ++++++++-- .../static/translations/compiled/en-XA.json | 32 +++++++++++++++++-- .../translations/en-GB.json | 10 ++++-- .../translations/en-US.json | 10 ++++-- 5 files changed, 74 insertions(+), 10 deletions(-) diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json b/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json index 11a84743c8..2d432675cb 100644 --- a/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json +++ b/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json @@ -1249,10 +1249,10 @@ "value": " with your confirmation number and receipt shortly." } ], - "checkout_contact_info.action.edit": [ + "checkout_contact_info.action.change": [ { "type": 0, - "value": "Edit" + "value": "Change" } ], "checkout_contact_info.action.sign_out": [ @@ -4681,6 +4681,18 @@ "value": "Change" } ], + "toggle_card.action.changePaymentInfo": [ + { + "type": 0, + "value": "Change" + } + ], + "toggle_card.action.changeShippingOptions": [ + { + "type": 0, + "value": "Change" + } + ], "toggle_card.action.edit": [ { "type": 0, diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-US.json b/packages/template-retail-react-app/app/static/translations/compiled/en-US.json index 11a84743c8..2d432675cb 100644 --- a/packages/template-retail-react-app/app/static/translations/compiled/en-US.json +++ b/packages/template-retail-react-app/app/static/translations/compiled/en-US.json @@ -1249,10 +1249,10 @@ "value": " with your confirmation number and receipt shortly." } ], - "checkout_contact_info.action.edit": [ + "checkout_contact_info.action.change": [ { "type": 0, - "value": "Edit" + "value": "Change" } ], "checkout_contact_info.action.sign_out": [ @@ -4681,6 +4681,18 @@ "value": "Change" } ], + "toggle_card.action.changePaymentInfo": [ + { + "type": 0, + "value": "Change" + } + ], + "toggle_card.action.changeShippingOptions": [ + { + "type": 0, + "value": "Change" + } + ], "toggle_card.action.edit": [ { "type": 0, diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json b/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json index cf20e0344c..4b9136220a 100644 --- a/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json +++ b/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json @@ -2473,14 +2473,14 @@ "value": "]" } ], - "checkout_contact_info.action.edit": [ + "checkout_contact_info.action.change": [ { "type": 0, "value": "[" }, { "type": 0, - "value": "Ḗḓīŧ" + "value": "Ƈħȧȧƞɠḗḗ" }, { "type": 0, @@ -9841,6 +9841,34 @@ "value": "]" } ], + "toggle_card.action.changePaymentInfo": [ + { + "type": 0, + "value": "[" + }, + { + "type": 0, + "value": "Ƈħȧȧƞɠḗḗ" + }, + { + "type": 0, + "value": "]" + } + ], + "toggle_card.action.changeShippingOptions": [ + { + "type": 0, + "value": "[" + }, + { + "type": 0, + "value": "Ƈħȧȧƞɠḗḗ" + }, + { + "type": 0, + "value": "]" + } + ], "toggle_card.action.edit": [ { "type": 0, diff --git a/packages/template-retail-react-app/translations/en-GB.json b/packages/template-retail-react-app/translations/en-GB.json index 30ed890c49..68e92087b0 100644 --- a/packages/template-retail-react-app/translations/en-GB.json +++ b/packages/template-retail-react-app/translations/en-GB.json @@ -460,8 +460,8 @@ "checkout_confirmation.message.will_email_shortly": { "defaultMessage": "We will send an email to {email} with your confirmation number and receipt shortly." }, - "checkout_contact_info.action.edit": { - "defaultMessage": "Edit" + "checkout_contact_info.action.change": { + "defaultMessage": "Change" }, "checkout_contact_info.action.sign_out": { "defaultMessage": "Sign Out" @@ -1949,6 +1949,12 @@ "toggle_card.action.change": { "defaultMessage": "Change" }, + "toggle_card.action.changePaymentInfo": { + "defaultMessage": "Change" + }, + "toggle_card.action.changeShippingOptions": { + "defaultMessage": "Change" + }, "toggle_card.action.edit": { "defaultMessage": "Edit" }, diff --git a/packages/template-retail-react-app/translations/en-US.json b/packages/template-retail-react-app/translations/en-US.json index 30ed890c49..68e92087b0 100644 --- a/packages/template-retail-react-app/translations/en-US.json +++ b/packages/template-retail-react-app/translations/en-US.json @@ -460,8 +460,8 @@ "checkout_confirmation.message.will_email_shortly": { "defaultMessage": "We will send an email to {email} with your confirmation number and receipt shortly." }, - "checkout_contact_info.action.edit": { - "defaultMessage": "Edit" + "checkout_contact_info.action.change": { + "defaultMessage": "Change" }, "checkout_contact_info.action.sign_out": { "defaultMessage": "Sign Out" @@ -1949,6 +1949,12 @@ "toggle_card.action.change": { "defaultMessage": "Change" }, + "toggle_card.action.changePaymentInfo": { + "defaultMessage": "Change" + }, + "toggle_card.action.changeShippingOptions": { + "defaultMessage": "Change" + }, "toggle_card.action.edit": { "defaultMessage": "Edit" }, From 2b772c7ecf62e8de8dc7cd010d94b7ee5983c6fd Mon Sep 17 00:00:00 2001 From: Avinash Kumar Date: Wed, 11 Feb 2026 16:21:24 -0500 Subject: [PATCH 3/4] code review comments --- .../partials/one-click-contact-info.jsx | 22 ++++++++++--------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx index dfba08c1ee..b14f38d797 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx @@ -666,16 +666,18 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG - {(customer?.email || form.getValues('email')) && ( - - - {customer?.email || form.getValues('email')} - {(customer?.phoneHome || form.getValues('phone')) && ( - {customer?.phoneHome || form.getValues('phone')} - )} - - - )} + {(() => { + const summaryEmail = customer?.email || form.getValues('email') + const summaryPhone = customer?.phoneHome || form.getValues('phone') + return summaryEmail ? ( + + + {summaryEmail} + {summaryPhone && {summaryPhone}} + + + ) : null + })()} {/* Sign Out Confirmation Dialog */} From cf2b96818f907c54cdc2d29ff4fb01071372b035 Mon Sep 17 00:00:00 2001 From: Avinash Kumar Date: Wed, 11 Feb 2026 17:03:21 -0500 Subject: [PATCH 4/4] CR comment --- .../partials/one-click-contact-info.jsx | 23 +++++++++---------- 1 file changed, 11 insertions(+), 12 deletions(-) diff --git a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx index b14f38d797..8df41991ca 100644 --- a/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx +++ b/packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx @@ -512,6 +512,9 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG } } + const customerEmail = customer?.email || form.getValues('email') + const customerPhone = customer?.phoneHome || form.getValues('phone') + return ( <> - {(() => { - const summaryEmail = customer?.email || form.getValues('email') - const summaryPhone = customer?.phoneHome || form.getValues('phone') - return summaryEmail ? ( - - - {summaryEmail} - {summaryPhone && {summaryPhone}} - - - ) : null - })()} + {customerEmail ? ( + + + {customerEmail} + {customerPhone && {customerPhone}} + + + ) : null} {/* Sign Out Confirmation Dialog */}