diff --git a/ui/components/app/assets/token-cell/token-cell.test.tsx b/ui/components/app/assets/token-cell/token-cell.test.tsx index f6fd5732cb04..5d23438bd6c7 100644 --- a/ui/components/app/assets/token-cell/token-cell.test.tsx +++ b/ui/components/app/assets/token-cell/token-cell.test.tsx @@ -12,7 +12,7 @@ import { getPreferences, getCurrencyRates, getUseCurrencyRateCheck, - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, getEnabledNetworksByNamespace, } from '../../../../selectors'; import { @@ -193,7 +193,7 @@ describe('Token Cell', () => { if (selector === getUseCurrencyRateCheck) { return true; } - if (selector === useSafeChainsListValidationSelector) { + if (selector === getUseSafeChainsListValidation) { return true; } if (selector === getEnabledNetworksByNamespace) { diff --git a/ui/components/app/assets/token-list/token-list.tsx b/ui/components/app/assets/token-list/token-list.tsx index 76f0f8db63fc..5bd870afabcb 100644 --- a/ui/components/app/assets/token-list/token-list.tsx +++ b/ui/components/app/assets/token-list/token-list.tsx @@ -130,8 +130,6 @@ function TokenList({ onTokenClick, safeChains }: TokenListProps) { ); return accountAssets; - - // eslint-disable-next-line react-hooks/exhaustive-deps }, [ isEvm, evmBalances, diff --git a/ui/components/app/currency-input/currency-input.js b/ui/components/app/currency-input/currency-input.js index 35696921912c..c12ddce40140 100644 --- a/ui/components/app/currency-input/currency-input.js +++ b/ui/components/app/currency-input/currency-input.js @@ -164,7 +164,6 @@ export default function CurrencyInput({ ); // tokenDecimalValue does not need to be in here, since this side effect is only for upstream updates - // eslint-disable-next-line react-hooks/exhaustive-deps }, [ hexValue, asset?.address, diff --git a/ui/components/app/modals/qr-scanner/qr-scanner.component.js b/ui/components/app/modals/qr-scanner/qr-scanner.component.js index 51ae5a89a6ef..32f04dd5b3fd 100644 --- a/ui/components/app/modals/qr-scanner/qr-scanner.component.js +++ b/ui/components/app/modals/qr-scanner/qr-scanner.component.js @@ -179,7 +179,6 @@ export default function QRCodeScanner({ hideModal, qrCodeDetected }) { await checkEnvironment(); })(); // only renders when component is mounted and unmounted - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { diff --git a/ui/components/app/qr-hardware-popover/enhanced-reader.js b/ui/components/app/qr-hardware-popover/enhanced-reader.js index 2c58a7263beb..340983a4e011 100644 --- a/ui/components/app/qr-hardware-popover/enhanced-reader.js +++ b/ui/components/app/qr-hardware-popover/enhanced-reader.js @@ -42,7 +42,6 @@ const EnhancedReader = ({ handleScan }) => { }) .catch(log.info); }; - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/ui/components/app/qr-hardware-popover/qr-hardware-popover.js b/ui/components/app/qr-hardware-popover/qr-hardware-popover.js index 5779a3740f72..21506313777f 100644 --- a/ui/components/app/qr-hardware-popover/qr-hardware-popover.js +++ b/ui/components/app/qr-hardware-popover/qr-hardware-popover.js @@ -27,7 +27,6 @@ const QRHardwarePopover = () => { // we want to block the changing by sign request id; const _txData = useMemo(() => { return txData; - // eslint-disable-next-line react-hooks/exhaustive-deps }, [activeScanRequest?.requestId]); const dispatch = useDispatch(); diff --git a/ui/components/app/terms-of-use-popup/terms-of-use-popup.js b/ui/components/app/terms-of-use-popup/terms-of-use-popup.js index 4b27cd507d4e..7adc9719e661 100644 --- a/ui/components/app/terms-of-use-popup/terms-of-use-popup.js +++ b/ui/components/app/terms-of-use-popup/terms-of-use-popup.js @@ -92,7 +92,6 @@ export default function TermsOfUsePopup({ onClose, onAccept }) { location: 'Terms Of Use Popover', }, }); - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/ui/components/multichain/account-list-item-menu/account-list-item-menu.js b/ui/components/multichain/account-list-item-menu/account-list-item-menu.js index 01899176b97c..94d6db12ed47 100644 --- a/ui/components/multichain/account-list-item-menu/account-list-item-menu.js +++ b/ui/components/multichain/account-list-item-menu/account-list-item-menu.js @@ -83,7 +83,6 @@ export const AccountListItemMenu = ({ } else { lastItemRef.current = accountDetailsItemRef.current; } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [ removeJWTItemRef.current, removeAccountItemRef.current, diff --git a/ui/components/multichain/account-picker/account-picker.js b/ui/components/multichain/account-picker/account-picker.js index 7cf8761b97e3..112826011905 100644 --- a/ui/components/multichain/account-picker/account-picker.js +++ b/ui/components/multichain/account-picker/account-picker.js @@ -43,9 +43,6 @@ export const AccountPicker = ({ showAvatarAccount = true, ...props }) => { - AccountPicker.propTypes = { - showAvatarAccount: PropTypes.bool, - }; const shortenedAddress = address ? shortenAddress(toChecksumHexAddress(address)) : ''; @@ -188,4 +185,8 @@ AccountPicker.propTypes = { * Additional className to be added to the AccountPicker */ className: PropTypes.string, + /** + * Represents if the avatar account should display + */ + showAvatarAccount: PropTypes.bool, }; diff --git a/ui/components/multichain/notification-detail-network-fee/notification-detail-network-fee.tsx b/ui/components/multichain/notification-detail-network-fee/notification-detail-network-fee.tsx index d4ba1250c3d9..21972172e92c 100644 --- a/ui/components/multichain/notification-detail-network-fee/notification-detail-network-fee.tsx +++ b/ui/components/multichain/notification-detail-network-fee/notification-detail-network-fee.tsx @@ -1,6 +1,6 @@ import React, { useContext, useState, useEffect } from 'react'; import type { FC } from 'react'; -import type { NotificationServicesController } from '@metamask/notification-services-controller'; +import type { OnChainRawNotificationsWithNetworkFields } from '@metamask/notification-services-controller/notification-services'; import { useI18nContext } from '../../../hooks/useI18nContext'; import { MetaMetricsContext } from '../../../contexts/metametrics'; @@ -36,9 +36,6 @@ import { } from '../../../helpers/constants/design-system'; import Preloader from '../../ui/icon/preloader/preloader-icon.component'; -type OnChainRawNotificationsWithNetworkFields = - NotificationServicesController.Types.OnChainRawNotificationsWithNetworkFields; - type NetworkFees = { transactionFee: { transactionFeeInEther: string; @@ -86,8 +83,8 @@ const FeeDetail = ({ label, value }: { label: string; value: string }) => ( * @deprecated - we are planning to remove this component * @returns The NotificationDetailNetworkFee component. */ -// eslint-disable-next-line @typescript-eslint/no-unused-vars -const _NotificationDetailNetworkFee: FC = ({ +// eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/naming-convention +const NotificationDetailNetworkFee_: FC = ({ notification, }) => { const t = useI18nContext(); @@ -105,7 +102,9 @@ const _NotificationDetailNetworkFee: FC = ({ useEffect(() => { const fetchNetworkFees = async () => { try { - const networkFeesData = await getNetworkFees(notification); + const networkFeesData = await getNetworkFees( + notification as Parameters[0], + ); if (networkFeesData) { setNetworkFees({ transactionFee: { @@ -124,7 +123,7 @@ const _NotificationDetailNetworkFee: FC = ({ } }; fetchNetworkFees(); - }, []); + }, [notification]); const handleClick = () => { if (!isOpen) { diff --git a/ui/components/multichain/pages/send/send.js b/ui/components/multichain/pages/send/send.js index 6a10f881989a..85e0ba458928 100644 --- a/ui/components/multichain/pages/send/send.js +++ b/ui/components/multichain/pages/send/send.js @@ -276,7 +276,6 @@ export const SendPage = () => { ); } // sendAnalytics should not result in the event refiring - // eslint-disable-next-line react-hooks/exhaustive-deps }, [trackEvent, swapQuotesError]); const onSubmit = async (event) => { diff --git a/ui/ducks/swaps/swaps.js b/ui/ducks/swaps/swaps.js index facd6f4949fb..dc439ccbacd6 100644 --- a/ui/ducks/swaps/swaps.js +++ b/ui/ducks/swaps/swaps.js @@ -1505,13 +1505,11 @@ export function cancelSwapsSmartTransaction(uuid) { }; } -export const getIsEstimatedReturnLow = ({ usedQuote, rawNetworkFees }) => { +export const useGetIsEstimatedReturnLow = ({ usedQuote, rawNetworkFees }) => { const sourceTokenAmount = calcTokenAmount( usedQuote?.sourceAmount, usedQuote?.sourceTokenInfo?.decimals, ); - // Disabled because it's not a hook - // eslint-disable-next-line react-hooks/rules-of-hooks const sourceTokenFiatAmount = useTokenFiatAmount( usedQuote?.sourceTokenInfo?.address, sourceTokenAmount || 0, @@ -1528,7 +1526,6 @@ export const getIsEstimatedReturnLow = ({ usedQuote, rawNetworkFees }) => { usedQuote?.destinationTokenInfo?.decimals, ); // Disabled because it's not a hook - // eslint-disable-next-line react-hooks/rules-of-hooks const destinationTokenFiatAmount = useTokenFiatAmount( usedQuote?.destinationTokenInfo?.address, destinationTokenAmount || 0, diff --git a/ui/helpers/higher-order-components/initialized/initialized.component.js b/ui/helpers/higher-order-components/initialized/initialized.component.js index 6c2561da2893..7ab8ad60dc25 100644 --- a/ui/helpers/higher-order-components/initialized/initialized.component.js +++ b/ui/helpers/higher-order-components/initialized/initialized.component.js @@ -16,6 +16,6 @@ export default function Initialized(props) { Initialized.propTypes = { completedOnboarding: PropTypes.bool, path: PropTypes.string, - component: PropTypes.object, + component: PropTypes.func, exact: PropTypes.bool, }; diff --git a/ui/helpers/higher-order-components/with-router-hooks/with-router-hooks.tsx b/ui/helpers/higher-order-components/with-router-hooks/with-router-hooks.tsx index 48a23e49748a..ab37ff7c8bc6 100644 --- a/ui/helpers/higher-order-components/with-router-hooks/with-router-hooks.tsx +++ b/ui/helpers/higher-order-components/with-router-hooks/with-router-hooks.tsx @@ -15,7 +15,7 @@ export type RouterHooksProps = { function withRouterHooks( WrappedComponent: React.ComponentType, ): React.ComponentType { - const ComponentWithRouterHooks = (props: Props) => { + const useComponentWithRouterHooks = (props: Props) => { const navigate = useNavigate(); const location = useLocation(); const params = useParams(); @@ -31,11 +31,11 @@ function withRouterHooks( }; // Preserve component name for debugging - ComponentWithRouterHooks.displayName = `withRouterHooks(${ + useComponentWithRouterHooks.displayName = `withRouterHooks(${ WrappedComponent.displayName || WrappedComponent.name || 'Component' })`; - return ComponentWithRouterHooks; + return useComponentWithRouterHooks; } export default withRouterHooks; diff --git a/ui/hooks/gator-permissions/useGatorPermissions.ts b/ui/hooks/gator-permissions/useGatorPermissions.ts index 254112066d85..3bbcce4bdde9 100644 --- a/ui/hooks/gator-permissions/useGatorPermissions.ts +++ b/ui/hooks/gator-permissions/useGatorPermissions.ts @@ -116,7 +116,6 @@ export function useGatorPermissions( }; // Note: cachedData is intentionally excluded from dependencies to prevent infinite loop // when fetchAndUpdateGatorPermissions updates the Redux store - // eslint-disable-next-line react-hooks/exhaustive-deps }, [dispatch, refreshInBackground]); return { diff --git a/ui/hooks/useCurrencyRatePolling.ts b/ui/hooks/useCurrencyRatePolling.ts index 124f68429d08..ed0aa6428124 100644 --- a/ui/hooks/useCurrencyRatePolling.ts +++ b/ui/hooks/useCurrencyRatePolling.ts @@ -3,7 +3,7 @@ import { useSelector } from 'react-redux'; import { getChainIdsToPoll, getUseCurrencyRateCheck, - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, } from '../selectors'; import { getEnabledChainIds } from '../selectors/multichain/networks'; import { @@ -30,7 +30,7 @@ const usePollingEnabled = () => { const useNativeCurrencies = (isPollingEnabled: boolean) => { const networkConfigurations = useSelector(getNetworkConfigurationsByChainId); const useSafeChainsListValidation = useSelector( - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, ); const [nativeCurrencies, setNativeCurrencies] = useState([]); const chainIds = useSelector(getChainIdsToPoll); diff --git a/ui/hooks/useIsOriginalNativeTokenSymbol.test.ts b/ui/hooks/useIsOriginalNativeTokenSymbol.test.ts index 0d5f0102bd02..5d12650cc08e 100644 --- a/ui/hooks/useIsOriginalNativeTokenSymbol.test.ts +++ b/ui/hooks/useIsOriginalNativeTokenSymbol.test.ts @@ -8,8 +8,8 @@ import { useIsOriginalNativeTokenSymbol } from './useIsOriginalNativeTokenSymbol const arrangeMocks = () => { // Mock Selectors - const mockUseSafeChainsListValidationSelector = jest - .spyOn(SelectorsModule, 'useSafeChainsListValidationSelector') + const mockGetUseSafeChainsListValidation = jest + .spyOn(SelectorsModule, 'getUseSafeChainsListValidation') .mockReturnValue(true); const createMockProviderConfig = () => @@ -26,7 +26,7 @@ const arrangeMocks = () => { .mockResolvedValue(true); return { - mockUseSafeChainsListValidationSelector, + mockGetUseSafeChainsListValidation, createMockProviderConfig, mockGetMultichainCurrentNetwork, mockIsOriginalNativeTokenSymbol, diff --git a/ui/hooks/useIsOriginalNativeTokenSymbol.ts b/ui/hooks/useIsOriginalNativeTokenSymbol.ts index 747b26757f6f..3a85c209f914 100644 --- a/ui/hooks/useIsOriginalNativeTokenSymbol.ts +++ b/ui/hooks/useIsOriginalNativeTokenSymbol.ts @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; import { useSelector } from 'react-redux'; import { CaipChainId, Hex } from '@metamask/utils'; -import { useSafeChainsListValidationSelector } from '../selectors'; +import { getUseSafeChainsListValidation } from '../selectors'; import { getMultichainCurrentNetwork } from '../selectors/multichain'; import { isEvmChainId } from '../../shared/lib/asset-utils'; @@ -18,7 +18,7 @@ export function useIsOriginalNativeTokenSymbol( ) { const [isOriginalNativeSymbol, setIsOriginalNativeSymbol] = useState(false); const useSafeChainsListValidation = useSelector( - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, ); const isEvm = isEvmChainId(chainId); diff --git a/ui/hooks/useIsOriginalTokenSymbol.js b/ui/hooks/useIsOriginalTokenSymbol.js index 8b12c118bf95..e88b70b4268b 100644 --- a/ui/hooks/useIsOriginalTokenSymbol.js +++ b/ui/hooks/useIsOriginalTokenSymbol.js @@ -38,7 +38,6 @@ export function useIsOriginalTokenSymbol(tokenAddress, tokenSymbol) { getTokenSymbolForToken(tokenAddress); // no need to wait for tokens to load, since we'd fetch without them if they aren't available - // eslint-disable-next-line react-hooks/exhaustive-deps }, [tokenAddress, tokenSymbol]); return isOriginalNativeSymbol; diff --git a/ui/hooks/useName.test.ts b/ui/hooks/useName.test.ts index 5d9f7aca716b..4a8e98e660e7 100644 --- a/ui/hooks/useName.test.ts +++ b/ui/hooks/useName.test.ts @@ -1,3 +1,4 @@ +import { renderHook } from '@testing-library/react-hooks'; import { FALLBACK_VARIATION, NameControllerState, @@ -47,13 +48,15 @@ describe('useName', () => { it('returns default values if no state', () => { getNamesMock.mockReturnValue({} as NameControllerState['names']); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); - expect(nameEntry).toStrictEqual({ - name: null, - sourceId: null, - origin: null, - proposedNames: {}, + expect(nameEntry).toStrictEqual({ + name: null, + sourceId: null, + origin: null, + proposedNames: {}, + }); }); }); @@ -71,13 +74,15 @@ describe('useName', () => { }, }); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); - expect(nameEntry).toStrictEqual({ - name: null, - sourceId: null, - origin: null, - proposedNames: {}, + expect(nameEntry).toStrictEqual({ + name: null, + sourceId: null, + origin: null, + proposedNames: {}, + }); }); }); @@ -95,13 +100,15 @@ describe('useName', () => { }, }); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_MOCK); - expect(nameEntry).toStrictEqual({ - name: NAME_MOCK, - sourceId: SOURCE_ID_MOCK, - proposedNames: PROPOSED_NAMES_MOCK, - origin: ORIGIN_MOCK, + expect(nameEntry).toStrictEqual({ + name: NAME_MOCK, + sourceId: SOURCE_ID_MOCK, + proposedNames: PROPOSED_NAMES_MOCK, + origin: ORIGIN_MOCK, + }); }); }); @@ -119,13 +126,15 @@ describe('useName', () => { }, }); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); - expect(nameEntry).toStrictEqual({ - name: NAME_MOCK, - sourceId: SOURCE_ID_MOCK, - proposedNames: PROPOSED_NAMES_MOCK, - origin: ORIGIN_MOCK, + expect(nameEntry).toStrictEqual({ + name: NAME_MOCK, + sourceId: SOURCE_ID_MOCK, + proposedNames: PROPOSED_NAMES_MOCK, + origin: ORIGIN_MOCK, + }); }); }); @@ -144,13 +153,15 @@ describe('useName', () => { }, }); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); - expect(nameEntry).toStrictEqual({ - name: NAME_MOCK, - sourceId: SOURCE_ID_MOCK, - proposedNames: PROPOSED_NAMES_MOCK, - origin: ORIGIN_MOCK, + expect(nameEntry).toStrictEqual({ + name: NAME_MOCK, + sourceId: SOURCE_ID_MOCK, + proposedNames: PROPOSED_NAMES_MOCK, + origin: ORIGIN_MOCK, + }); }); }); @@ -174,13 +185,15 @@ describe('useName', () => { }, }); - const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); + renderHook(() => { + const nameEntry = useName(VALUE_MOCK, TYPE_MOCK, VARIATION_2_MOCK); - expect(nameEntry).toStrictEqual({ - name: NAME_MOCK, - proposedNames: {}, - sourceId: SOURCE_ID_MOCK, - origin: ORIGIN_MOCK, + expect(nameEntry).toStrictEqual({ + name: NAME_MOCK, + proposedNames: {}, + sourceId: SOURCE_ID_MOCK, + origin: ORIGIN_MOCK, + }); }); }); }); @@ -199,13 +212,15 @@ describe('useName', () => { }, }); - const nameEntry = useName('0xAbC123', TYPE_MOCK, VARIATION_MOCK); + renderHook(() => { + const nameEntry = useName('0xAbC123', TYPE_MOCK, VARIATION_MOCK); - expect(nameEntry).toStrictEqual({ - name: NAME_MOCK, - sourceId: SOURCE_ID_MOCK, - proposedNames: PROPOSED_NAMES_MOCK, - origin: ORIGIN_MOCK, + expect(nameEntry).toStrictEqual({ + name: NAME_MOCK, + sourceId: SOURCE_ID_MOCK, + proposedNames: PROPOSED_NAMES_MOCK, + origin: ORIGIN_MOCK, + }); }); }); }); diff --git a/ui/hooks/useOriginTrustSignals.test.ts b/ui/hooks/useOriginTrustSignals.test.ts index 953d74da73e6..a59068582024 100644 --- a/ui/hooks/useOriginTrustSignals.test.ts +++ b/ui/hooks/useOriginTrustSignals.test.ts @@ -1,3 +1,4 @@ +import { renderHook } from '@testing-library/react-hooks'; import { RecommendedAction } from '@metamask/phishing-controller'; import { getUrlScanCacheResult } from '../selectors/selectors'; import { TrustSignalDisplayState } from './useTrustSignals'; @@ -29,16 +30,18 @@ describe('useOriginTrustSignals', () => { it('returns unknown state when selector returns undefined', () => { getUrlScanCacheResultMock.mockReturnValue(undefined); - const result = useOriginTrustSignals(''); - - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + renderHook(() => { + const result = useOriginTrustSignals(''); + + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); + expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( + undefined, + undefined, + ); }); - expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( - undefined, - undefined, - ); }); it('returns malicious state when recommendedAction is Block', () => { @@ -50,16 +53,18 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); - - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: null, + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); + + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: null, + }); + expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( + undefined, + DOMAIN_NAME_MOCK, + ); }); - expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( - undefined, - DOMAIN_NAME_MOCK, - ); }); it('returns warning state when recommendedAction is Warn', () => { @@ -71,11 +76,13 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Warning, - label: null, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Warning, + label: null, + }); }); }); @@ -88,11 +95,13 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Verified, - label: null, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Verified, + label: null, + }); }); }); @@ -105,11 +114,13 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); @@ -122,11 +133,13 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); @@ -139,26 +152,30 @@ describe('useOriginTrustSignals', () => { timestamp: TIMESTAMP_MOCK, }); - const result = useOriginTrustSignals(ORIGIN_MOCK); + renderHook(() => { + const result = useOriginTrustSignals(ORIGIN_MOCK); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); it('returns unknown state when origin is invalid URL', () => { getUrlScanCacheResultMock.mockReturnValue(undefined); - const result = useOriginTrustSignals('not-a-valid-url'); - - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + renderHook(() => { + const result = useOriginTrustSignals('not-a-valid-url'); + + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); + expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( + undefined, + undefined, + ); }); - expect(getUrlScanCacheResultMock).toHaveBeenCalledWith( - undefined, - undefined, - ); }); }); diff --git a/ui/hooks/useTrustSignals.test.ts b/ui/hooks/useTrustSignals.test.ts index 82ecc0cab24a..ab9fec28c50a 100644 --- a/ui/hooks/useTrustSignals.test.ts +++ b/ui/hooks/useTrustSignals.test.ts @@ -1,3 +1,4 @@ +import { renderHook } from '@testing-library/react-hooks'; import { NameType } from '@metamask/name-controller'; import { getAddressSecurityAlertResponse } from '../selectors'; import { @@ -60,15 +61,17 @@ describe('useTrustSignals', () => { label: TRUST_LABEL_MOCK, }); - const result = useTrustSignal( - VALUE_MOCK, - NameType.ETHEREUM_ADDRESS, - '0x1', - ); + renderHook(() => { + const result = useTrustSignal( + VALUE_MOCK, + NameType.ETHEREUM_ADDRESS, + '0x1', + ); - expect(result).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: TRUST_LABEL_MOCK, + expect(result).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: TRUST_LABEL_MOCK, + }); }); }); }); @@ -91,18 +94,20 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: TRUST_LABEL_MOCK, - }); + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: TRUST_LABEL_MOCK, + }); - expect(getAddressSecurityAlertResponseMock).toHaveBeenCalledWith( - undefined, - `ethereum:${VALUE_MOCK.toLowerCase()}`, - ); + expect(getAddressSecurityAlertResponseMock).toHaveBeenCalledWith( + undefined, + `ethereum:${VALUE_MOCK.toLowerCase()}`, + ); + }); }); it('returns unknown state when no chain id is provided', () => { @@ -121,12 +126,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); @@ -146,12 +153,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Warning, - label: WARNING_LABEL_MOCK, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Warning, + label: WARNING_LABEL_MOCK, + }); }); }); @@ -171,12 +180,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Verified, - label: VERIFIED_LABEL_MOCK, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Verified, + label: VERIFIED_LABEL_MOCK, + }); }); }); @@ -196,12 +207,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: 'Benign Address', + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: 'Benign Address', + }); }); }); @@ -221,12 +234,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: 'Error occurred', + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: 'Error occurred', + }); }); }); @@ -243,12 +258,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: 'Some label', + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: 'Some label', + }); }); }); @@ -267,12 +284,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Verified, - label: null, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Verified, + label: null, + }); }); }); }); @@ -289,12 +308,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); @@ -309,12 +330,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Unknown, - label: null, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Unknown, + label: null, + }); }); }); @@ -334,12 +357,14 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(1); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Loading, - label: null, + expect(results).toHaveLength(1); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Loading, + label: null, + }); }); }); }); @@ -373,36 +398,40 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(2); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: TRUST_LABEL_MOCK, - }); - expect(results[1]).toStrictEqual({ - state: TrustSignalDisplayState.Verified, - label: VERIFIED_LABEL_MOCK, - }); + expect(results).toHaveLength(2); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: TRUST_LABEL_MOCK, + }); + expect(results[1]).toStrictEqual({ + state: TrustSignalDisplayState.Verified, + label: VERIFIED_LABEL_MOCK, + }); - expect(getAddressSecurityAlertResponseMock).toHaveBeenCalledTimes(2); - expect(getAddressSecurityAlertResponseMock).toHaveBeenNthCalledWith( - 1, - undefined, - `ethereum:${VALUE_MOCK.toLowerCase()}`, - ); - expect(getAddressSecurityAlertResponseMock).toHaveBeenNthCalledWith( - 2, - undefined, - `ethereum:${VALUE_MOCK_2.toLowerCase()}`, - ); + expect(getAddressSecurityAlertResponseMock).toHaveBeenCalledTimes(2); + expect(getAddressSecurityAlertResponseMock).toHaveBeenNthCalledWith( + 1, + undefined, + `ethereum:${VALUE_MOCK.toLowerCase()}`, + ); + expect(getAddressSecurityAlertResponseMock).toHaveBeenNthCalledWith( + 2, + undefined, + `ethereum:${VALUE_MOCK_2.toLowerCase()}`, + ); + }); }); it('handles empty requests array', () => { - const results = useTrustSignals([]); + renderHook(() => { + const results = useTrustSignals([]); - expect(results).toHaveLength(0); - expect(getAddressSecurityAlertResponseMock).not.toHaveBeenCalled(); + expect(results).toHaveLength(0); + expect(getAddressSecurityAlertResponseMock).not.toHaveBeenCalled(); + }); }); }); @@ -428,16 +457,18 @@ describe('useTrustSignals', () => { }, ]; - const results = useTrustSignals(requests); + renderHook(() => { + const results = useTrustSignals(requests); - expect(results).toHaveLength(2); - expect(results[0]).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: TRUST_LABEL_MOCK, - }); - expect(results[1]).toStrictEqual({ - state: TrustSignalDisplayState.Malicious, - label: TRUST_LABEL_MOCK, + expect(results).toHaveLength(2); + expect(results[0]).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: TRUST_LABEL_MOCK, + }); + expect(results[1]).toStrictEqual({ + state: TrustSignalDisplayState.Malicious, + label: TRUST_LABEL_MOCK, + }); }); }); }); diff --git a/ui/pages/bridge/awaiting-signatures/awaiting-signatures.tsx b/ui/pages/bridge/awaiting-signatures/awaiting-signatures.tsx index f968fb202b57..e6ef84a46274 100644 --- a/ui/pages/bridge/awaiting-signatures/awaiting-signatures.tsx +++ b/ui/pages/bridge/awaiting-signatures/awaiting-signatures.tsx @@ -79,7 +79,6 @@ export default function AwaitingSignatures() { token_to_amount: activeQuote?.quote?.destTokenAmount ?? '', }, }); - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const isSwap = diff --git a/ui/pages/bridge/prepare/prepare-bridge-page.tsx b/ui/pages/bridge/prepare/prepare-bridge-page.tsx index 6ef8d8bc8d8d..a8a64ad33dc9 100644 --- a/ui/pages/bridge/prepare/prepare-bridge-page.tsx +++ b/ui/pages/bridge/prepare/prepare-bridge-page.tsx @@ -414,16 +414,20 @@ const PrepareBridgePage = ({ ], ); - const debouncedUpdateQuoteRequestInController = useCallback( + // `useRef` is used here to manually memoize a function reference. + // `useCallback` and React Compiler don't understand that `debounce` returns an inline function reference. + // The function contains reactive dependencies, but they are `dispatch` and an action, + // making it safe not to worry about recreating this function on dependency updates. + const debouncedUpdateQuoteRequestInController = useRef( debounce((...args: Parameters) => { dispatch(updateQuoteRequestParams(...args)); }, 300), - [dispatch], ); useEffect(() => { return () => { - debouncedUpdateQuoteRequestInController.cancel(); + // This `ref` is safe from unintended mutations, because it points to a function reference, not any reactive node or element. + debouncedUpdateQuoteRequestInController.current.cancel(); }; }, []); @@ -448,8 +452,10 @@ const PrepareBridgePage = ({ Boolean, ) as string[], }; - debouncedUpdateQuoteRequestInController(quoteParams, eventProperties); - // eslint-disable-next-line react-hooks/exhaustive-deps + debouncedUpdateQuoteRequestInController.current( + quoteParams, + eventProperties, + ); }, [quoteParams]); // Use smart slippage defaults @@ -785,7 +791,7 @@ const PrepareBridgePage = ({ if (!quoteParams) { return; } - debouncedUpdateQuoteRequestInController(quoteParams, { + debouncedUpdateQuoteRequestInController.current(quoteParams, { // TODO: Fix in https://github.com/MetaMask/metamask-extension/issues/31860 // eslint-disable-next-line @typescript-eslint/naming-convention stx_enabled: smartTransactionsEnabled, diff --git a/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.js b/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.js index 581961844b2a..3183867afe54 100644 --- a/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.js +++ b/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.js @@ -179,7 +179,6 @@ const ConfirmAddSuggestedToken = () => { useEffect(() => { goBackIfNoSuggestedTokensOnFirstRender(); - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/ui/pages/confirmations/components/confirm/info/hooks/useDecodedTransactionData.ts b/ui/pages/confirmations/components/confirm/info/hooks/useDecodedTransactionData.ts index d824638c021d..53f4eec35d75 100644 --- a/ui/pages/confirmations/components/confirm/info/hooks/useDecodedTransactionData.ts +++ b/ui/pages/confirmations/components/confirm/info/hooks/useDecodedTransactionData.ts @@ -7,7 +7,7 @@ import { decodeTransactionData } from '../../../../../../store/actions'; import { DecodedTransactionDataResponse } from '../../../../../../../shared/types/transaction-decode'; import { useConfirmContext } from '../../../../context/confirm'; import { hasTransactionData } from '../../../../../../../shared/modules/transaction.utils'; -import { use4ByteResolutionSelector } from '../../../../../../selectors'; +import { getUse4ByteResolution } from '../../../../../../selectors'; export function useDecodedTransactionData({ data, @@ -19,7 +19,7 @@ export function useDecodedTransactionData({ transactionTypeFilter?: string; } = {}): AsyncResult { const { currentConfirmation } = useConfirmContext(); - const isDecodeEnabled = useSelector(use4ByteResolutionSelector); + const isDecodeEnabled = useSelector(getUse4ByteResolution); const currentTransactionType = currentConfirmation?.type; const chainId = currentConfirmation?.chainId as Hex; diff --git a/ui/pages/confirmations/components/confirm/info/hooks/useFourByte.ts b/ui/pages/confirmations/components/confirm/info/hooks/useFourByte.ts index 32f4a778f94d..a637460f5f50 100644 --- a/ui/pages/confirmations/components/confirm/info/hooks/useFourByte.ts +++ b/ui/pages/confirmations/components/confirm/info/hooks/useFourByte.ts @@ -3,14 +3,14 @@ import { useEffect } from 'react'; import { Hex } from '@metamask/utils'; import { getKnownMethodData, - use4ByteResolutionSelector, + getUse4ByteResolution, } from '../../../../../../selectors'; import { getContractMethodData } from '../../../../../../store/actions'; import { hasTransactionData } from '../../../../../../../shared/modules/transaction.utils'; export const useFourByte = ({ to, data }: { to?: Hex; data?: Hex }) => { const dispatch = useDispatch(); - const isFourByteEnabled = useSelector(use4ByteResolutionSelector); + const isFourByteEnabled = useSelector(getUse4ByteResolution); const transactionTo = to as Hex | undefined; const transactionData = data as Hex | undefined; diff --git a/ui/pages/confirmations/components/confirm/info/hooks/useNestedTransactionLabels.ts b/ui/pages/confirmations/components/confirm/info/hooks/useNestedTransactionLabels.ts index f04a5ca70b52..940b9936f896 100644 --- a/ui/pages/confirmations/components/confirm/info/hooks/useNestedTransactionLabels.ts +++ b/ui/pages/confirmations/components/confirm/info/hooks/useNestedTransactionLabels.ts @@ -15,7 +15,7 @@ export function useNestedTransactionLabels({ const { data, to } = nestedTransaction; // It's safe to call useFourByte here because the length of nestedTransactions // remains stable throughout the component's lifecycle. - // eslint-disable-next-line react-hooks/rules-of-hooks + // eslint-disable-next-line react-compiler/react-compiler, react-hooks/rules-of-hooks const methodData = useFourByte({ data, to }); const functionName = methodData?.name; diff --git a/ui/pages/confirmations/components/simulation-error-message/simulation-error-message.js b/ui/pages/confirmations/components/simulation-error-message/simulation-error-message.js index 0edd91ad42e0..a80bd4b6a159 100644 --- a/ui/pages/confirmations/components/simulation-error-message/simulation-error-message.js +++ b/ui/pages/confirmations/components/simulation-error-message/simulation-error-message.js @@ -29,7 +29,6 @@ export default function SimulationErrorMessage({ ], }, }); - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return userAcknowledgedGasMissing === true ? ( diff --git a/ui/pages/confirmations/confirm-transaction/confirm-transaction.component.js b/ui/pages/confirmations/confirm-transaction/confirm-transaction.component.js index aee6c3c6fddd..8d8874851bcd 100644 --- a/ui/pages/confirmations/confirm-transaction/confirm-transaction.component.js +++ b/ui/pages/confirmations/confirm-transaction/confirm-transaction.component.js @@ -26,7 +26,7 @@ import { usePrevious } from '../../../hooks/usePrevious'; import { unconfirmedTransactionsHashSelector, unconfirmedTransactionsListSelector, - use4ByteResolutionSelector, + getUse4ByteResolution, } from '../../../selectors'; import { endBackgroundTrace, @@ -71,7 +71,7 @@ const ConfirmTransaction = () => { unconfirmedTxsSorted, ]); const [transaction, setTransaction] = useState(getTransaction); - const use4ByteResolution = useSelector(use4ByteResolutionSelector); + const use4ByteResolution = useSelector(getUse4ByteResolution); const { currentConfirmation } = useCurrentConfirmation(); useEffect(() => { @@ -137,8 +137,6 @@ const ConfirmTransaction = () => { dispatch(setTransactionToConfirm(txId)); } } - - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { diff --git a/ui/pages/confirmations/confirmation/confirmation.js b/ui/pages/confirmations/confirmation/confirmation.js index 49fd9c0d7bac..d69f92668e98 100644 --- a/ui/pages/confirmations/confirmation/confirmation.js +++ b/ui/pages/confirmations/confirmation/confirmation.js @@ -34,7 +34,7 @@ import { getUnapprovedTxCount, getApprovalFlows, getTotalUnapprovedCount, - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, getSnapsMetadata, getHideSnapBranding, } from '../../../selectors'; @@ -237,7 +237,7 @@ export default function ConfirmationPage({ const approvalFlows = useSelector(getApprovalFlows, isEqual); const totalUnapprovedCount = useSelector(getTotalUnapprovedCount); const useSafeChainsListValidation = useSelector( - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, ); const networkConfigurationsByChainId = useSelector( getNetworkConfigurationsByChainId, diff --git a/ui/pages/notifications/notification-components/snap/snap-footer-button.tsx b/ui/pages/notifications/notification-components/snap/snap-footer-button.tsx index f8239d29529a..4cde9e0dc677 100644 --- a/ui/pages/notifications/notification-components/snap/snap-footer-button.tsx +++ b/ui/pages/notifications/notification-components/snap/snap-footer-button.tsx @@ -44,8 +44,8 @@ export const SnapFooterButton = (props: { notification: SnapNotification }) => { if (isExternal) { setIsOpen(true); } else { - // This hook is safe to include in this event handler, because its only reactive component is `useNavigate` - // eslint-disable-next-line react-hooks/rules-of-hooks + // This hook is safe to call in this event handler, because its only reactive component is `useNavigate` + // eslint-disable-next-line react-compiler/react-compiler, react-hooks/rules-of-hooks useSnapNavigate(href); } }, diff --git a/ui/pages/settings/networks-tab/networks-form/use-safe-chains.ts b/ui/pages/settings/networks-tab/networks-form/use-safe-chains.ts index af7c1d40c4ec..f78fc96c7c29 100644 --- a/ui/pages/settings/networks-tab/networks-form/use-safe-chains.ts +++ b/ui/pages/settings/networks-tab/networks-form/use-safe-chains.ts @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import { useSelector } from 'react-redux'; import { isStrictHexString } from '@metamask/utils'; -import { useSafeChainsListValidationSelector } from '../../../../selectors'; +import { getUseSafeChainsListValidation } from '../../../../selectors'; import fetchWithCache from '../../../../../shared/lib/fetch-with-cache'; import { CHAIN_SPEC_URL } from '../../../../../shared/constants/network'; import { DAY } from '../../../../../shared/constants/time'; @@ -17,7 +17,7 @@ export type SafeChain = { export const useSafeChains = () => { const useSafeChainsListValidation = useSelector( - useSafeChainsListValidationSelector, + getUseSafeChainsListValidation, ); const [safeChains, setSafeChains] = useState<{ diff --git a/ui/pages/swaps/awaiting-signatures/awaiting-signatures.js b/ui/pages/swaps/awaiting-signatures/awaiting-signatures.js index 56db1578ce9a..2bec399eb87c 100644 --- a/ui/pages/swaps/awaiting-signatures/awaiting-signatures.js +++ b/ui/pages/swaps/awaiting-signatures/awaiting-signatures.js @@ -75,7 +75,6 @@ export default function AwaitingSignatures() { stx_user_opt_in: smartTransactionsOptInStatus, }, }); - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const headerText = needsTwoConfirmations diff --git a/ui/pages/swaps/prepare-swap-page/prepare-swap-page.js b/ui/pages/swaps/prepare-swap-page/prepare-swap-page.js index b91b1d0ad48b..bae141736a15 100644 --- a/ui/pages/swaps/prepare-swap-page/prepare-swap-page.js +++ b/ui/pages/swaps/prepare-swap-page/prepare-swap-page.js @@ -561,7 +561,6 @@ export default function PrepareSwapPage({ if (!fromToken?.symbol && !fetchParamsFromToken?.symbol) { dispatch(setSwapsFromToken(defaultSwapsToken)); } - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { @@ -767,7 +766,6 @@ export default function PrepareSwapPage({ if (fromToken?.address && !selectedToToken?.address && defaultToToken) { dispatch(setSwapToToken(defaultToToken)); } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [fromToken?.address]); const onOpenImportTokenModalClick = (item) => { diff --git a/ui/pages/swaps/prepare-swap-page/review-quote.js b/ui/pages/swaps/prepare-swap-page/review-quote.js index d887460b2be2..5835d66409c6 100644 --- a/ui/pages/swaps/prepare-swap-page/review-quote.js +++ b/ui/pages/swaps/prepare-swap-page/review-quote.js @@ -44,7 +44,7 @@ import { fetchSwapsSmartTransactionFees, getSmartTransactionFees, getCurrentSmartTransactionsEnabled, - getIsEstimatedReturnLow, + useGetIsEstimatedReturnLow, } from '../../../ducks/swaps/swaps'; import { getCurrentChainId } from '../../../../shared/modules/selectors/networks'; import { @@ -1133,7 +1133,7 @@ export default function ReviewQuote({ currentCurrency, ]); - const isEstimatedReturnLow = getIsEstimatedReturnLow({ + const isEstimatedReturnLow = useGetIsEstimatedReturnLow({ usedQuote, rawNetworkFees, }); diff --git a/ui/selectors/confirm-transaction.js b/ui/selectors/confirm-transaction.js index 5f0f891fb15d..72e240ca15d2 100644 --- a/ui/selectors/confirm-transaction.js +++ b/ui/selectors/confirm-transaction.js @@ -104,7 +104,7 @@ export const unconfirmedMessagesHashSelector = createSelector( }; }, ); -export const use4ByteResolutionSelector = (state) => +export const getUse4ByteResolution = (state) => state.metamask.use4ByteResolution; export const currentCurrencySelector = (state) => state.metamask.currentCurrency; diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js index be9f3c2a8a30..103f2e0f97e5 100644 --- a/ui/selectors/selectors.js +++ b/ui/selectors/selectors.js @@ -3450,7 +3450,7 @@ export const getUpdatedAndSortedAccountsWithCaipAccountId = }); }); -export const useSafeChainsListValidationSelector = (state) => { +export const getUseSafeChainsListValidation = (state) => { return state.metamask.useSafeChainsListValidation; }; diff --git a/ui/store/background-connection.ts b/ui/store/background-connection.ts index 06565769c141..74297b18c6df 100644 --- a/ui/store/background-connection.ts +++ b/ui/store/background-connection.ts @@ -30,7 +30,7 @@ export function submitRequestToBackground( // tests don't always set the `background` property for convenience, as // the return values for various RPC calls aren't always used. In production // builds, this will not happen, and even if it did MM wouldn't work. - if (!background) { + if (typeof background?.[method] !== 'function') { console.warn(NO_BACKGROUND_CONNECTION_MESSAGE); return Promise.resolve() as Promise; }