Project-7525: [DO NOT MERGE] Feature branch for the new returns flow#2667
Project-7525: [DO NOT MERGE] Feature branch for the new returns flow#2667bc-vivekaggarwal wants to merge 55 commits into
Conversation
There was a problem hiding this comment.
Pull request overview
This PR parks initial Cornerstone theme changes for PROJECT-7525’s “new returns flow”, adding new templates/assets for a redesigned return-request experience and gating existing “Return” affordances on a new settings.returns_v2_enabled flag (with fallback to settings.returns_enabled).
Changes:
- Add new return-related templates: a guest return portal page and a new account “add return” page layout.
- Add new styling and a new page manager (
AddReturnNew) plus bundle wiring for the new return-request UI. - Gate “Return” entry points in order details and orders list on returns settings; update
CHANGELOG.md.
Reviewed changes
Copilot reviewed 10 out of 10 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| templates/pages/guest-return-portal.html | New guest-facing return portal page scaffold. |
| templates/pages/account/orders/details.html | Gate “Return” button using returns_v2_enabled OR returns_enabled. |
| templates/pages/account/add-return-new.html | New account return-request page markup for the redesigned flow. |
| templates/components/account/orders-list.html | Gate “Return Items” link using returns_v2_enabled OR returns_enabled. |
| CHANGELOG.md | Add draft entries for the new return pages / gating changes. |
| assets/scss/components/stencil/addReturn/_addReturn.scss | Add styling for the new return-request page (.newReturn). |
| assets/js/theme/add-return-new.js | New page manager that renders the new return UI (currently with placeholder data). |
| assets/js/app.js | Wire account_new_return page type to load the new return page manager. |
Comments suppressed due to low confidence (3)
assets/js/theme/add-return-new.js:96
- Date formatting is hardcoded to the
en-AUlocale. This will display incorrect date formats for stores with different locales; use store locale from Stencil context (e.g.this.context.storeLocale) or omit the locale to allow the browser/store locale to drive formatting.
// TODO ORDERS-7715: invoke createReturn Storefront GQL mutation.
});
}
}
assets/js/theme/add-return-new.js:142
- Currency formatting is hardcoded to
en-AUand always usesitem.totalIncTaxeven thoughorder.isTaxInclusiveis available. This will display incorrect amounts/formatting for non-AU stores and for tax-exclusive display settings. Use a locale from context and choosetotalIncTaxvstotalExTaxbased onorder.isTaxInclusive(or use server-provided formatted totals if available).
assets/js/theme/add-return-new.js:239 console.log('Submitting return', ...)should not ship in theme code. Either remove it or gate it behind an explicit debug flag, and replace with the real API call / proper error handling when wiring this up.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| account_order: getAccount, | ||
| account_addressbook: getAccount, | ||
| shippingaddressform: getAccount, | ||
| account_new_return: getAccount, | ||
| account_new_return: getAddReturnNew, | ||
| 'add-wishlist': () => import('./theme/wishlist'), |
| {{> components/common/breadcrumbs breadcrumbs=breadcrumbs}} | ||
|
|
||
| <h1> Guest Return Portal</h1> | ||
|
|
| </div> | ||
| <div class="newReturn-headerActions"> | ||
| <a href="{{../urls.account.orders.all}}" class="newReturn-btnBack">{{lang 'account.orders.return.back_button'}}</a> | ||
| <a href="/return-policy" class="newReturn-btnPolicy">View return policy →</a> | ||
| </div> | ||
| </div> | ||
| {{#if date}}<p class="newReturn-orderDate">{{date}}</p>{{/if}} |
| this.bindSubmit($form); | ||
| } | ||
|
|
||
| bindOrderLineItemEvents() { | ||
| document.querySelectorAll('.newReturn-stepperBtn').forEach(button => { | ||
| button.addEventListener('click', () => { | ||
| // Derive itemId from the parent row — buttons do not carry data-item-id, | ||
| // so the [data-item-id] selector stays scoped to the row container only. | ||
| const row = button.closest('.newReturn-orderLineItem'); | ||
| const itemId = row?.dataset?.itemId; | ||
| if (!itemId) return; | ||
| const action = button.getAttribute('data-action'); |
| - Fix duplicate `id="default_instrument"` on Update Payment Method page [#2661](https://github.com/bigcommerce/cornerstone/pull/2661) | ||
| - Respect `available_to_sell` on PDP so the Sold Out alert is hidden and the Add to Cart button stays enabled for backorderable products, and is disabled when quantity exceeds `available_to_sell` [#2659](https://github.com/bigcommerce/cornerstone/pull/2659) | ||
| - Updated accessibility features [2656](https://github.com/bigcommerce/cornerstone/pull/2656) | ||
| - Adds new guest-return-portal page. [2645](https://github.com/bigcommerce/cornerstone/pull/2645) |
|
cursor review |
| requestedResolution: this.buildRequestedResolution(document.getElementById(`resolution-${itemId}`)?.value), | ||
| }]; | ||
| }), | ||
| }; |
There was a problem hiding this comment.
Additional note omitted from payload
Medium Severity
The create-return page collects an “Additional Note” in data-new-return-note, but buildReturnInput() never reads that field, so shopper notes are dropped and never sent with the createReturn mutation.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit bcea92e. Configure here.
| } finally { | ||
| this.isSubmitting = false; | ||
| if (submitBtn) submitBtn.disabled = false; | ||
| if (overlay) overlay.style.display = ''; |
There was a problem hiding this comment.
Submit re-enabled without validation
Medium Severity
After a failed or errored createReturn request, the submit handler’s finally block sets return-new-submitBtn to enabled without calling updateSubmitState(), so the button can stay clickable when no line items have quantity, resolution, and reason filled in.
Reviewed by Cursor Bugbot for commit 34bc18e. Configure here.
…2653) * feat(returns): ORDERS-7704 condition for new returns on orders page * feat(returns): ORDERS-7704 condition for new returns on orders page - confirmed
feat(orders): ORDERS-7706 add new return page layout
…context (#2665) * feat(returns): ORDERS-7708 new-return page — render items from order context, stepper qty controls, responsive layout, gate behind returns_v2_enabled flag * feat(returns): ORDERS-7708 new-return page - review feedback
34bc18e to
38101ea
Compare
feat(orders): ORDERS-7681 add Cancel return button to return-detailsjs page
…age-mobile-tablet-views feat(returns): ORDERS-7771 tighten spacing on mobile and tablet viewports
| } finally { | ||
| this.isCancelling = false; | ||
| if (cancelBtn) cancelBtn.disabled = false; | ||
| if (overlay) overlay.style.display = ''; |
There was a problem hiding this comment.
Cancel enabled before reload
Medium Severity
On successful cancel, window.location.reload() runs but the finally block always clears isCancelling and re-enables the cancel button before navigation finishes, allowing duplicate cancel requests against an already-cancelled return.
Reviewed by Cursor Bugbot for commit 8a15ff6. Configure here.
| throw new Error('Failed to start return guest session'); | ||
| } | ||
|
|
||
| window.location.href = `/create-return/${payload.orderEntityId}`; |
There was a problem hiding this comment.
Guest redirect ignores locale path
Medium Severity
After a successful guest session, navigation uses a root-absolute /create-return/{orderId} URL, which drops the active language subfolder on multi-language storefronts and can land shoppers on the wrong locale or a 404.
Reviewed by Cursor Bugbot for commit 20ca5bc. Configure here.
…h phone contact details if available. (#2698)
| if (!errorBox) return; | ||
|
|
||
| errorBox.style.display = ''; | ||
| } |
There was a problem hiding this comment.
API errors never shown
Medium Severity
getErrorMessages collects GraphQL error text, but showError only reveals the static error box and never writes those messages into the DOM, so shoppers always see the generic copy.
Reviewed by Cursor Bugbot for commit 4a8e4e7. Configure here.
| {{lang 'account.returns.contact_merchant' phone_number=../settings.phone_number }} | ||
| </p> | ||
| {{/if}} | ||
| </p> |
There was a problem hiding this comment.
Nested paragraph in error markup
Low Severity
The create-return error block nests a second <p class="alertBox-message"> inside another alertBox-message paragraph when phone_number is set, which is invalid HTML and can break error layout in the browser.
Reviewed by Cursor Bugbot for commit 4a8e4e7. Configure here.
feat(orders): ORDERS-7935 add badge for CANCELLED order returns
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
There are 7 total unresolved issues (including 6 from previous reviews).
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 99a9c87. Configure here.
| } | ||
|
|
||
| startReturnGuestSession(input) { | ||
| return fetch('/graphql', { |
There was a problem hiding this comment.
GraphQL fetch omits base URL
Medium Severity
New returns flows call fetch('/graphql', …) with a root-absolute URL, unlike other theme API usage that passes secureBaseUrl, so GraphQL may miss the correct prefixed path on multi-language storefronts.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit 99a9c87. Configure here.
… on returns details page (#2697) * feat(returns): ORDERS-7900: strike requested with resolved resolution on returns details page * feat(returns): ORDERS-7900: add translation strings for resolution request
…page for desktop/tablet/mobile views
…gination feat(returns): ORDERS-7752 add cursor pagination to returns
feat(orders): ORDERS-7770 add responsive styling for returns details page for desktop/tablet/mobile views


What?
This PR is for a feature branch to park all reviewed changes related to the new returns flow PROJECT-7525
Requirements
Tickets / Documentation
PROJECT-7525
Screenshots (if appropriate)
Not applicable: They are part of individual PRs
Testing
TBD
Note
Medium Risk
New order-return GraphQL mutations and guest session flow touch post-purchase behavior; scope is large but gated on returns settings and errors are handled in UI.
Overview
Introduces a returns v2 storefront experience behind
settings.returns_v2_enabled(withreturns_enabledfallback for order return entry points).New pages and JS: lazy-loaded modules for guest return portal (email/order validation,
startReturnGuestSessionGraphQL, redirect to create return), create return (line-item qty/reason/resolution,createReturnmutation, confirmation UI), and return details (requested vs resolved resolution display, cancel return viacancelReturnwith modal confirmation).app.jsmapscreate_return,guest_return_portal,account_return_detail, andreturn_detailpage types.Account UI: When v2 is on, the returns account page uses a new returns list (
returns-list-v2) with status badges, detail links, and cursor-based prev/next pagination; legacy list remains when v2 is off. Order list and order details Return links respect the new setting gate.Templates & i18n: New Handlebars for guest portal, create return, and return details; expanded
lang/en.jsonfor the flow. SCSS adds dedicated styling for create return, return details, returns list, and guest portal, plus shared account list/status label tweaks. Minor a11y fixes on legacy add-return table labels.Reviewed by Cursor Bugbot for commit e9386f6. Bugbot is set up for automated code reviews on this repo. Configure here.