chore: update bridge quote params on input change

app/scripts/constants/sentry-state.ts

@@ -107,6 +107,15 @@ export const SENTRY_BACKGROUND_STATE = {
       destTopAssets: [],
       srcTokens: {},
       srcTopAssets: [],
+      quoteRequest: {
+        walletAddress: false,
+        srcTokenAddress: true,
+        slippage: true,
+        srcChainId: true,
+        destChainId: true,
+        destTokenAddress: true,
+        srcTokenAmount: true,
+      },
     },
   },
   CronjobController: {

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

@@ -59,6 +59,7 @@ describe('BridgeController', function () {
           symbol: 'ABC',
         },
       ]);
+    bridgeController.resetState();
   });
 
   it('constructor should setup correctly', function () {
@@ -102,6 +103,11 @@ describe('BridgeController', function () {
     expect(bridgeController.state.bridgeState.destTopAssets).toStrictEqual([
       { address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984', symbol: 'ABC' },
     ]);
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
   });
 
   it('selectSrcNetwork should set the bridge src tokens and top assets', async function () {
@@ -126,5 +132,76 @@ describe('BridgeController', function () {
         symbol: 'ABC',
       },
     ]);
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+  });
+
+  it('updateBridgeQuoteRequestParams should update the quoteRequest state', function () {
+    bridgeController.updateBridgeQuoteRequestParams({ srcChainId: 1 });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      srcChainId: 1,
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+
+    bridgeController.updateBridgeQuoteRequestParams({ destChainId: 10 });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      destChainId: 10,
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+
+    bridgeController.updateBridgeQuoteRequestParams({ destChainId: undefined });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      destChainId: undefined,
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+
+    bridgeController.updateBridgeQuoteRequestParams({
+      srcTokenAddress: undefined,
+    });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      slippage: 0.5,
+      srcTokenAddress: undefined,
+      walletAddress: undefined,
+    });
+
+    bridgeController.updateBridgeQuoteRequestParams({
+      srcTokenAmount: '100000',
+      destTokenAddress: '0x123',
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      srcTokenAmount: '100000',
+      destTokenAddress: '0x123',
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
+
+    bridgeController.updateBridgeQuoteRequestParams({
+      srcTokenAddress: '0x2ABC',
+    });
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      slippage: 0.5,
+      srcTokenAddress: '0x2ABC',
+      walletAddress: undefined,
+    });
+
+    bridgeController.resetState();
+    expect(bridgeController.state.bridgeState.quoteRequest).toStrictEqual({
+      slippage: 0.5,
+      srcTokenAddress: '0x0000000000000000000000000000000000000000',
+      walletAddress: undefined,
+    });
   });
 });

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

@@ -9,6 +9,9 @@ import {
 // TODO: Remove restricted import
 // eslint-disable-next-line import/no-restricted-paths
 import { fetchTopAssetsList } from '../../../../ui/pages/swaps/swaps.util';
+// TODO: Remove restricted import
+// eslint-disable-next-line import/no-restricted-paths
+import { QuoteRequest } from '../../../../ui/pages/bridge/types';
 import {
   BRIDGE_CONTROLLER_NAME,
   DEFAULT_BRIDGE_CONTROLLER_STATE,
@@ -47,8 +50,29 @@ export default class BridgeController extends BaseController<
       `${BRIDGE_CONTROLLER_NAME}:selectDestNetwork`,
       this.selectDestNetwork.bind(this),
     );
+    this.messagingSystem.registerActionHandler(
+      `${BRIDGE_CONTROLLER_NAME}:updateBridgeQuoteRequestParams`,
+      this.updateBridgeQuoteRequestParams.bind(this),
+    );
   }
 
+  updateBridgeQuoteRequestParams = (paramsToUpdate: Partial<QuoteRequest>) => {
+    const { bridgeState } = this.state;
+    const updatedQuoteRequest = {
+      ...DEFAULT_BRIDGE_CONTROLLER_STATE.quoteRequest,
+      ...paramsToUpdate,
+    };
+
+    this.update((_state) => {
+      _state.bridgeState = {
+        ...bridgeState,
+        quoteRequest: {
+          ...updatedQuoteRequest,
+        },
+      };
+    });
+  };
+
   resetState = () => {
     this.update((_state) => {
       _state.bridgeState = {

app/scripts/controllers/bridge/constants.ts

@@ -1,8 +1,10 @@
+import { zeroAddress } from 'ethereumjs-util';
 import { BridgeControllerState, BridgeFeatureFlagsKey } from './types';
 
 export const BRIDGE_CONTROLLER_NAME = 'BridgeController';
 export const REFRESH_INTERVAL_MS = 30 * 1000;
 const DEFAULT_MAX_REFRESH_COUNT = 5;
+const DEFAULT_SLIPPAGE = 0.5;
 
 export const DEFAULT_BRIDGE_CONTROLLER_STATE: BridgeControllerState = {
   bridgeFeatureFlags: {
@@ -18,4 +20,9 @@ export const DEFAULT_BRIDGE_CONTROLLER_STATE: BridgeControllerState = {
   srcTopAssets: [],
   destTokens: {},
   destTopAssets: [],
+  quoteRequest: {
+    walletAddress: undefined,
+    srcTokenAddress: zeroAddress(),
+    slippage: DEFAULT_SLIPPAGE,
+  },
 };

app/scripts/controllers/bridge/types.ts

@@ -4,6 +4,9 @@ import {
 } from '@metamask/base-controller';
 import { Hex } from '@metamask/utils';
 import { SwapsTokenObject } from '../../../../shared/constants/swaps';
+// TODO: Remove restricted import
+// eslint-disable-next-line import/no-restricted-paths
+import { QuoteRequest } from '../../../../ui/pages/bridge/types';
 import BridgeController from './bridge-controller';
 import { BRIDGE_CONTROLLER_NAME } from './constants';
 
@@ -30,11 +33,13 @@ export type BridgeControllerState = {
   srcTopAssets: { address: string }[];
   destTokens: Record<string, SwapsTokenObject>;
   destTopAssets: { address: string }[];
+  quoteRequest: Partial<QuoteRequest>;
 };
 
 export enum BridgeUserAction {
   SELECT_SRC_NETWORK = 'selectSrcNetwork',
   SELECT_DEST_NETWORK = 'selectDestNetwork',
+  UPDATE_QUOTE_PARAMS = 'updateBridgeQuoteRequestParams',
 }
 export enum BridgeBackgroundAction {
   SET_FEATURE_FLAGS = 'setBridgeFeatureFlags',
@@ -49,7 +54,8 @@ type BridgeControllerAction<FunctionName extends keyof BridgeController> = {
 type BridgeControllerActions =
   | BridgeControllerAction<BridgeBackgroundAction.SET_FEATURE_FLAGS>
   | BridgeControllerAction<BridgeUserAction.SELECT_SRC_NETWORK>
-  | BridgeControllerAction<BridgeUserAction.SELECT_DEST_NETWORK>;
+  | BridgeControllerAction<BridgeUserAction.SELECT_DEST_NETWORK>
+  | BridgeControllerAction<BridgeUserAction.UPDATE_QUOTE_PARAMS>;
 
 type BridgeControllerEvents = ControllerStateChangeEvent<
   typeof BRIDGE_CONTROLLER_NAME,

app/scripts/metamask-controller.js

@@ -3942,6 +3942,11 @@ export default class MetamaskController extends EventEmitter {
           this.controllerMessenger,
           `${BRIDGE_CONTROLLER_NAME}:${BridgeUserAction.SELECT_DEST_NETWORK}`,
         ),
+      [BridgeUserAction.UPDATE_QUOTE_PARAMS]:
+        this.controllerMessenger.call.bind(
+          this.controllerMessenger,
+          `${BRIDGE_CONTROLLER_NAME}:${BridgeUserAction.UPDATE_QUOTE_PARAMS}`,
+        ),
 
       // Smart Transactions
       fetchSmartTransactionFees: smartTransactionsController.getFees.bind(

test/e2e/tests/metrics/errors.spec.js

@@ -57,6 +57,7 @@ const removedBackgroundFields = [
   'AppStateController.currentPopupId',
   'AppStateController.timeoutMinutes',
   'AppStateController.lastInteractedConfirmationInfo',
+  'BridgeController.bridgeState.quoteRequest.walletAddress',
   'PPOMController.chainStatus.0x539.lastVisited',
   'PPOMController.versionInfo',
   // This property is timing-dependent
@@ -862,6 +863,17 @@ describe('Sentry errors', function () {
 
   it('should not have extra properties in UI state mask @no-mmi', async function () {
     const expectedMissingState = {
+      bridgeState: {
+        // This can get wiped out during initialization due to a bug in
+        // the "resetState" method
+        quoteRequest: {
+          destChainId: true,
+          destTokenAddress: true,
+          srcChainId: true,
+          srcTokenAmount: true,
+          walletAddress: false,
+        },
+      },
       currentPopupId: false, // Initialized as undefined
       // Part of transaction controller store, but missing from the initial
       // state

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

@@ -69,6 +69,10 @@
       },
       "destTokens": {},
       "destTopAssets": {},
+      "quoteRequest": {
+        "slippage": 0.5,
+        "srcTokenAddress": "0x0000000000000000000000000000000000000000"
+      },
       "srcTokens": {},
       "srcTopAssets": {}
     }

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

@@ -264,6 +264,10 @@
       },
       "destTokens": {},
       "destTopAssets": {},
+      "quoteRequest": {
+        "slippage": 0.5,
+        "srcTokenAddress": "0x0000000000000000000000000000000000000000"
+      },
       "srcTokens": {},
       "srcTopAssets": {}
     },

ui/ducks/bridge/actions.ts

@@ -11,26 +11,26 @@ import {
 import { forceUpdateMetamaskState } from '../../store/actions';
 import { submitRequestToBackground } from '../../store/background-connection';
 import { MetaMaskReduxDispatch } from '../../store/store';
+import { QuoteRequest } from '../../pages/bridge/types';
 import { bridgeSlice } from './bridge';
 
 const {
-  setToChainId: setToChainId_,
+  setToChainId,
   setFromToken,
   setToToken,
   setFromTokenInputValue,
   resetInputFields,
-  switchToAndFromTokens,
 } = bridgeSlice.actions;
 
 export {
-  setFromToken,
+  setToChainId,
+  resetInputFields,
   setToToken,
+  setFromToken,
   setFromTokenInputValue,
-  switchToAndFromTokens,
-  resetInputFields,
 };
 
-const callBridgeControllerMethod = <T>(
+const callBridgeControllerMethod = <T extends string | Partial<QuoteRequest>>(
   bridgeAction: BridgeUserAction | BridgeBackgroundAction,
   args?: T[],
 ) => {
@@ -62,11 +62,23 @@ export const setFromChain = (chainId: Hex) => {
 
 export const setToChain = (chainId: Hex) => {
   return async (dispatch: MetaMaskReduxDispatch) => {
-    dispatch(setToChainId_(chainId));
     dispatch(
       callBridgeControllerMethod<Hex>(BridgeUserAction.SELECT_DEST_NETWORK, [
         chainId,
       ]),
     );
   };
 };
+
+export const updateQuoteRequestParams = <T extends Partial<QuoteRequest>>(
+  params: T,
+) => {
+  return async (dispatch: MetaMaskReduxDispatch) => {
+    await dispatch(
+      callBridgeControllerMethod<Partial<QuoteRequest>>(
+        BridgeUserAction.UPDATE_QUOTE_PARAMS,
+        [params],
+      ),
+    );
+  };
+};