-
-
-
-
- To view and confirm your most recent request, you'll need to approve or reject existing requests first.
-
-
-
-
@@ -962,7 +942,6 @@ exports[`Signature Request Component render should match snapshot when we want t
>
0
- ETH
-
-
-
-
- To view and confirm your most recent request, you'll need to approve or reject existing requests first.
-
-
-
-
diff --git a/ui/pages/confirmations/components/signature-request/signature-request.js b/ui/pages/confirmations/components/signature-request/signature-request.js
index 3cf2a54327c9..2a7977da0c75 100644
--- a/ui/pages/confirmations/components/signature-request/signature-request.js
+++ b/ui/pages/confirmations/components/signature-request/signature-request.js
@@ -18,16 +18,14 @@ import {
doesAddressRequireLedgerHidConnection,
getSubjectMetadata,
getTotalUnapprovedMessagesCount,
+ selectNetworkConfigurationByChainId,
///: BEGIN:ONLY_INCLUDE_IF(build-mmi)
accountsWithSendEtherInfoSelector,
getSelectedAccount,
getAccountType,
///: END:ONLY_INCLUDE_IF
} from '../../../../selectors';
-import {
- getProviderConfig,
- isAddressLedger,
-} from '../../../../ducks/metamask/metamask';
+import { isAddressLedger } from '../../../../ducks/metamask/metamask';
import {
sanitizeMessage,
///: BEGIN:ONLY_INCLUDE_IF(build-mmi)
@@ -97,6 +95,7 @@ const SignatureRequest = ({ txData, warnings }) => {
const {
id,
type,
+ chainId,
msgParams: { from, data, origin, version },
} = txData;
@@ -104,7 +103,12 @@ const SignatureRequest = ({ txData, warnings }) => {
const hardwareWalletRequiresConnection = useSelector((state) =>
doesAddressRequireLedgerHidConnection(state, from),
);
- const { chainId, rpcPrefs } = useSelector(getProviderConfig);
+
+ const { blockExplorerUrls } = useSelector((state) =>
+ selectNetworkConfigurationByChainId(state, chainId),
+ );
+
+ const blockExplorerUrl = blockExplorerUrls?.[0];
const unapprovedMessagesCount = useSelector(getTotalUnapprovedMessagesCount);
const subjectMetadata = useSelector(getSubjectMetadata);
const isLedgerWallet = useSelector((state) => isAddressLedger(state, from));
@@ -337,7 +341,7 @@ const SignatureRequest = ({ txData, warnings }) => {
setShowContractDetails(false)}
isContractRequestingSignature
/>
diff --git a/ui/pages/confirmations/components/signature-request/signature-request.stories.js b/ui/pages/confirmations/components/signature-request/signature-request.stories.js
index b31032f8b1a7..cc5374e2becb 100644
--- a/ui/pages/confirmations/components/signature-request/signature-request.stories.js
+++ b/ui/pages/confirmations/components/signature-request/signature-request.stories.js
@@ -1,21 +1,25 @@
import React from 'react';
import { Provider } from 'react-redux';
+import { CHAIN_IDS } from '@metamask/transaction-controller';
import configureStore from '../../../../store/store';
import testData from '../../../../../.storybook/test-data';
+import { mockNetworkState } from '../../../../../test/stub/networks';
import README from './README.mdx';
import SignatureRequest from './signature-request';
+const CHAIN_ID_MOCK = CHAIN_IDS.MAINNET;
+
const store = configureStore({
...testData,
metamask: {
...testData.metamask,
+ ...mockNetworkState({ chainId: CHAIN_ID_MOCK }),
},
});
export default {
title: 'Confirmations/Components/SignatureRequest',
decorators: [(story) => {story()}],
-
component: SignatureRequest,
parameters: {
docs: {
@@ -35,6 +39,7 @@ DefaultStory.storyName = 'Default';
DefaultStory.args = {
txData: {
+ chainId: CHAIN_ID_MOCK,
msgParams: {
from: '0xb19ac54efa18cc3a14a5b821bfec73d284bf0c5e',
data: JSON.stringify({
@@ -82,6 +87,7 @@ AccountMismatchStory.storyName = 'AccountMismatch';
AccountMismatchStory.args = {
...DefaultStory.args,
txData: {
+ chainId: CHAIN_ID_MOCK,
msgParams: {
...DefaultStory.args.txData.msgParams,
from: '0x64a845a5b02460acf8a3d84503b0d68d028b4bb4',
diff --git a/ui/pages/confirmations/components/signature-request/signature-request.test.js b/ui/pages/confirmations/components/signature-request/signature-request.test.js
index 9851cdbef454..2e10381c40cb 100644
--- a/ui/pages/confirmations/components/signature-request/signature-request.test.js
+++ b/ui/pages/confirmations/components/signature-request/signature-request.test.js
@@ -1,35 +1,25 @@
import React from 'react';
-import { useSelector } from 'react-redux';
import { fireEvent } from '@testing-library/react';
import configureMockStore from 'redux-mock-store';
import { EthAccountType } from '@metamask/keyring-api';
import mockState from '../../../../../test/data/mock-state.json';
import { renderWithProvider } from '../../../../../test/lib/render-helpers';
import { SECURITY_PROVIDER_MESSAGE_SEVERITY } from '../../../../../shared/constants/security-provider';
-import {
- getNativeCurrency,
- getProviderConfig,
-} from '../../../../ducks/metamask/metamask';
-import {
- accountsWithSendEtherInfoSelector,
- conversionRateSelector,
- getCurrentCurrency,
- getMemoizedAddressBook,
- getPreferences,
- getSelectedAccount,
- getTotalUnapprovedMessagesCount,
- getInternalAccounts,
- unconfirmedTransactionsHashSelector,
- getAccountType,
- getMemoizedMetaMaskInternalAccounts,
- getSelectedInternalAccount,
- pendingApprovalsSortedSelector,
- getNetworkConfigurationsByChainId,
-} from '../../../../selectors';
import { ETH_EOA_METHODS } from '../../../../../shared/constants/eth-methods';
import { mockNetworkState } from '../../../../../test/stub/networks';
import SignatureRequest from './signature-request';
+jest.mock('react-redux', () => ({
+ ...jest.requireActual('react-redux'),
+ useDispatch: () => jest.fn(),
+}));
+
+const CHAIN_ID_MOCK = '0x539';
+
+const TRANSACTION_DATA_MOCK = {
+ chainId: CHAIN_ID_MOCK,
+};
+
const baseProps = {
clearConfirmTransaction: () => jest.fn(),
cancel: () => jest.fn(),
@@ -37,8 +27,11 @@ const baseProps = {
showRejectTransactionsConfirmationModal: () => jest.fn(),
sign: () => jest.fn(),
};
+
const mockStore = {
+ ...mockState,
metamask: {
+ ...mockState.metamask,
...mockNetworkState({
chainId: '0x539',
nickname: 'Localhost 8545',
@@ -61,12 +54,13 @@ const mockStore = {
metadata: {
name: 'John Doe',
keyring: {
- type: 'HD Key Tree',
+ type: 'Custody',
},
},
options: {},
methods: ETH_EOA_METHODS,
type: EthAccountType.Eoa,
+ balance: 0,
},
},
selectedAccount: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
@@ -94,15 +88,6 @@ const mockStore = {
},
},
};
-jest.mock('react-redux', () => {
- const actual = jest.requireActual('react-redux');
-
- return {
- ...actual,
- useSelector: jest.fn(),
- useDispatch: () => jest.fn(),
- };
-});
const mockCustodySignFn = jest.fn();
@@ -114,62 +99,13 @@ jest.mock('../../../../hooks/useMMICustodySignMessage', () => ({
jest.mock('@metamask-institutional/extension');
-const generateUseSelectorRouter = (opts) => (selector) => {
- const mockSelectedInternalAccount = getSelectedInternalAccount(opts);
-
- switch (selector) {
- case getProviderConfig:
- return getProviderConfig(opts);
- case getCurrentCurrency:
- return opts.metamask.currentCurrency;
- case getNativeCurrency:
- return getProviderConfig(opts).ticker;
- case getTotalUnapprovedMessagesCount:
- return opts.metamask.unapprovedTypedMessagesCount;
- case getPreferences:
- return opts.metamask.preferences;
- case conversionRateSelector:
- return opts.metamask.currencyRates[getProviderConfig(opts).ticker]
- ?.conversionRate;
- case getSelectedAccount:
- return mockSelectedInternalAccount;
- case getInternalAccounts:
- return Object.values(opts.metamask.internalAccounts.accounts);
- case getMemoizedMetaMaskInternalAccounts:
- return Object.values(opts.metamask.internalAccounts.accounts);
- case getMemoizedAddressBook:
- return [];
- case accountsWithSendEtherInfoSelector:
- return Object.values(opts.metamask.internalAccounts.accounts).map(
- (internalAccount) => {
- return {
- ...internalAccount,
- ...(opts.metamask.accounts[internalAccount.address] ?? {}),
- balance:
- opts.metamask.accounts[internalAccount.address]?.balance ?? 0,
- };
- },
- );
- case getAccountType:
- return 'custody';
- case unconfirmedTransactionsHashSelector:
- return {};
- case pendingApprovalsSortedSelector:
- return Object.values(opts.metamask.pendingApprovals);
- case getNetworkConfigurationsByChainId:
- return opts.metamask.networkConfigurationsByChainId;
- default:
- return undefined;
- }
-};
describe('Signature Request Component', () => {
- const store = configureMockStore()(mockState);
+ const store = configureMockStore()(mockStore);
describe('render', () => {
let messageData;
beforeEach(() => {
- useSelector.mockImplementation(generateUseSelectorRouter(mockStore));
messageData = {
domain: {
chainId: 97,
@@ -219,35 +155,39 @@ describe('Signature Request Component', () => {
});
it('should match snapshot when we want to switch to fiat', () => {
- useSelector.mockImplementation(
- generateUseSelectorRouter({
- ...mockStore,
- metamask: {
- ...mockStore.metamask,
- currencyRates: {
- ...mockStore.metamask.currencyRates,
- ETH: {
- ...(mockStore.metamask.currencyRates.ETH || {}),
- conversionRate: 231.06,
- },
+ const storeOverride = configureMockStore()({
+ ...mockStore,
+ metamask: {
+ ...mockStore.metamask,
+ ...mockNetworkState({
+ chainId: CHAIN_ID_MOCK,
+ }),
+ currencyRates: {
+ ...mockStore.metamask.currencyRates,
+ ETH: {
+ ...(mockStore.metamask.currencyRates.ETH || {}),
+ conversionRate: 231.06,
},
},
- }),
- );
+ },
+ });
+
const msgParams = {
from: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
data: JSON.stringify(messageData),
version: 'V4',
origin: 'test',
};
+
const { container } = renderWithProvider(
,
- store,
+ storeOverride,
);
expect(container).toMatchSnapshot();
@@ -260,10 +200,12 @@ describe('Signature Request Component', () => {
version: 'V4',
origin: 'test',
};
+
const { container } = renderWithProvider(
,
@@ -280,10 +222,12 @@ describe('Signature Request Component', () => {
version: 'V4',
origin: 'test',
};
+
const { queryByTestId } = renderWithProvider(
,
@@ -308,6 +252,7 @@ describe('Signature Request Component', () => {
,
@@ -321,29 +266,30 @@ describe('Signature Request Component', () => {
});
it('should not render a reject multiple requests link if there is not multiple requests', () => {
- useSelector.mockImplementation(
- generateUseSelectorRouter({
- ...mockStore,
- metamask: {
- ...mockStore.metamask,
- unapprovedTypedMessagesCount: 0,
- },
- }),
- );
+ const storeOverride = configureMockStore()({
+ ...mockStore,
+ metamask: {
+ ...mockStore.metamask,
+ unapprovedTypedMessagesCount: 0,
+ },
+ });
+
const msgParams = {
from: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
data: JSON.stringify(messageData),
version: 'V4',
origin: 'test',
};
+
const { container } = renderWithProvider(
,
- store,
+ storeOverride,
);
expect(
@@ -358,10 +304,12 @@ describe('Signature Request Component', () => {
version: 'V4',
origin: 'test',
};
+
const { container } = renderWithProvider(
,
@@ -384,6 +332,7 @@ describe('Signature Request Component', () => {
,
@@ -408,6 +357,7 @@ describe('Signature Request Component', () => {
,
@@ -429,6 +379,7 @@ describe('Signature Request Component', () => {
{
{
});
it('should render a warning when the selected account is not the one being used to sign', () => {
- const msgParams = {
- from: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
- data: JSON.stringify(messageData),
- version: 'V4',
- origin: 'test',
- };
-
- useSelector.mockImplementation(
- generateUseSelectorRouter({
- ...mockStore,
- metamask: {
- ...mockStore.metamask,
+ const storeOverride = configureMockStore()({
+ ...mockStore,
+ metamask: {
+ ...mockStore.metamask,
+ accounts: {
+ ...mockStore.metamask.accounts,
+ '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc': {
+ address: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc',
+ balance: '0x0',
+ name: 'Account 1',
+ },
+ '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5': {
+ address: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
+ balance: '0x0',
+ name: 'Account 2',
+ },
+ },
+ internalAccounts: {
accounts: {
- ...mockStore.metamask.accounts,
- '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc': {
+ 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1': {
address: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc',
- balance: '0x0',
- name: 'Account 1',
- },
- '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5': {
- address: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
- balance: '0x0',
- name: 'Account 2',
- },
- },
- internalAccounts: {
- accounts: {
- 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1': {
- address: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc',
- id: 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1',
- metadata: {
- name: 'Account 1',
- keyring: {
- type: 'HD Key Tree',
- },
+ id: 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1',
+ metadata: {
+ name: 'Account 1',
+ keyring: {
+ type: 'HD Key Tree',
},
- options: {},
- methods: ETH_EOA_METHODS,
- type: EthAccountType.Eoa,
},
- 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3': {
- address: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
- id: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
- metadata: {
- name: 'Account 2',
- keyring: {
- type: 'HD Key Tree',
- },
+ options: {},
+ methods: ETH_EOA_METHODS,
+ type: EthAccountType.Eoa,
+ },
+ 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3': {
+ address: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
+ id: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
+ metadata: {
+ name: 'Account 2',
+ keyring: {
+ type: 'HD Key Tree',
},
- options: {},
- methods: ETH_EOA_METHODS,
- type: EthAccountType.Eoa,
},
+ options: {},
+ methods: ETH_EOA_METHODS,
+ type: EthAccountType.Eoa,
},
- selectedAccount: 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1',
},
+ selectedAccount: 'b7e813d6-e31c-4bad-8615-8d4eff9f44f1',
},
- }),
- );
+ },
+ });
+
+ const msgParams = {
+ from: '0xd8f6a2ffb0fc5952d16c9768b71cfd35b6399aa5',
+ data: JSON.stringify(messageData),
+ version: 'V4',
+ origin: 'test',
+ };
const { container } = renderWithProvider(
,
- store,
+ storeOverride,
);
expect(
@@ -571,6 +522,7 @@ describe('Signature Request Component', () => {
{...baseProps}
conversionRate={null}
txData={{
+ ...TRANSACTION_DATA_MOCK,
msgParams,
securityAlertResponse: {
resultType: 'Malicious',
@@ -602,6 +554,7 @@ describe('Signature Request Component', () => {
,
@@ -610,7 +563,9 @@ describe('Signature Request Component', () => {
const rejectRequestsLink = getByTestId('page-container-footer-next');
fireEvent.click(rejectRequestsLink);
- expect(mockCustodySignFn).toHaveBeenCalledWith({ msgParams });
+ expect(mockCustodySignFn).toHaveBeenCalledWith(
+ expect.objectContaining({ msgParams }),
+ );
});
});
});
diff --git a/ui/pages/confirmations/confirm-signature-request/index.test.js b/ui/pages/confirmations/confirm-signature-request/index.test.js
index e0c7c7c8bbeb..f634bf40845c 100644
--- a/ui/pages/confirmations/confirm-signature-request/index.test.js
+++ b/ui/pages/confirmations/confirm-signature-request/index.test.js
@@ -7,13 +7,21 @@ import { CHAIN_IDS } from '../../../../shared/constants/network';
import { mockNetworkState } from '../../../../test/stub/networks';
import ConfTx from '.';
+const CHAIN_ID_MOCK = CHAIN_IDS.GOERLI;
+
const mockState = {
metamask: {
+ ...mockNetworkState({
+ chainId: CHAIN_IDS.GOERLI,
+ nickname: 'Goerli test network',
+ ticker: undefined,
+ }),
unapprovedPersonalMsgs: {},
unapprovedPersonalMsgCount: 0,
unapprovedTypedMessages: {
267460284130106: {
id: 267460284130106,
+ chainId: CHAIN_ID_MOCK,
msgParams: {
data: '{"domain":{"chainId":"5","name":"Ether Mail","verifyingContract":"0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC","version":"1"},"message":{"contents":"Hello, Bob!","from":{"name":"Cow","wallets":["0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826","0xDeaDbeefdEAdbeefdEadbEEFdeadbeEFdEaDbeeF"]},"to":[{"name":"Bob","wallets":["0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB","0xB0BdaBea57B0BDABeA57b0bdABEA57b0BDabEa57","0xB0B0b0b0b0b0B000000000000000000000000000"]}]},"primaryType":"Mail","types":{"EIP712Domain":[{"name":"name","type":"string"},{"name":"version","type":"string"},{"name":"chainId","type":"uint256"},{"name":"verifyingContract","type":"address"}],"Group":[{"name":"name","type":"string"},{"name":"members","type":"Person[]"}],"Mail":[{"name":"from","type":"Person"},{"name":"to","type":"Person[]"},{"name":"contents","type":"string"}],"Person":[{"name":"name","type":"string"},{"name":"wallets","type":"address[]"}]}}',
from: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc',
@@ -27,11 +35,6 @@ const mockState = {
},
},
unapprovedTypedMessagesCount: 1,
- ...mockNetworkState({
- chainId: CHAIN_IDS.GOERLI,
- nickname: 'Goerli test network',
- ticker: undefined,
- }),
currencyRates: {},
keyrings: [],
subjectMetadata: {},
diff --git a/ui/pages/confirmations/hooks/alerts/useBlockaidAlerts.ts b/ui/pages/confirmations/hooks/alerts/useBlockaidAlerts.ts
index 1b6412d66614..2f26fcefbee9 100644
--- a/ui/pages/confirmations/hooks/alerts/useBlockaidAlerts.ts
+++ b/ui/pages/confirmations/hooks/alerts/useBlockaidAlerts.ts
@@ -15,7 +15,6 @@ import {
import { Alert } from '../../../../ducks/confirm-alerts/confirm-alerts';
import ZENDESK_URLS from '../../../../helpers/constants/zendesk-url';
import { useI18nContext } from '../../../../hooks/useI18nContext';
-import { getCurrentChainId } from '../../../../selectors';
import {
SIGNATURE_TRANSACTION_TYPES,
REDESIGN_DEV_TRANSACTION_TYPES,
@@ -51,7 +50,6 @@ type SecurityAlertResponsesState = {
const useBlockaidAlerts = (): Alert[] => {
const t = useI18nContext();
const { currentConfirmation } = useConfirmContext();
- const selectorChainId = useSelector(getCurrentChainId);
const securityAlertId = (
currentConfirmation?.securityAlertResponse as SecurityAlertResponse
@@ -99,9 +97,7 @@ const useBlockaidAlerts = (): Alert[] => {
const reportData = {
blockNumber: block,
blockaidVersion: BlockaidPackage.version,
- chain: (NETWORK_TO_NAME_MAP as Record)[
- chainId ?? selectorChainId
- ],
+ chain: (NETWORK_TO_NAME_MAP as Record)[chainId],
classification: isFailedResultType ? 'error' : reason,
domain: origin ?? msgParams?.origin ?? origin,
jsonRpcMethod: type,
diff --git a/ui/pages/confirmations/hooks/useConfirmationNetworkInfo.ts b/ui/pages/confirmations/hooks/useConfirmationNetworkInfo.ts
index 4c6dddfa7a5a..f0463287ef34 100644
--- a/ui/pages/confirmations/hooks/useConfirmationNetworkInfo.ts
+++ b/ui/pages/confirmations/hooks/useConfirmationNetworkInfo.ts
@@ -6,30 +6,23 @@ import {
NETWORK_TO_NAME_MAP,
} from '../../../../shared/constants/network';
-import {
- getCurrentChainId,
- getNetworkConfigurationsByChainId,
-} from '../../../selectors';
-
import { useI18nContext } from '../../../hooks/useI18nContext';
import { useConfirmContext } from '../context/confirm';
+import { selectNetworkConfigurationByChainId } from '../../../selectors';
function useConfirmationNetworkInfo() {
const t = useI18nContext();
const { currentConfirmation } = useConfirmContext();
- const networkConfigurations = useSelector(getNetworkConfigurationsByChainId);
- const currentChainId = useSelector(getCurrentChainId);
+ const chainId = currentConfirmation?.chainId as Hex;
+
+ const networkConfiguration = useSelector((state) =>
+ selectNetworkConfigurationByChainId(state, chainId),
+ );
let networkDisplayName = '';
let networkImageUrl = '';
if (currentConfirmation) {
- // use the current confirmation chainId, else use the current network chainId
- const chainId =
- (currentConfirmation?.chainId as Hex | undefined) ?? currentChainId;
-
- const networkConfiguration = networkConfigurations[chainId];
-
networkDisplayName =
networkConfiguration?.name ??
NETWORK_TO_NAME_MAP[chainId as keyof typeof NETWORK_TO_NAME_MAP] ??
diff --git a/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.test.ts b/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.test.ts
index dff0103fbe21..9c98432918e2 100644
--- a/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.test.ts
+++ b/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.test.ts
@@ -1,6 +1,7 @@
import { renderHook } from '@testing-library/react-hooks';
import { useContext } from 'react';
+import { CHAIN_IDS } from '@metamask/transaction-controller';
import { TokenStandard } from '../../../../shared/constants/transaction';
import { MetaMetricsContext } from '../../../contexts/metametrics';
import { TokenDetailsERC20 } from '../utils/token';
@@ -30,7 +31,7 @@ describe('useTrackERC20WithoutDecimalInformation', () => {
});
renderHook(() =>
- useTrackERC20WithoutDecimalInformation('0x5', {
+ useTrackERC20WithoutDecimalInformation(CHAIN_IDS.MAINNET, '0x5', {
standard: TokenStandard.ERC20,
} as TokenDetailsERC20),
);
diff --git a/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.ts b/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.ts
index fa6a5e620fc4..266048e11134 100644
--- a/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.ts
+++ b/ui/pages/confirmations/hooks/useTrackERC20WithoutDecimalInformation.ts
@@ -1,4 +1,3 @@
-import { useSelector } from 'react-redux';
import { useContext, useEffect } from 'react';
import { Hex } from '@metamask/utils';
@@ -10,23 +9,23 @@ import {
} from '../../../../shared/constants/metametrics';
import { TokenStandard } from '../../../../shared/constants/transaction';
import { MetaMetricsContext } from '../../../contexts/metametrics';
-import { getCurrentChainId } from '../../../selectors';
import { parseTokenDetailDecimals, TokenDetailsERC20 } from '../utils/token';
/**
* Track event that number of decimals in ERC20 is not obtained
*
+ * @param chainId
* @param tokenAddress
* @param tokenDetails
* @param metricLocation
*/
const useTrackERC20WithoutDecimalInformation = (
+ chainId: Hex,
tokenAddress: Hex | string | undefined,
tokenDetails?: TokenDetailsERC20,
metricLocation = MetaMetricsEventLocation.SignatureConfirmation,
) => {
const trackEvent = useContext(MetaMetricsContext);
- const chainId = useSelector(getCurrentChainId);
useEffect(() => {
if (chainId === undefined || tokenDetails === undefined) {
diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js
index ac8a6394bf6b..5f1557700bc0 100644
--- a/ui/selectors/selectors.js
+++ b/ui/selectors/selectors.js
@@ -704,6 +704,28 @@ export const getNetworkConfigurationsByChainId = createDeepEqualSelector(
(networkConfigurationsByChainId) => networkConfigurationsByChainId,
);
+/**
+ * @type (state: any, chainId: string) => import('@metamask/network-controller').NetworkConfiguration
+ */
+export const selectNetworkConfigurationByChainId = createSelector(
+ getNetworkConfigurationsByChainId,
+ (_state, chainId) => chainId,
+ (networkConfigurationsByChainId, chainId) =>
+ networkConfigurationsByChainId[chainId],
+);
+
+export const selectDefaultRpcEndpointByChainId = createSelector(
+ selectNetworkConfigurationByChainId,
+ (networkConfiguration) => {
+ if (!networkConfiguration) {
+ return undefined;
+ }
+
+ const { defaultRpcEndpointIndex, rpcEndpoints } = networkConfiguration;
+ return rpcEndpoints[defaultRpcEndpointIndex];
+ },
+);
+
export function getRequestingNetworkInfo(state, chainIds) {
// If chainIds is undefined, set it to an empty array
let processedChainIds = chainIds === undefined ? [] : chainIds;