feat: malicious token screening on transactions (#22688)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

Introduces token screening on incoming tokens received in transactions.
This comes in the form of two different alerts (yellow and red).

## **Changelog**

<!--
If this PR is not End-User-Facing and should not show up in the
CHANGELOG, you can choose to either:
1. Write `CHANGELOG entry: null`
2. Label with `no-changelog`

If this PR is End-User-Facing, please write a short User-Facing
description in the past tense like:
`CHANGELOG entry: Added a new tab for users to see their NFTs`
`CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`

(This helps the Release Engineer do their job more quickly and
accurately)
-->

CHANGELOG entry: Added an alert if an incoming token is malicious or
suspicious.

## **Related issues**

Fixes:

## **Manual testing steps**

```gherkin
Feature: Token screening on incoming tokens in transactions
  Scenario: user initiates a transaction where they receive malicious tokens
    Given the user is on the `Transaction request` screen
    And they are receiving tokens that is flagged as malicious

    When user views the screen
    Then they will see a red alert on `You receive`
    And a red `Review alert` button
    
  Scenario: user initiates a transaction where they receive suspicious tokens
    Given the user is on the `Transaction request` screen
    And they are receiving tokens that is flagged as suspicious

    When user views the screen
    Then they will see a yellow alert on `You receive`
```

- For a malicious token, you can swap for
`0x69e8b9528cabda89fe846c67675b5d73d463a916` on a swap website.
- For a suspicious token, you can swap for
`0xd0cd466b34a24fcb2f87676278af2005ca8a78c4` on a swap website.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->
**1. No yellow alert**

<img width="402" height="853" alt="Screenshot 2025-11-18 at 12 00 50 PM"
src="https://github.com/user-attachments/assets/c176193c-26ff-44eb-9b10-160381da3356"
/>

**2. No red alert**

<img width="398" height="843" alt="Screenshot 2025-11-18 at 12 01 34 PM"
src="https://github.com/user-attachments/assets/148f9c4e-6f5c-4d79-b0d2-11932c39dbfb"
/>

### **After**

<!-- [screenshots/recordings] -->
**1. Yellow alert**

<img width="386" height="841" alt="Screenshot 2025-11-18 at 11 41 51 AM"
src="https://github.com/user-attachments/assets/4028a106-357a-42fd-a7e9-2b60301b1185"
/>

**2. Red alert**
<img width="383" height="618" alt="Screenshot 2025-11-19 at 9 15 25 AM"
src="https://github.com/user-attachments/assets/01e04dfe-5abc-42fa-84f6-dca1bf05477c"
/>

**When you click the inline alert**
<img width="403" height="667" alt="Screenshot 2025-11-19 at 9 15 40 AM"
src="https://github.com/user-attachments/assets/1ddeed60-64e7-4c2e-8305-3fecca11e715"
/>

**When you click the 'Review alert' button**
<img width="389" height="641" alt="Screenshot 2025-11-19 at 9 17 41 AM"
src="https://github.com/user-attachments/assets/9c305ec1-534e-49a6-bc8c-6ea39a4d28cc"
/>


## **Pre-merge author checklist**

- [ ] I’ve followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] 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](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
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.




<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Adds malicious/suspicious token screening to transaction confirmations
with inline alerts, selectors, strings, and tests.
> 
> - **Confirmations UI/UX**:
> - Show `AlertRow` on `BalanceChangeRow` label when `hasIncomingTokens`
is true, with style override in `alert-row.styles`.
> - Compute `hasIncomingTokens` in `BalanceChangeList` and pass to rows.
> - **Alerts System**:
> - New `useTokenTrustSignalAlerts` hook to derive alerts from token
scan results; integrated into `useConfirmationAlerts`.
> - Added `RowAlertKey.IncomingTokens` and new alert keys
`TokenTrustSignalMalicious`/`TokenTrustSignalWarning` with metrics
mappings.
> - **State Selectors**:
> - New `selectMultipleTokenScanResults` to read
`PhishingController.tokenScanCache` for multiple tokens.
> - **Localization**:
>   - English strings for malicious/suspicious token alerts.
> - **Dependencies**:
>   - Upgrade `@metamask/phishing-controller` to `^16.1.0`.
> - **Tests**:
> - Unit tests for `BalanceChangeRow`, `AlertRow`,
`useTokenTrustSignalAlerts`, `useConfirmationAlerts`, and phishing
selectors.
> - **Test fixtures**:
> - Update initial background state to include `addressScanCache` and
`tokenScanCache`.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
ff7ae25. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

---------

Co-authored-by: sethkfman <setk.kaufman@consensys.net>

Author: imblue-dabadee

app/components/UI/SimulationDetails/BalanceChangeList/BalanceChangeList.tsx

@@ -8,6 +8,7 @@ import BalanceChangeRow from '../BalanceChangeRow/BalanceChangeRow';
 import { BalanceChange } from '../types';
 import { TotalFiatDisplay } from '../FiatDisplay/FiatDisplay';
 import styleSheet from './BalanceChangeList.styles';
+
 interface BalanceChangeListProperties extends ViewProps {
   heading: string;
   balanceChanges: BalanceChange[];
@@ -28,6 +29,12 @@ const BalanceChangeList: React.FC<BalanceChangeListProperties> = ({
     [sortedBalanceChanges],
   );
 
+  const hasIncomingTokens = useMemo(
+    () =>
+      balanceChanges.some((balanceChange) => balanceChange.amount.isPositive()),
+    [balanceChanges],
+  );
+
   if (sortedBalanceChanges.length === 0) {
     return null;
   }
@@ -45,6 +52,7 @@ const BalanceChangeList: React.FC<BalanceChangeListProperties> = ({
           label={index === 0 ? heading : undefined}
           balanceChange={balanceChange}
           showFiat={!showFiatTotal}
+          hasIncomingTokens={hasIncomingTokens}
         />
       ))}
       {showFiatTotal && (

app/components/UI/SimulationDetails/BalanceChangeRow/BalanceChangeRow.test.tsx

@@ -80,4 +80,41 @@ describe('BalanceChangeList', () => {
 
     expect(getByTestId('edit-spending-cap-button')).toBeTruthy();
   });
+
+  it('renders an alert row if there are incoming tokens and a label is provided', () => {
+    const { getByTestId, queryByTestId } = render(
+      <BalanceChangeRow
+        showFiat={false}
+        balanceChange={balanceChangeMock}
+        label="You received"
+        hasIncomingTokens
+      />,
+    );
+    expect(getByTestId('info-row')).toBeTruthy();
+    expect(queryByTestId('balance-change-row-label')).toBeNull();
+  });
+
+  it('does not render an alert row if there are no incoming tokens', () => {
+    const { getByTestId, queryByTestId } = render(
+      <BalanceChangeRow
+        showFiat={false}
+        balanceChange={balanceChangeMock}
+        label="You received"
+        hasIncomingTokens={false}
+      />,
+    );
+    expect(getByTestId('balance-change-row-label')).toBeTruthy();
+    expect(queryByTestId('info-row')).toBeNull();
+  });
+
+  it('does not render an alert row if no label is provided', () => {
+    const { queryByTestId } = render(
+      <BalanceChangeRow
+        showFiat={false}
+        balanceChange={balanceChangeMock}
+        hasIncomingTokens
+      />,
+    );
+    expect(queryByTestId('info-row')).toBeNull();
+  });
 });

app/components/UI/SimulationDetails/BalanceChangeRow/BalanceChangeRow.tsx

@@ -14,6 +14,9 @@ import AmountPill from '../AmountPill/AmountPill';
 import AssetPill from '../AssetPill/AssetPill';
 import { IndividualFiatDisplay } from '../FiatDisplay/FiatDisplay';
 import styleSheet from './BalanceChangeRow.styles';
+import AlertRow from '../../../Views/confirmations/components/UI/info-row/alert-row';
+import { RowAlertKey } from '../../../Views/confirmations/components/UI/info-row/alert-row/constants';
+import alertRowStyleSheet from '../../../Views/confirmations/components/UI/info-row/alert-row/alert-row.styles';
 
 interface BalanceChangeRowProperties extends ViewProps {
   approveMethod?: ApproveMethod;
@@ -24,6 +27,7 @@ interface BalanceChangeRowProperties extends ViewProps {
     newSpendingCap: string,
   ) => Promise<void>;
   showFiat?: boolean;
+  hasIncomingTokens?: boolean;
 }
 
 const BalanceChangeRow: React.FC<BalanceChangeRowProperties> = ({
@@ -32,23 +36,42 @@ const BalanceChangeRow: React.FC<BalanceChangeRowProperties> = ({
   label,
   onApprovalAmountUpdate,
   showFiat,
+  hasIncomingTokens,
 }) => {
   const { styles } = useStyles(styleSheet, {});
+  const { styles: alertRowStyles } = useStyles(alertRowStyleSheet, {});
   const { asset, amount, fiatAmount, isAllApproval, isUnlimitedApproval } =
     balanceChange;
   const isERC20 = balanceChange.asset.type === AssetType.ERC20;
   const shouldShowEditSpendingCapButton = isERC20 && onApprovalAmountUpdate;
+
+  const renderLabel = () => {
+    if (!label) {
+      return null;
+    }
+    if (hasIncomingTokens) {
+      return (
+        <AlertRow
+          alertField={RowAlertKey.IncomingTokens}
+          label={label}
+          style={alertRowStyles.alertRowOverride}
+        />
+      );
+    }
+    return (
+      <Text
+        testID="balance-change-row-label"
+        variant={TextVariant.BodyMDMedium}
+        color={TextColor.Alternative}
+      >
+        {label}
+      </Text>
+    );
+  };
+
   return (
     <View style={styles.container}>
-      {label && (
-        <Text
-          testID="balance-change-row-label"
-          variant={TextVariant.BodyMDMedium}
-          color={TextColor.Alternative}
-        >
-          {label}
-        </Text>
-      )}
+      {renderLabel()}
       <View style={styles.pillContainer}>
         <View style={styles.pills}>
           {shouldShowEditSpendingCapButton ? (

app/components/Views/confirmations/components/UI/info-row/alert-row/alert-row.styles.ts

@@ -6,6 +6,10 @@ const styleSheet = () =>
       paddingBottom: 4,
       paddingHorizontal: 8,
     },
+    alertRowOverride: {
+      marginLeft: 0,
+      paddingLeft: 0,
+    },
   });
 
 export default styleSheet;

app/components/Views/confirmations/components/UI/info-row/alert-row/alert-row.test.tsx

@@ -6,6 +6,7 @@ import { Severity } from '../../../../types/alerts';
 import { IconName } from '../../../../../../../component-library/components/Icons/Icon';
 import { useConfirmationAlertMetrics } from '../../../../hooks/metrics/useConfirmationAlertMetrics';
 import { InfoRowVariant } from '../info-row';
+import styleSheet from './alert-row.styles';
 
 jest.mock('../../../../context/alert-system-context', () => ({
   useAlerts: jest.fn(),
@@ -135,4 +136,19 @@ describe('AlertRow', () => {
     expect(getByText(CHILDREN_MOCK)).toBeDefined();
     expect(queryByTestId('inline-alert')).toBeNull();
   });
+
+  it('renders with the given style if provided', () => {
+    const props = { ...baseProps, style: { backgroundColor: 'red' } };
+    const { getByTestId } = render(<AlertRow {...props} />);
+    const infoRow = getByTestId('info-row');
+    expect(infoRow.props.style.backgroundColor).toBe('red');
+  });
+
+  it('renders with styles.infoRowOverride if no style is provided', () => {
+    const styles = styleSheet();
+    const { getByTestId } = render(<AlertRow {...baseProps} />);
+    const infoRow = getByTestId('info-row');
+
+    expect(infoRow.props.style).toMatchObject(styles.infoRowOverride);
+  });
 });

app/components/Views/confirmations/components/UI/info-row/alert-row/alert-row.tsx

@@ -44,7 +44,7 @@ const AlertRow = ({
   const { fieldAlerts } = useAlerts();
   const alertSelected = fieldAlerts.find((a) => a.field === alertField);
   const { styles } = useStyles(styleSheet, {});
-  const { rowVariant } = props;
+  const { rowVariant, style } = props;
 
   if (!alertSelected && isShownWithAlertsOnly) {
     return null;
@@ -66,7 +66,7 @@ const AlertRow = ({
   return (
     <InfoRow
       {...alertRowProps}
-      style={isSmall ? undefined : styles.infoRowOverride}
+      style={style ?? (isSmall ? undefined : styles.infoRowOverride)}
       labelChildren={inlineAlert}
     />
   );

app/components/Views/confirmations/components/UI/info-row/alert-row/constants.ts

@@ -9,4 +9,5 @@ export enum RowAlertKey {
   PayWithFee = 'payWithFee',
   PendingTransaction = 'pendingTransaction',
   RequestFrom = 'requestFrom',
+  IncomingTokens = 'incomingTokens',
 }

app/components/Views/confirmations/constants/alerts.ts

@@ -13,4 +13,6 @@ export enum AlertKeys {
   PerpsDepositMinimum = 'perps_deposit_minimum',
   PerpsHardwareAccount = 'perps_hardware_account',
   SignedOrSubmitted = 'signed_or_submitted',
+  TokenTrustSignalMalicious = 'token_trust_signal_malicious',
+  TokenTrustSignalWarning = 'token_trust_signal_warning',
 }

app/components/Views/confirmations/hooks/alerts/useConfirmationAlerts.test.ts

@@ -17,6 +17,7 @@ import { useInsufficientPayTokenBalanceAlert } from './useInsufficientPayTokenBa
 import { useNoPayTokenQuotesAlert } from './useNoPayTokenQuotesAlert';
 import { useInsufficientPredictBalanceAlert } from './useInsufficientPredictBalanceAlert';
 import { useBurnAddressAlert } from './useBurnAddressAlert';
+import { useTokenTrustSignalAlerts } from './useTokenTrustSignalAlerts';
 
 jest.mock('./useBlockaidAlerts');
 jest.mock('./useDomainMismatchAlerts');
@@ -29,6 +30,7 @@ jest.mock('./useInsufficientPayTokenBalanceAlert');
 jest.mock('./useNoPayTokenQuotesAlert');
 jest.mock('./useInsufficientPredictBalanceAlert');
 jest.mock('./useBurnAddressAlert');
+jest.mock('./useTokenTrustSignalAlerts');
 
 describe('useConfirmationAlerts', () => {
   const ALERT_MESSAGE_MOCK = 'This is a test alert message.';
@@ -133,6 +135,15 @@ describe('useConfirmationAlerts', () => {
     },
   ];
 
+  const mockTokenTrustSignalAlerts: Alert[] = [
+    {
+      key: 'TokenTrustSignalAlert',
+      title: 'Test Token Trust Signal Alert',
+      message: ALERT_MESSAGE_MOCK,
+      severity: Severity.Danger,
+    },
+  ];
+
   beforeEach(() => {
     jest.clearAllMocks();
     (useBlockaidAlerts as jest.Mock).mockReturnValue([]);
@@ -146,6 +157,7 @@ describe('useConfirmationAlerts', () => {
     (useNoPayTokenQuotesAlert as jest.Mock).mockReturnValue([]);
     (useInsufficientPredictBalanceAlert as jest.Mock).mockReturnValue([]);
     (useBurnAddressAlert as jest.Mock).mockReturnValue([]);
+    (useTokenTrustSignalAlerts as jest.Mock).mockReturnValue([]);
   });
 
   it('returns empty array if no alerts', () => {
@@ -211,6 +223,9 @@ describe('useConfirmationAlerts', () => {
       mockInsufficientPredictBalanceAlert,
     );
     (useBurnAddressAlert as jest.Mock).mockReturnValue(mockBurnAddressAlert);
+    (useTokenTrustSignalAlerts as jest.Mock).mockReturnValue(
+      mockTokenTrustSignalAlerts,
+    );
     const { result } = renderHookWithProvider(() => useConfirmationAlerts(), {
       state: siweSignatureConfirmationState,
     });
@@ -225,6 +240,7 @@ describe('useConfirmationAlerts', () => {
       ...mockNoPayTokenQuotesAlert,
       ...mockInsufficientPredictBalanceAlert,
       ...mockBurnAddressAlert,
+      ...mockTokenTrustSignalAlerts,
       ...mockUpgradeAccountAlert,
     ]);
   });

app/components/Views/confirmations/hooks/alerts/useConfirmationAlerts.ts

@@ -11,6 +11,7 @@ import { useInsufficientPayTokenBalanceAlert } from './useInsufficientPayTokenBa
 import { useNoPayTokenQuotesAlert } from './useNoPayTokenQuotesAlert';
 import { useInsufficientPredictBalanceAlert } from './useInsufficientPredictBalanceAlert';
 import { useBurnAddressAlert } from './useBurnAddressAlert';
+import { useTokenTrustSignalAlerts } from './useTokenTrustSignalAlerts';
 
 function useSignatureAlerts(): Alert[] {
   const domainMismatchAlerts = useDomainMismatchAlerts();
@@ -28,6 +29,7 @@ function useTransactionAlerts(): Alert[] {
   const noPayTokenQuotesAlert = useNoPayTokenQuotesAlert();
   const insufficientPredictBalanceAlert = useInsufficientPredictBalanceAlert();
   const burnAddressAlert = useBurnAddressAlert();
+  const tokenTrustSignalAlerts = useTokenTrustSignalAlerts();
 
   return useMemo(
     () => [
@@ -39,6 +41,7 @@ function useTransactionAlerts(): Alert[] {
       ...noPayTokenQuotesAlert,
       ...insufficientPredictBalanceAlert,
       ...burnAddressAlert,
+      ...tokenTrustSignalAlerts,
     ],
     [
       insufficientBalanceAlert,
@@ -49,6 +52,7 @@ function useTransactionAlerts(): Alert[] {
       noPayTokenQuotesAlert,
       insufficientPredictBalanceAlert,
       burnAddressAlert,
+      tokenTrustSignalAlerts,
     ],
   );
 }