[Chakra V3 Upgrade] @W-18672916 refactor Wishlist page buttons by sf-jie-dai · Pull Request #2768 · SalesforceCommerceCloud/pwa-kit

sf-jie-dai · 2025-07-09T20:58:36Z

Migrated WishlistSecondaryButtonGroup component, and refactored its unit tests
Migrated WishlistPrimaryAction component
- Migrated useDisclosure to show product view modal correctly
- Verified add-to-cart successfully will show successful toast for product with inventory
- Verified add-to-cart will show error toast for out-of-stock product
- Commented out add-to-cart/add-set-to-cart unit tests, created W-18999715 to track that

success toast:

error toast:

Description

Types of Changes

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Documentation update
Breaking change (could cause existing functionality to not work as expected)
Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

Removing a public function or component or prop

Adding a required argument to a function

Changing the data type of a function parameter or return value

Adding a new peer dependency to package.json

How to Test-Drive This PR

(step1)

Checklists

General

Changes are covered by test cases
CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

There are no changes to UI

or...

Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
Changes comply with WCAG 2.0 guidelines levels A and AA
Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

Changes include a UI text update in the Retail React App (which requires translation)

cc-prodsec · 2025-07-09T20:59:01Z

🎉 Snyk checks have passed. No issues have been found so far.

✅ security/snyk check is complete. No issues have been found. (View Details)

✅ license/snyk check is complete. No issues have been found. (View Details)

.../extension-chakra-storefront/src/pages/account/wishlist/partials/wishlist-primary-action.jsx

...hakra-storefront/src/pages/account/wishlist/partials/wishlist-secondary-button-group.test.js

alexvuong · 2025-07-10T23:53:36Z

Please make sure there are no more React warning act().... warnings in the terminal when you run tests in this PR. To do that always wrap user actions in

await act(async () => {
 await user.actions()
})

sf-jie-dai · 2025-07-11T11:32:58Z

Please make sure there are no more React warning act().... warnings in the terminal when you run tests in this PR. To do that always wrap user actions in
await act(async () => {
 await user.actions()
})

Thanks for the reminder! Just updated tests above

alexvuong

LGTM

…ctorWishlishPageCmp

...ension-chakra-storefront/src/pages/account/wishlist/partials/wishlist-primary-action.test.js

) * migrate wishlist secondary button group * migrate wishlist primary action * migrate useDisclosure hook * comment out failing tests * add back button hover style * use prependHandlersToServer in jest-setup to simplify server setup * wrap user action in act to avoid React warning

* migrate and enable wishlist page * [Chakra V3 Upgrade] @W-18672916 refactor Wishlist page components (#2768) * migrate wishlist secondary button group * migrate wishlist primary action * migrate useDisclosure hook * comment out failing tests * add back button hover style * use prependHandlersToServer in jest-setup to simplify server setup * wrap user action in act to avoid React warning * skip commented tests to track them * fix confirmation modal header style * fix loading state for useWishlist hook * center the text for empty wishlist/order history pages * simplify code with Flex * use string number for gap * fix perttier issue * Update packages/extension-chakra-storefront/src/pages/account/wishlist/index.jsx Co-authored-by: Alex Vuong <alex.vuong@salesforce.com> Signed-off-by: sf-jie-dai <jie.dai@salesforce.com> * fix perttier issue --------- Signed-off-by: sf-jie-dai <jie.dai@salesforce.com> Co-authored-by: Alex Vuong <alex.vuong@salesforce.com>

) * migrate wishlist secondary button group * migrate wishlist primary action * migrate useDisclosure hook * comment out failing tests * add back button hover style * use prependHandlersToServer in jest-setup to simplify server setup * wrap user action in act to avoid React warning

* migrate and enable wishlist page * [Chakra V3 Upgrade] @W-18672916 refactor Wishlist page components (#2768) * migrate wishlist secondary button group * migrate wishlist primary action * migrate useDisclosure hook * comment out failing tests * add back button hover style * use prependHandlersToServer in jest-setup to simplify server setup * wrap user action in act to avoid React warning * skip commented tests to track them * fix confirmation modal header style * fix loading state for useWishlist hook * center the text for empty wishlist/order history pages * simplify code with Flex * use string number for gap * fix perttier issue * Update packages/extension-chakra-storefront/src/pages/account/wishlist/index.jsx Co-authored-by: Alex Vuong <alex.vuong@salesforce.com> Signed-off-by: sf-jie-dai <jie.dai@salesforce.com> * fix perttier issue --------- Signed-off-by: sf-jie-dai <jie.dai@salesforce.com> Co-authored-by: Alex Vuong <alex.vuong@salesforce.com>

sf-jie-dai added 2 commits July 9, 2025 13:22

migrate wishlist secondary button group

0c0cc68

migrate wishlist primary action

c4f4a95

sf-jie-dai changed the title ~~@W-18672916 refactor Wishlist page components~~ @W-18672916 refactor Wishlist page components[WIP] Jul 9, 2025

alexvuong reviewed Jul 10, 2025

View reviewed changes

.../extension-chakra-storefront/src/pages/account/wishlist/partials/wishlist-primary-action.jsx Show resolved Hide resolved

alexvuong reviewed Jul 10, 2025

View reviewed changes

...hakra-storefront/src/pages/account/wishlist/partials/wishlist-secondary-button-group.test.js Outdated Show resolved Hide resolved

sf-jie-dai added 4 commits July 10, 2025 14:57

migrate useDisclosure hook

69b34b8

comment out failing tests

5a12097

add back button hover style

84a02e1

use prependHandlersToServer in jest-setup to simplify server setup

784f369

sf-jie-dai changed the title ~~@W-18672916 refactor Wishlist page components[WIP]~~ [Chakra V3 Upgrade] @W-18672916 refactor Wishlist page components Jul 10, 2025

sf-jie-dai requested a review from alexvuong July 10, 2025 19:34

sf-jie-dai marked this pull request as ready for review July 10, 2025 19:35

sf-jie-dai requested a review from a team as a code owner July 10, 2025 19:35

alexvuong reviewed Jul 10, 2025

View reviewed changes

...hakra-storefront/src/pages/account/wishlist/partials/wishlist-secondary-button-group.test.js Outdated Show resolved Hide resolved

alexvuong reviewed Jul 10, 2025

View reviewed changes

...hakra-storefront/src/pages/account/wishlist/partials/wishlist-secondary-button-group.test.js Outdated Show resolved Hide resolved

wrap user action in act to avoid React warning

54d8cdb

sf-jie-dai requested a review from alexvuong July 11, 2025 11:33

alexvuong approved these changes Jul 11, 2025

View reviewed changes

Merge branch 'feature/chakra-ui-upgrade-v3' into jdai.W-18672916.refa…

fbf62aa

…ctorWishlishPageCmp

unandyala approved these changes Jul 14, 2025

View reviewed changes

...ension-chakra-storefront/src/pages/account/wishlist/partials/wishlist-primary-action.test.js Show resolved Hide resolved

sf-jie-dai merged commit f9ec5e9 into feature/chakra-ui-upgrade-v3 Jul 14, 2025
33 checks passed

sf-jie-dai deleted the jdai.W-18672916.refactorWishlishPageCmp branch July 14, 2025 17:51

sf-jie-dai self-assigned this Jul 16, 2025

sf-jie-dai changed the title ~~[Chakra V3 Upgrade] @W-18672916 refactor Wishlist page components~~ [Chakra V3 Upgrade] @W-18672916 refactor Wishlist page buttons Jul 16, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Chakra V3 Upgrade] @W-18672916 refactor Wishlist page buttons#2768

[Chakra V3 Upgrade] @W-18672916 refactor Wishlist page buttons#2768
sf-jie-dai merged 8 commits intofeature/chakra-ui-upgrade-v3from
jdai.W-18672916.refactorWishlishPageCmp

sf-jie-dai commented Jul 9, 2025 •

edited

Loading

Uh oh!

cc-prodsec commented Jul 9, 2025 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

alexvuong commented Jul 10, 2025

Uh oh!

sf-jie-dai commented Jul 11, 2025 •

edited

Loading

Uh oh!

alexvuong left a comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

sf-jie-dai commented Jul 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Types of Changes

How to Test-Drive This PR

Checklists

General

Accessibility Compliance

Localization

Uh oh!

cc-prodsec commented Jul 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎉 Snyk checks have passed. No issues have been found so far.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

alexvuong commented Jul 10, 2025

Uh oh!

sf-jie-dai commented Jul 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

alexvuong left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

sf-jie-dai commented Jul 9, 2025 •

edited

Loading

cc-prodsec commented Jul 9, 2025 •

edited

Loading

sf-jie-dai commented Jul 11, 2025 •

edited

Loading