Merge branch 'develop' into feat/update-assets-controllers-v38.2.0

app/scripts/constants/sentry-state.ts

@@ -102,6 +102,10 @@ export const SENTRY_BACKGROUND_STATE = {
         destNetworkAllowlist: [],
         srcNetworkAllowlist: [],
       },
+      destTokens: {},
+      destTopAssets: [],
+      srcTokens: {},
+      srcTopAssets: [],
     },
   },
   CronjobController: {

app/scripts/controllers/bridge/bridge-controller.test.ts

@@ -1,6 +1,7 @@
 import nock from 'nock';
 import { BRIDGE_API_BASE_URL } from '../../../../shared/constants/bridge';
 import { CHAIN_IDS } from '../../../../shared/constants/network';
+import { SWAPS_API_V2_BASE_URL } from '../../../../shared/constants/swaps';
 import BridgeController from './bridge-controller';
 import { BridgeControllerMessenger } from './types';
 import { DEFAULT_BRIDGE_CONTROLLER_STATE } from './constants';
@@ -32,6 +33,28 @@ describe('BridgeController', function () {
         'src-network-allowlist': [10, 534352],
         'dest-network-allowlist': [137, 42161],
       });
+    nock(BRIDGE_API_BASE_URL)
+      .get('/getTokens?chainId=10')
+      .reply(200, [
+        {
+          address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+          symbol: 'ABC',
+          decimals: 16,
+        },
+        {
+          address: '0x1291478912',
+          symbol: 'DEF',
+          decimals: 16,
+        },
+      ]);
+    nock(SWAPS_API_V2_BASE_URL)
+      .get('/networks/10/topAssets')
+      .reply(200, [
+        {
+          address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+          symbol: 'ABC',
+        },
+      ]);
   });
 
   it('constructor should setup correctly', function () {
@@ -51,4 +74,49 @@ describe('BridgeController', function () {
       expectedFeatureFlagsResponse,
     );
   });
+
+  it('selectDestNetwork should set the bridge dest tokens and top assets', async function () {
+    await bridgeController.selectDestNetwork('0xa');
+    expect(bridgeController.state.bridgeState.destTokens).toStrictEqual({
+      '0x0000000000000000000000000000000000000000': {
+        address: '0x0000000000000000000000000000000000000000',
+        decimals: 18,
+        iconUrl: './images/eth_logo.svg',
+        name: 'Ether',
+        symbol: 'ETH',
+      },
+      '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984': {
+        address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+        symbol: 'ABC',
+        decimals: 16,
+      },
+    });
+    expect(bridgeController.state.bridgeState.destTopAssets).toStrictEqual([
+      { address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984', symbol: 'ABC' },
+    ]);
+  });
+
+  it('selectSrcNetwork should set the bridge src tokens and top assets', async function () {
+    await bridgeController.selectSrcNetwork('0xa');
+    expect(bridgeController.state.bridgeState.srcTokens).toStrictEqual({
+      '0x0000000000000000000000000000000000000000': {
+        address: '0x0000000000000000000000000000000000000000',
+        decimals: 18,
+        iconUrl: './images/eth_logo.svg',
+        name: 'Ether',
+        symbol: 'ETH',
+      },
+      '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984': {
+        address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+        symbol: 'ABC',
+        decimals: 16,
+      },
+    });
+    expect(bridgeController.state.bridgeState.srcTopAssets).toStrictEqual([
+      {
+        address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+        symbol: 'ABC',
+      },
+    ]);
+  });
 });

app/scripts/controllers/bridge/bridge-controller.ts

@@ -1,7 +1,14 @@
 import { BaseController, StateMetadata } from '@metamask/base-controller';
+import { Hex } from '@metamask/utils';
+import {
+  fetchBridgeFeatureFlags,
+  fetchBridgeTokens,
+  // TODO: Remove restricted import
+  // eslint-disable-next-line import/no-restricted-paths
+} from '../../../../ui/pages/bridge/bridge.util';
 // TODO: Remove restricted import
 // eslint-disable-next-line import/no-restricted-paths
-import { fetchBridgeFeatureFlags } from '../../../../ui/pages/bridge/bridge.util';
+import { fetchTopAssetsList } from '../../../../ui/pages/swaps/swaps.util';
 import {
   BRIDGE_CONTROLLER_NAME,
   DEFAULT_BRIDGE_CONTROLLER_STATE,
@@ -32,6 +39,14 @@ export default class BridgeController extends BaseController<
       `${BRIDGE_CONTROLLER_NAME}:setBridgeFeatureFlags`,
       this.setBridgeFeatureFlags.bind(this),
     );
+    this.messagingSystem.registerActionHandler(
+      `${BRIDGE_CONTROLLER_NAME}:selectSrcNetwork`,
+      this.selectSrcNetwork.bind(this),
+    );
+    this.messagingSystem.registerActionHandler(
+      `${BRIDGE_CONTROLLER_NAME}:selectDestNetwork`,
+      this.selectDestNetwork.bind(this),
+    );
   }
 
   resetState = () => {
@@ -49,4 +64,33 @@ export default class BridgeController extends BaseController<
       _state.bridgeState = { ...bridgeState, bridgeFeatureFlags };
     });
   };
+
+  selectSrcNetwork = async (chainId: Hex) => {
+    await this.#setTopAssets(chainId, 'srcTopAssets');
+    await this.#setTokens(chainId, 'srcTokens');
+  };
+
+  selectDestNetwork = async (chainId: Hex) => {
+    await this.#setTopAssets(chainId, 'destTopAssets');
+    await this.#setTokens(chainId, 'destTokens');
+  };
+
+  #setTopAssets = async (
+    chainId: Hex,
+    stateKey: 'srcTopAssets' | 'destTopAssets',
+  ) => {
+    const { bridgeState } = this.state;
+    const topAssets = await fetchTopAssetsList(chainId);
+    this.update((_state) => {
+      _state.bridgeState = { ...bridgeState, [stateKey]: topAssets };
+    });
+  };
+
+  #setTokens = async (chainId: Hex, stateKey: 'srcTokens' | 'destTokens') => {
+    const { bridgeState } = this.state;
+    const tokens = await fetchBridgeTokens(chainId);
+    this.update((_state) => {
+      _state.bridgeState = { ...bridgeState, [stateKey]: tokens };
+    });
+  };
 }

app/scripts/controllers/bridge/constants.ts

@@ -8,4 +8,8 @@ export const DEFAULT_BRIDGE_CONTROLLER_STATE: BridgeControllerState = {
     [BridgeFeatureFlagsKey.NETWORK_SRC_ALLOWLIST]: [],
     [BridgeFeatureFlagsKey.NETWORK_DEST_ALLOWLIST]: [],
   },
+  srcTokens: {},
+  srcTopAssets: [],
+  destTokens: {},
+  destTopAssets: [],
 };

app/scripts/controllers/bridge/types.ts

@@ -3,6 +3,7 @@ import {
   RestrictedControllerMessenger,
 } from '@metamask/base-controller';
 import { Hex } from '@metamask/utils';
+import { SwapsTokenObject } from '../../../../shared/constants/swaps';
 import BridgeController from './bridge-controller';
 import { BRIDGE_CONTROLLER_NAME } from './constants';
 
@@ -20,8 +21,16 @@ export type BridgeFeatureFlags = {
 
 export type BridgeControllerState = {
   bridgeFeatureFlags: BridgeFeatureFlags;
+  srcTokens: Record<string, SwapsTokenObject>;
+  srcTopAssets: { address: string }[];
+  destTokens: Record<string, SwapsTokenObject>;
+  destTopAssets: { address: string }[];
 };
 
+export enum BridgeUserAction {
+  SELECT_SRC_NETWORK = 'selectSrcNetwork',
+  SELECT_DEST_NETWORK = 'selectDestNetwork',
+}
 export enum BridgeBackgroundAction {
   SET_FEATURE_FLAGS = 'setBridgeFeatureFlags',
 }
@@ -33,7 +42,9 @@ type BridgeControllerAction<FunctionName extends keyof BridgeController> = {
 
 // Maps to BridgeController function names
 type BridgeControllerActions =
-  BridgeControllerAction<BridgeBackgroundAction.SET_FEATURE_FLAGS>;
+  | BridgeControllerAction<BridgeBackgroundAction.SET_FEATURE_FLAGS>
+  | BridgeControllerAction<BridgeUserAction.SELECT_SRC_NETWORK>
+  | BridgeControllerAction<BridgeUserAction.SELECT_DEST_NETWORK>;
 
 type BridgeControllerEvents = ControllerStateChangeEvent<
   typeof BRIDGE_CONTROLLER_NAME,

app/scripts/metamask-controller.js

@@ -347,7 +347,10 @@ import { updateSecurityAlertResponse } from './lib/ppom/ppom-util';
 import createEvmMethodsToNonEvmAccountReqFilterMiddleware from './lib/createEvmMethodsToNonEvmAccountReqFilterMiddleware';
 import { isEthAddress } from './lib/multichain/address';
 import { decodeTransactionData } from './lib/transaction/decode/util';
-import { BridgeBackgroundAction } from './controllers/bridge/types';
+import {
+  BridgeUserAction,
+  BridgeBackgroundAction,
+} from './controllers/bridge/types';
 import BridgeController from './controllers/bridge/bridge-controller';
 import { BRIDGE_CONTROLLER_NAME } from './controllers/bridge/constants';
 import {
@@ -3888,6 +3891,15 @@ export default class MetamaskController extends EventEmitter {
           this.controllerMessenger,
           `${BRIDGE_CONTROLLER_NAME}:${BridgeBackgroundAction.SET_FEATURE_FLAGS}`,
         ),
+      [BridgeUserAction.SELECT_SRC_NETWORK]: this.controllerMessenger.call.bind(
+        this.controllerMessenger,
+        `${BRIDGE_CONTROLLER_NAME}:${BridgeUserAction.SELECT_SRC_NETWORK}`,
+      ),
+      [BridgeUserAction.SELECT_DEST_NETWORK]:
+        this.controllerMessenger.call.bind(
+          this.controllerMessenger,
+          `${BRIDGE_CONTROLLER_NAME}:${BridgeUserAction.SELECT_DEST_NETWORK}`,
+        ),
 
       // Smart Transactions
       fetchSmartTransactionFees: smartTransactionsController.getFees.bind(

test/e2e/default-fixture.js

@@ -127,6 +127,10 @@ function defaultFixture(inputChainId = CHAIN_IDS.LOCALHOST) {
             srcNetworkAllowlist: ['0x1', '0xa', '0xe708'],
             destNetworkAllowlist: ['0x1', '0xa', '0xe708'],
           },
+          destTokens: {},
+          destTopAssets: [],
+          srcTokens: {},
+          srcTopAssets: [],
         },
       },
       CurrencyController: {

test/e2e/fixture-builder.js

@@ -400,6 +400,10 @@ class FixtureBuilder {
           extensionSupport: false,
           srcNetworkAllowlist: [],
         },
+        destTokens: {},
+        destTopAssets: [],
+        srcTokens: {},
+        srcTopAssets: [],
       },
     };
     return this;

test/e2e/snaps/test-snap-installed.spec.js

@@ -35,7 +35,7 @@ describe('Test Snap Installed', function () {
 
         const confirmButton = await driver.findElement('#connectdialogs');
         await driver.scrollToElement(confirmButton);
-        await driver.delay(500);
+        await driver.delay(1000);
         await driver.clickElement('#connectdialogs');
 
         // switch to metamask extension and click connect

test/e2e/tests/bridge/bridge-test-utils.ts

@@ -120,7 +120,17 @@ const mockServer =
             };
           }),
     );
-    return Promise.all(featureFlagMocks);
+    const portfolioMock = async () =>
+      await mockServer_
+        .forGet('https://portfolio.metamask.io/bridge')
+        .always()
+        .thenCallback(() => {
+          return {
+            statusCode: 200,
+            json: {},
+          };
+        });
+    return Promise.all([...featureFlagMocks, portfolioMock]);
   };
 
 export const getBridgeFixtures = (

test/e2e/tests/metrics/state-snapshots/errors-after-init-opt-in-background-state.json

@@ -65,7 +65,11 @@
         "extensionSupport": "boolean",
         "srcNetworkAllowlist": { "0": "string", "1": "string", "2": "string" },
         "destNetworkAllowlist": { "0": "string", "1": "string", "2": "string" }
-      }
+      },
+      "destTokens": {},
+      "destTopAssets": {},
+      "srcTokens": {},
+      "srcTopAssets": {}
     }
   },
   "CronjobController": { "jobs": "object" },

test/e2e/tests/metrics/state-snapshots/errors-after-init-opt-in-ui-state.json

@@ -252,7 +252,11 @@
         "extensionSupport": "boolean",
         "srcNetworkAllowlist": { "0": "string", "1": "string", "2": "string" },
         "destNetworkAllowlist": { "0": "string", "1": "string", "2": "string" }
-      }
+      },
+      "destTokens": {},
+      "destTopAssets": {},
+      "srcTokens": {},
+      "srcTopAssets": {}
     },
     "ensEntries": "object",
     "ensResolutionsByAddress": "object",

test/e2e/tests/metrics/state-snapshots/errors-before-init-opt-in-background-state.json

@@ -153,7 +153,11 @@
             "1": "string",
             "2": "string"
           }
-        }
+        },
+        "destTokens": {},
+        "destTopAssets": {},
+        "srcTokens": {},
+        "srcTopAssets": {}
       }
     },
     "SubjectMetadataController": { "subjectMetadata": "object" },

test/e2e/tests/metrics/state-snapshots/errors-before-init-opt-in-ui-state.json

@@ -162,7 +162,11 @@
             "1": "string",
             "2": "string"
           }
-        }
+        },
+        "destTokens": {},
+        "destTopAssets": {},
+        "srcTokens": {},
+        "srcTopAssets": {}
       }
     },
     "TransactionController": { "transactions": "object" },

test/jest/mock-store.js

@@ -705,16 +705,23 @@ export const createSwapsMockStore = () => {
 export const createBridgeMockStore = (
   featureFlagOverrides = {},
   bridgeSliceOverrides = {},
+  bridgeStateOverrides = {},
+  metamaskStateOverrides = {},
 ) => {
   const swapsStore = createSwapsMockStore();
   return {
     ...swapsStore,
     bridge: {
-      toChain: null,
+      toChainId: null,
       ...bridgeSliceOverrides,
     },
     metamask: {
       ...swapsStore.metamask,
+      ...mockNetworkState(
+        { chainId: CHAIN_IDS.MAINNET },
+        { chainId: CHAIN_IDS.LINEA_MAINNET },
+      ),
+      ...metamaskStateOverrides,
       bridgeState: {
         ...(swapsStore.metamask.bridgeState ?? {}),
         bridgeFeatureFlags: {
@@ -723,11 +730,8 @@ export const createBridgeMockStore = (
           destNetworkAllowlist: [],
           ...featureFlagOverrides,
         },
+        ...bridgeStateOverrides,
       },
-      ...mockNetworkState(
-        { chainId: CHAIN_IDS.MAINNET },
-        { chainId: CHAIN_IDS.LINEA_MAINNET },
-      ),
     },
   };
 };