refactor(predict): migrate Text component to design-system-react-native

[caieu]

Description

• Replace component-library Text imports with @metamask/design-system-react-native
• Update TextVariant enum values to new naming convention:
  • HeadingLG → HeadingLg, HeadingSM → HeadingSm
  • BodyMDMedium/BodyMD → BodyMd
  • BodySMMedium/BodySM → BodySm
  • BodyXSMedium/BodyXS → BodyXs
• Update TextColor enum values to new naming convention:
  • Default → TextDefault
  • Alternative → TextAlternative
  • Success → SuccessDefault
  • Error → ErrorDefault
• Apply font-medium via Tailwind for previously *Medium variants

Files updated:

• PredictFeedHeader
• PredictBalance
• PredictMarketRowItem
• PredictMarketOutcomeResolved
• PredictPositionResolved
• PredictPosition
• PredictMarketSingle
• PredictPositionDetail
• PredictMarketMultiple

Changelog

CHANGELOG entry: null

Related issues

Fixes:

Manual testing steps

Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]

Screenshots/Recordings

Before

After

Pre-merge author checklist

• [ ] I’ve followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• [ ] I've completed the PR template to the best of my ability
• [ ] I’ve included tests if applicable
• [ ] I’ve documented my code using JSDoc format if applicable
• [ ] I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

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] Migrates Predict UI to use design-system Text with new variant/color enums and adjusts related icon colors and styles.

• Design System Migration
  • Replace component-library Text with @metamask/design-system-react-native/Text across Predict components.
  • Update TextVariant naming (e.g., HeadingLG/SM → HeadingLg/Sm, Body* → Body*) and TextColor values (Default → TextDefault, Alternative → TextAlternative, Success/Error → SuccessDefault/ErrorDefault).
  • Apply font-medium via Tailwind where previous *Medium variants were used.
• Components Updated
  • PredictBalance, PredictFeedHeader, PredictMarketMultiple, PredictMarketOutcomeResolved, PredictMarketRowItem, PredictMarketSingle, PredictPosition, PredictPositionDetail, PredictPositionResolved.
• Icons
  • Switch to IconColor where applicable (e.g., Alternative, Success).

^{Written by Cursor Bugbot for commit f8073737e6195c1370fea5eb980d56fc13460a61. This will update automatically on new commits. Configure here.}

[github-actions[bot]]

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.

[github-actions[bot]]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokePredictions
• Risk Level: low
• AI Confidence: 95%

click to see 🤖 AI reasoning details

All 11 changed files are exclusively within the app/components/UI/Predict/ directory, which is the Predictions feature module. The changes are:

1. Design System Migration: All components are migrating from the internal component library's Text components (app/component-library/components/Texts/Text) to the newer @metamask/design-system-react-native package. This includes Text, TextColor, TextVariant, and IconColor imports.

2. Enum Value Updates: The TextVariant and TextColor enum values are being updated to the new naming convention:

   • TextVariant.BodyMDMedium → TextVariant.BodyMd (with font-medium style)
   • TextColor.Default → TextColor.TextDefault
   • TextColor.Success → TextColor.SuccessDefault
   • etc.

3. Unit Test Additions: New carousel mode tests added for PredictMarketMultiple and PredictMarketSingle components.

These are purely styling/UI refactoring changes with no functional logic modifications. The changes are completely isolated to the Predictions feature - there are no core modules, controllers, Engine components, or critical paths affected. The SmokePredictions tag is the exact match for validating this prediction market feature area.

View GitHub Actions results

[sonarqubecloud[bot]]

Quality Gate passed

Issues
2 New issues
0 Accepted issues

Measures
0 Security Hotspots
100.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud