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 82 commits into
Conversation
BC-SEven
changed the title
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 |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
34bc18e to
38101ea
Compare
| } | ||
|
|
||
| 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.
| const overlay = document.querySelector('.guest-return-portal .loadingOverlay'); | ||
| if (submitBtn) submitBtn.disabled = true; | ||
| if (overlay) overlay.style.display = 'block'; | ||
| const payload = this.buildRequestPayload(); |
There was a problem hiding this comment.
Guest error alert never cleared
Low Severity
The guest return portal shows errors via showError but never hides or clears the alert when a new submit starts. A prior failure message stays visible during and after later attempts until navigation succeeds.
Reviewed by Cursor Bugbot for commit 8447deb. 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.
Root-absolute return URLs
Medium Severity
After a successful guest session, navigation uses a root-absolute /create-return/... URL, and the returns list links to /account.php?.... On multi-language storefronts with locale subfolders, those paths skip the active prefix while other return links use urls.*, so shoppers can land on the wrong locale or a broken page.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit de1a079. Configure here.
feat(orders): ORDERS-7706 add new return page layout
…keys-to-snake-case fix(returns): ORDERS-7752 rename keys to be snake_case for consistency
…eatures-returns-list-page feat(returns): ORDERS-7878 add accessibility to returns list page
| errorEl.textContent = isValid ? '' : (this.context.additionalNoteTooLongError || ''); | ||
| errorEl.style.display = isValid ? 'none' : ''; | ||
| } | ||
| } |
There was a problem hiding this comment.
Note field missing aria-invalid
Medium Severity
Accessibility: forms/errors — renderAdditionalNoteValidation toggles the visible error but never sets aria-invalid on the additional-note control. Invalid state is not exposed to assistive tech on the field itself (see .claude/skills/accessibility/SKILL.md).
Additional Locations (1)
Triggered by project rule: Accessibility (WCAG 2.2 AA) for Cornerstone storefront UI
Reviewed by Cursor Bugbot for commit 0aad70a. Configure here.
feat(orders): ORDERS-7961 fix styling for Warm and Bold themes for Status badge
…atures-return-details Orders 7875 accesibility features return details
…eturns-entry-points Orders 7877 accessibility returns entry points
feat(orders): ORDERS-7876 improve accessibility for guest-return page
| { | ||
| "name": "bigcommerce-cornerstone", | ||
| "version": "6.21.0", | ||
| "version": "6.19.1", |
There was a problem hiding this comment.
Lockfile version desynchronized
Medium Severity
package-lock.json root and packages[""] versions were changed to 6.19.1 while package.json remains 6.21.0, leaving the lockfile out of sync with the package manifest.
Reviewed by Cursor Bugbot for commit 4dda924. Configure here.
…r accessibility and seo (#2726) * feat(returns): ORDERS-7945 add page title to returns related pages for accessibility and seo * feat(returns): ORDERS-7945 add page title to create returns and guest return portal pages only
feat(orders): ORDERS-7966 add items total to returns detail and listing pages
…returns listing and details page
…based on context flag (#2731)
feat(orders): ORDERS-7965 fix return listing page quantity displayed
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 cf40115. Configure here.
| </div> | ||
| <div class="account-returnsList-detail"> | ||
| <dt class="account-returnsList-detail-heading">{{lang 'account.returns.list.return_quantity' }}</dt> | ||
| <dd class="account-returnsList-detail-value">{{sum (pluck items 'quantity')}}</dd> |
There was a problem hiding this comment.
Nonexistent sum helper
High Severity
{{sum (pluck items 'quantity')}} calls a sum helper that Stencil/paper-handlebars does not provide (pluck alone is valid and already used elsewhere). The returns list Quantity value will fail to render correctly—likely a missing-helper render error or an empty field—so shoppers never see total returned units.
Reviewed by Cursor Bugbot for commit cf40115. Configure here.
feat(orders): ORDERS-7965 align date format and status badge between returns listing and details page
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
Large, customer-facing account flows with new GraphQL mutations and token use; regressions could affect return submission, guest lookup, or cancel actions and accessibility behavior across orders/returns surfaces.
Overview
This feature branch lands the returns v2 shopper experience in Cornerstone: new create return, guest return portal, returns list (v2), and return details pages, with JS page modules wired in
app.jsand GraphQL calls forcreateReturn,startReturnGuestSession, andcancelReturnusing the injected storefront API token.Gating and navigation — Account nav, mobile nav, order list/detail return entry points, and the returns account page now respect
settings.returns_v2_enabled(withreturns_enabledfallback where applicable). When v2 is on, the returns page shows the new list partial, item totals, cursor-based prev/next pagination, and links to return details; CMS pages can surface a Go to return portal button when configured.UX and accessibility — Templates and theme JS add WCAG-oriented patterns across the flow: order-scoped
aria-labels, corrected tab order on orders list, translatable<title>fallbacks inbase.html, dialog semantics on the shared alert modal, live regions /aria-busy/aria-invalidon forms,aria-disabledsubmit with hints, and confirmation focus on headings. Legacy add-return markup gets loop-safe ids and a table label. Repo docs add an accessibility skill (SKILL.md, examples, reference) and a Cursor template-accessibility review rule plus Bugbot config.Presentation — New SCSS for create return, return details, returns list, and guest portal; return status badge theme tokens in
config.json; expandedlang/en.jsonstrings and a consolidated DraftCHANGELOG.mdentry set.Reviewed by Cursor Bugbot for commit 5b6890b. Bugbot is set up for automated code reviews on this repo. Configure here.