feat(rewards): add VIP badge and discounted fee display to Bridge and Perps#30439
Conversation
Replace the inline -X% discount badge in PerpsFeesDisplay with the RewardsVipBadge component and a struck-through original fee, matching the extension's perps-vip-feature implementation. - Update PerpsFeesDisplay to accept raw fee/originalFee numbers instead of pre-formatted text, show VIP badge when discount is active - Add undiscountedTotalFee to usePerpsOrderFees hook return value - Create usePerpsAccountId hook for CAIP-10 account ID in perps views - Update all consumers (PerpsOrderView, PerpsClosePositionView, PerpsCloseSummary, PerpsFlipPositionConfirmSheet) to pass originalFee and accountId to PerpsFeesDisplay - Update tests and mocks for the new component API
…t ID lookup Extract useVipTier hook that derives the CAIP-10 account ID from Redux selectors and fetches the VIP tier internally, removing the need for consumers to pass accountId as a prop to RewardsVipBadge.
|
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. |
Display VIP badge and fee discount details in the fees tooltip when a discount is active: banner with savings message, VIP badge inline with the MetaMask fee row, and strikethrough original rate.
The useVipTier hook inside RewardsVipBadge calls Engine.context.RewardsController which is unavailable in the test environment, causing two Rewards Points Row tests to crash.
# Conflicts: # app/components/UI/Bridge/Views/BridgeView/BridgeViewFooter.tsx # app/components/UI/Rewards/components/RewardsVipBadge/RewardsVipBadge.test.tsx # app/components/UI/Rewards/components/RewardsVipBadge/RewardsVipBadge.tsx
The VIP fee discount was previously always fetched from the backend regardless of any feature flag. This gates it behind the remote `vipProgramEnabled` flag at three levels: UI preview hooks (usePerpsOrderFees, usePerpsCloseAllCalculations) and the execution layer adapter (mobileInfrastructure rewards bridge).
Switch from a plain boolean to the { enabled, minimumVersion }
VersionGatedFeatureFlag shape so the flag matches the LaunchDarkly
payload and supports minimum-version gating. Register the flag in
the feature-flag registry and document it in the perps feature-flags
reference.
…elected network useVipTier was using the deprecated selectChainId selector to construct the CAIP-10 account ID, which breaks VIP badge lookups when the user's selected network differs from the account's registration chain or when a non-EVM network is selected. Derive the CAIP ID from the internal account's own scopes instead, matching the pattern used by the RewardsController's convertInternalAccountToCaipAccountId.
Add cleanup function with cancelled flag to the useVipTier useEffect to prevent stale promises from overwriting state when the user switches accounts. Also reset vipTier to null immediately when a new fetch begins so the old badge doesn't flash while the new tier loads.
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
There are 2 total unresolved issues (including 1 from previous review).
❌ 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 c97f348. Configure here.
The hook was unconditionally calling RewardsController.getVipTierForAccount without checking the remote feature flag, inconsistent with all other VIP-related code paths. This could fire unnecessary API calls and display a badge when the VIP program is disabled.
🔍 Smart E2E Test Selection
click to see 🤖 AI reasoning detailsE2E Test Selection: The PR introduces VIP program feature flag gating and refactors the fee display system across Perps and Bridge components:
The The localization change updates the discount message text which is a low-risk string change. Risk is medium because the fee display refactoring touches multiple Perps views and the Bridge footer, but the changes are well-contained and the VIP feature flag is disabled by default. Performance Test Selection: |
Codecov Report❌ Patch coverage is Additional details and impacted files@@ Coverage Diff @@
## main #30439 +/- ##
==========================================
- Coverage 82.13% 82.13% -0.01%
==========================================
Files 5488 5492 +4
Lines 147743 147857 +114
Branches 33969 34012 +43
==========================================
+ Hits 121353 121437 +84
- Misses 18084 18114 +30
Partials 8306 8306 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
racitores
left a comment
There was a problem hiding this comment.
would it be possible to use component view tests for these PR instead of unit? we are trying to standardise how unit test are written to avoid too much mock and have test a bit more controlled of what is been tested.
There is a skill that helps a lot adding these tests and I reckon it could migrate most of them into cv test.
I don't think you need to do it now but it would be nice to have it done in a subsequent PR. Is it ok?
Description
Adds VIP tier badge and discounted fee display across Bridge and Perps features. When a user has an active VIP tier from the Rewards program, the UI now shows:
PerpsFeesDisplaycomponent that accepts rawfee/originalFeenumbers instead of pre-formatted text, enabling it to handle discount presentation internallyOn the controller side, the VIP fees fetch logic (
#getVipFeesForSubscriptionId) is extracted into a reusable private method, and a new publicgetVipTierForAccountmethod is exposed via the messenger so any feature can query the user's VIP tier.Changelog
CHANGELOG entry: Added VIP badge and discounted fee display for Bridge and Perps views when user has an active Rewards VIP tier
Related issues
Fixes:
Manual testing steps
Screenshots/Recordings
Before
After
Pre-merge author checklist
Performance checks (if applicable)
trace()for usage andaddTokenfor an exampleFor performance guidelines and tooling, see the Performance Guide.
Pre-merge reviewer checklist
Note
Medium Risk
Updates fee calculation/formatting and display across Perps order/close flows and Bridge footer, and gates discount retrieval behind a new remote feature flag; mistakes could lead to incorrect fee presentation. Behavior is mostly UI-level with added tests and a flag fallback to 0 discount when disabled.
Overview
Adds VIP fee-discount presentation across Bridge and Perps: fee rows now show a
RewardsVipBadgeand, when discounted, a struck-through original fee/rate alongside the discounted value.Refactors
PerpsFeesDisplayto take numericfee/originalFee(plus placeholder) and handle formatting/discount visuals internally, and extends perps fee hooks/results to returnundiscountedTotalFeefor UI use.Introduces a new version-gated remote flag
vipProgramEnabled(selectVipProgramEnabled) and uses it to short-circuit rewards discount/tier fetching (returning 0/none when disabled), plus updates tooltip copy/styles and broadens mocks/tests to cover the new VIP badge/discount behaviors.Reviewed by Cursor Bugbot for commit f85265c. Bugbot is set up for automated code reviews on this repo. Configure here.