fix(money): design review polishes — CTA, convert info icon, copy, kebab icon (MUSD-805)#30301
Conversation
…bab icon (MUSD-805) - MoneyBalanceCard: zero balance shows Primary "Earn", funded shows Secondary "Add" - mUSD conversion navbar: header info icon greyed (IconColor.IconAlternative) - Condensed card subtitle: "See how your money can grow" - Money More sheet: "How it works" option uses Book icon
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
…state The test name claimed a Primary-variant check but only asserted presence, so a Primary->Secondary regression would pass silently. Query the Button element by testID + variant so the design contract is actually verified.
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 2 potential issues.
❌ 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 bb4e471. Configure here.
| ...actual, | ||
| BottomSheet: MockBottomSheet, | ||
| BottomSheetHeader: MockBottomSheetHeader, | ||
| Icon: MockIcon, |
There was a problem hiding this comment.
Mocking MMDS Icon component to inject testIDs
Low Severity
The Icon component from @metamask/design-system-react-native is mocked solely to surface name as a testID. Per the unit testing guidelines, MMDS components should never be mocked just to inject testIDs — the Icon component already accepts a testID prop directly. Adding testID={icon-${item.icon}} to the <Icon> element in MoneyMoreSheet.tsx would make the mock unnecessary and keep the tests aligned with the team's testing conventions.
Additional Locations (1)
Triggered by project rule: Unit Testing Guidelines
Reviewed by Cursor Bugbot for commit bb4e471. Configure here.
Per docs/testing/unit-testing.md, toBeTruthy() on a query result is banned for presence checks. The intent of this assertion is the variant value itself, so read variant off the queried node and assert with toBe(ButtonVariant.Primary). UNSAFE_getByProps still throws if the testID+variant combination is missing, preserving the original failure mode.
🔍 Smart E2E Test Selection
click to see 🤖 AI reasoning detailsE2E Test Selection:
All changes are confined to the Money and Earn UI components with no impact on core controllers, navigation infrastructure, or shared components. SmokeMoney covers the MetaMask Card and Money flows directly affected. SmokeStake covers the Earn/mUSD lending flows affected by the navbar change. SmokeConfirmations is included per tag dependency guidance since Money and Stake flows involve transaction confirmations. No other tags are warranted as there are no changes to accounts, networks, swaps, browser, snaps, or other feature areas. Performance Test Selection: |
|
Description
Design-review polish pass for the Money home experience (MUSD-805):
useTheme().colors.icon.alternative/.default) instead of design-systemIconColor.*tokens. Rationale: the design-system preset has noThemeProvidermounted in this app, soIconColor.*always resolves to the light palette, while the navbar background follows the real app theme (useNavbar→getNavbar({ theme })) — leaving the icon invisible on a dark header. Sourcing the color from the app theme keeps the greyed ⓘ (and the back arrow) correctly visible across light and dark.Scope stayed within Money/Earn-owned code — no shared confirmations components were modified.
Changelog
CHANGELOG entry: null
Related issues
Fixes: https://consensyssoftware.atlassian.net/browse/MUSD-805
Manual testing steps
Screenshots/Recordings
Before
Convert screen header info icon rendered white; home CTA labelled "Add" on empty balance.
After
Pre-merge author checklist
Performance checks (if applicable)
Pre-merge reviewer checklist
Note
Low Risk
Low risk UI/UX tweaks and test updates; only behavioral change is which CTA label/testID appears on the balance card when the balance is zero, while navigation target remains the Add Money sheet.
Overview
Updates the Money balance card so a zero/empty balance now shows a primary “Earn” CTA (using
EARN_BUTTON) instead of “Add”, while funded balances still show the secondary “Add” CTA; tests are updated to assert the new label/variant and navigation behavior.Greys out the mUSD conversion navbar info icon by switching its
ButtonIconcolor toIconColor.IconAlternativeand adds a regression test for the icon color.Replaces the Money “More” sheet “How it works” row icon from
InfotoBook(with new icon assertions in tests) and updates the “How it works” condensed card subtitle copy inen.json.Reviewed by Cursor Bugbot for commit 58abc63. Bugbot is set up for automated code reviews on this repo. Configure here.