Skip to content

test: color-no-hex rewards#27031

Merged
georgewrmarshall merged 3 commits intomainfrom
chore/color-no-hex-rewards-batch-4
Mar 6, 2026
Merged

test: color-no-hex rewards#27031
georgewrmarshall merged 3 commits intomainfrom
chore/color-no-hex-rewards-batch-4

Conversation

@georgewrmarshall
Copy link
Copy Markdown
Contributor

@georgewrmarshall georgewrmarshall commented Mar 5, 2026

Description

This PR is the Rewards-only split of the color-no-hex batch work, extracted from the original umbrella PR #26651.

Scope:

  • Rewards files only (app/components/UI/Rewards/**)
  • temporary eslint rollout override for app/components/UI/Rewards/**/*.{js,jsx,ts,tsx}
  • includes replacing straightforward mock color suppressions with mockTheme in a subset of Rewards tests

Reference PR: #26651

Changelog

CHANGELOG entry: null

Related issues

Fixes:

Manual testing steps

Feature: color-no-hex rewards batch

  Scenario: validate rewards lint and tests
    Given this branch is checked out
    When running eslint for Rewards scope
    Then there are no lint errors

    When running jest for Rewards scope with snapshot updates
    Then tests pass

Screenshots/Recordings

Before

N/A (test/lint/config updates only)

After

N/A (test/lint/config updates only)

Pre-merge author checklist

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

Note

Low Risk
Low runtime risk since changes are limited to ESLint configuration plus test/story updates; main risk is CI/dev friction if any remaining Rewards hex literals trigger the newly-enforced lint rule.

Overview
Enforces @metamask/design-tokens/color-no-hex for Rewards UI code. Updates .eslintrc.js to include app/components/UI/Rewards/**/* in the folders where hex colors are treated as lint errors.

Aligns Rewards tests/stories with the rule. Rewards tests now mock useTheme by reusing the shared mockTheme (and remove a local onboarding mockTheme helper), and a Rewards Storybook story (RewardPointsAnimation) is refactored to use Tailwind/design-system Buttons instead of inline styles/hex colors, with a couple of tests explicitly scoping hex-only mock API colors behind lint disables.

Written by Cursor Bugbot for commit 3a5d5c1. This will update automatically on new commits. Configure here.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Mar 5, 2026

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.

@georgewrmarshall georgewrmarshall force-pushed the chore/color-no-hex-rewards-batch-4 branch from 30bd473 to f780018 Compare March 5, 2026 00:51
@github-actions github-actions bot added the size-M label Mar 5, 2026
Copy link
Copy Markdown

@cursor cursor bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Bugbot Autofix prepared a fix for the issue found in the latest run.

  • ✅ Fixed: Unresolved git merge conflict markers in test file
    • Removed merge conflict markers and properly merged required mocks (safe-area, theme, design system) in RewardsSettingsView.test.tsx.

Create PR

Or push these changes by commenting:

@cursor push f99d56dea9
Preview (f99d56dea9)
diff --git a/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx b/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
--- a/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
+++ b/app/components/UI/Rewards/Views/RewardsSettingsView.test.tsx
@@ -25,13 +25,6 @@
   };
 });
 
-<<<<<<< HEAD
-// Mock react-native-safe-area-context (override SafeAreaView only; keep SafeAreaProvider etc. for stack)
-jest.mock('react-native-safe-area-context', () => {
-  const React = jest.requireActual('react');
-  const { View } = jest.requireActual('react-native');
-  const actual = jest.requireActual('react-native-safe-area-context');
-=======
 // Mock theme
 jest.mock('../../../../util/theme', () => {
   const { mockTheme } = jest.requireActual('../../../../util/theme');
@@ -45,11 +38,76 @@
   getNavigationOptionsTitle: jest.fn(() => ({ title: 'Settings' })),
 }));
 
-// Mock design system components
+// Mock design system components (minimal set used by header)
 jest.mock('@metamask/design-system-react-native', () => {
-  const { View, Text } = jest.requireActual('react-native');
->>>>>>> 30bd473975 (test: migrate color-no-hex for rewards codeowner batch)
+  const ReactActual = jest.requireActual('react');
+  const {
+    View,
+    Text: RNText,
+    TouchableOpacity,
+  } = jest.requireActual('react-native');
   return {
+    Box: ({
+      children,
+      testID,
+      ...props
+    }: {
+      children?: React.ReactNode;
+      testID?: string;
+      [key: string]: unknown;
+    }) => ReactActual.createElement(View, { testID, ...props }, children),
+    Text: ({
+      children,
+      ...props
+    }: {
+      children?: React.ReactNode;
+      [key: string]: unknown;
+    }) => ReactActual.createElement(RNText, props, children),
+    ButtonIcon: ({
+      onPress,
+      testID,
+      isDisabled,
+      ...props
+    }: {
+      onPress?: () => void;
+      testID?: string;
+      isDisabled?: boolean;
+      [key: string]: unknown;
+    }) =>
+      ReactActual.createElement(TouchableOpacity, {
+        onPress,
+        testID,
+        disabled: isDisabled,
+        ...props,
+      }),
+    // Enums/constants used by components
+    IconName: {
+      ArrowLeft: 'arrow-left',
+      Close: 'close',
+    },
+    ButtonIconSize: {
+      Md: 'md',
+      Lg: 'lg',
+    },
+    TextVariant: {
+      BodyMd: 'BodyMd',
+      BodySm: 'BodySm',
+    },
+    FontWeight: {
+      Bold: 'bold',
+    },
+    BoxAlignItems: {
+      Center: 'center',
+    },
+  };
+});
+
+// Mock react-native-safe-area-context (override SafeAreaView only; keep SafeAreaProvider etc. for stack)
+jest.mock('react-native-safe-area-context', () => {
+  const React = jest.requireActual('react');
+  const { View } = jest.requireActual('react-native');
+  const actual = jest.requireActual('react-native-safe-area-context');
+  return {
     ...actual,
     useSafeAreaInsets: jest.fn(() => ({
       top: 0,

<Button size={ButtonSize.Md} onPress={handleIdle}>
Set random value
</Button>
</View>
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After

after720.mov

@georgewrmarshall georgewrmarshall self-assigned this Mar 5, 2026
@georgewrmarshall georgewrmarshall added the team-design-system All issues relating to design system in Mobile label Mar 5, 2026
@georgewrmarshall georgewrmarshall force-pushed the chore/color-no-hex-rewards-batch-4 branch from c01c82f to 32776a7 Compare March 5, 2026 01:44
@georgewrmarshall georgewrmarshall changed the title test: color-no-hex rewards codeowner batch test: color-no-hex rewards Mar 5, 2026
@georgewrmarshall georgewrmarshall marked this pull request as ready for review March 5, 2026 03:03
@georgewrmarshall georgewrmarshall requested a review from a team as a code owner March 5, 2026 03:03
@georgewrmarshall georgewrmarshall force-pushed the chore/color-no-hex-rewards-batch-4 branch from 32776a7 to 3a5d5c1 Compare March 6, 2026 01:21
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Mar 6, 2026

🔍 Smart E2E Test Selection

  • Selected E2E tags: None (no tests recommended)
  • Selected Performance tags: None (no tests recommended)
  • Risk Level: low
  • AI Confidence: 95%
click to see 🤖 AI reasoning details

E2E Test Selection:
This PR contains only unit test file changes and ESLint configuration updates for the Rewards feature:

  1. ESLint configuration (.eslintrc.js): Consolidates multiple file pattern rules into a single array and adds the Rewards directory to the @metamask/design-tokens/color-no-hex rule. This is a developer tooling change with no runtime impact.

  2. Unit test files (25 files in app/components/UI/Rewards/): All changes are refactoring test mocks to use the centralized mockTheme from app/util/theme instead of defining local mock theme objects. This improves test consistency but has no production code impact.

  3. Storybook story file: Refactors to use design system components instead of inline styles - this is developer documentation/tooling only.

  4. testUtils.ts: Removes the local mockTheme definition since tests now import from the centralized location.

No production code is modified in this PR. All changes are confined to:

  • Unit test files (*.test.tsx, *.test.ts)
  • ESLint configuration
  • Storybook stories

There are no E2E tests for the Rewards feature, and since no production code is changed, no E2E tests need to run to validate these changes.

Performance Test Selection:
No performance tests are needed because this PR only modifies unit test files, ESLint configuration, and Storybook stories. No production code is changed that could affect app performance. The changes are purely test infrastructure improvements (using centralized mock theme) and developer tooling updates.

View GitHub Actions results

@sonarqubecloud
Copy link
Copy Markdown

sonarqubecloud bot commented Mar 6, 2026

@georgewrmarshall georgewrmarshall added this pull request to the merge queue Mar 6, 2026
Merged via the queue into main with commit 65e5c81 Mar 6, 2026
61 checks passed
@georgewrmarshall georgewrmarshall deleted the chore/color-no-hex-rewards-batch-4 branch March 6, 2026 10:10
@github-actions github-actions bot locked and limited conversation to collaborators Mar 6, 2026
@metamaskbot metamaskbot added the release-7.70.0 Issue or pull request that will be included in release 7.70.0 label Mar 6, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

release-7.70.0 Issue or pull request that will be included in release 7.70.0 size-M team-design-system All issues relating to design system in Mobile

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants