Merge branch 'main' into MMS-1872-destination-account-picker-standalo…

…ne-component
MetaMask · Feb 14, 2025 · 4c86d20 · 4c86d20
2 parents 2b8e6e3 + 99f5b19
commit 4c86d20
Show file tree

Hide file tree

Showing 33 changed files with 1,040 additions and 566 deletions.
diff --git a/app/build-types/main/fox.json b/app/build-types/main/fox.json
@@ -166,71 +166,71 @@
     }
   ],
   "positions": [
-    [88.691872, 67.6826, 22.22584],
-    [51.7222, 54.043000000000006, 15.07608],
-    [76.753896, 113.62368799999999, 38.548312],
-    [19.729856, 54.004056000000006, 48.30172],
-    [51.714104, 31.799888000000003, 29.02932],
-    [76.842736, 31.59144, 7.287504],
-    [17.854784, 0.49040000000000106, 64.875224],
-    [39.377784, 5.803343999999999, 51.700896],
-    [21.847232, 12.015064000000002, 65.852264],
-    [7.48568, -25.46644, 111.189048],
-    [14.608384, 21.586208, 71.739944],
-    [10.069552, -56.17332, 93.707952],
-    [10.046504, -40.853864, 112.495824],
-    [38.63916, -39.202256, 43.792032],
-    [32.122616, -36.341504, 5.626512],
-    [12.901064, -31.112464, 111.035648],
-    [76.696888, -50.504096000000004, -4.484848],
-    [88.424896, -11.468736, 9.85496],
-    [17.169064, 78.06108, 18.753472],
-    [4.531048, -28.324464, 117.806792],
-    [8.67352, -33.753848, 117.653392],
-    [41.368152, 53.694, -24.275072],
-    [16.7368, 41.160848, -41.972192],
-    [13.30664, 70.349856, -10.09372],
-    [57.79568, 23.412944000000003, -14.530608],
-    [18.76504, 0.5344799999999985, -45.283328],
-    [8.481832, -56.213456, 31.151208],
-    [38.50384, 21.586256, 61.663296],
-    [38.63912, -12.006344, 68.38244],
-    [-88.691872, 67.6826, 22.22584],
-    [-51.7222, 54.043000000000006, 15.07608],
-    [-76.753896, 113.62368799999999, 38.548312],
-    [-19.729856, 54.004056000000006, 48.30172],
-    [-51.714104, 31.799888000000003, 29.02932],
-    [-76.842736, 31.59144, 7.287504],
-    [-17.854784, 0.49040000000000106, 64.875224],
-    [-39.377784, 5.803343999999999, 51.700896],
-    [-21.847232, 12.015064000000002, 65.852264],
-    [-7.48568, -25.46644, 111.189048],
-    [-14.608384, 21.586208, 71.739944],
-    [-10.069552, -56.17332, 93.707952],
-    [-10.046504, -40.853864, 112.495824],
-    [-38.63916, -39.202256, 43.792032],
-    [-32.122616, -36.341504, 5.626512],
-    [-12.901064, -31.112464, 111.035648],
-    [-76.696888, -50.504096000000004, -4.484848],
-    [-88.424896, -11.468736, 9.85496],
-    [-17.169064, 78.06108, 18.753472],
-    [-4.531048, -28.324464, 117.806792],
-    [-8.67352, -33.753848, 117.653392],
-    [-41.368152, 53.694, -24.275072],
-    [-16.7368, 41.160848, -41.972192],
-    [-13.30664, 70.349856, -10.09372],
-    [-57.79568, 23.412944000000003, -14.530608],
-    [-18.76504, 0.5344799999999985, -45.283328],
-    [-8.481832, -56.213456, 31.151208],
-    [-38.50384, 21.586256, 61.663296],
-    [-38.63912, -12.006344, 68.38244],
-    [-52.796032, 8.945816, 42.791584],
-    [52.796032, 8.945816, 42.791584],
-    [-33.081296, 12.007392000000003, 60.645672],
-    [33.081296, 12.007392000000003, 60.645672],
-    [-12.413504, 5.22804, 76.7012],
-    [12.413504, 5.22804, 76.7012],
-    [-24.716432, 21.586224, 67.378992],
-    [24.716432, 21.586224, 67.378992]
+    [11.086484, 5.960324999999999, 2.77823],
+    [6.465275, 4.255375000000001, 1.88451],
+    [9.594237, 11.702960999999998, 4.818539],
+    [2.466232, 4.250507000000001, 6.037715],
+    [6.464263, 1.4749859999999995, 3.628665],
+    [9.605342, 1.4489300000000007, 0.910938],
+    [2.231848, -2.4387, 8.109403],
+    [4.922223, -1.7745820000000005, 6.462612],
+    [2.730904, -0.9981170000000006, 8.231533],
+    [0.93571, -5.683305, 13.898631],
+    [1.826048, 0.1982759999999999, 8.967493],
+    [1.258694, -9.521664999999999, 11.713494],
+    [1.255813, -7.606733, 14.061978],
+    [4.829895, -7.400282, 5.474004],
+    [4.015327, -7.042688, 0.703314],
+    [1.612633, -6.389058, 13.879456],
+    [9.587111, -8.813012, -0.560606],
+    [11.053112, -3.933592, 1.23187],
+    [2.146133, 7.2576350000000005, 2.344184],
+    [0.566381, -6.040558, 14.725849],
+    [1.08419, -6.719231000000001, 14.706674],
+    [5.171019, 4.21175, -3.034384],
+    [2.0921, 2.645106, -5.246524],
+    [1.66333, 6.2937319999999985, -1.261715],
+    [7.22446, 0.4266179999999995, -1.816326],
+    [2.34563, -2.4331899999999997, -5.660416],
+    [1.060229, -9.526682000000001, 3.893901],
+    [4.81298, 0.19828200000000074, 7.707912],
+    [4.82989, -4.000793, 8.547805],
+    [-11.086484, 5.960324999999999, 2.77823],
+    [-6.465275, 4.255375000000001, 1.88451],
+    [-9.594237, 11.702960999999998, 4.818539],
+    [-2.466232, 4.250507000000001, 6.037715],
+    [-6.464263, 1.4749859999999995, 3.628665],
+    [-9.605342, 1.4489300000000007, 0.910938],
+    [-2.231848, -2.4387, 8.109403],
+    [-4.922223, -1.7745820000000005, 6.462612],
+    [-2.730904, -0.9981170000000006, 8.231533],
+    [-0.93571, -5.683305, 13.898631],
+    [-1.826048, 0.1982759999999999, 8.967493],
+    [-1.258695, -9.521664999999999, 11.713494],
+    [-1.255813, -7.606733, 14.061978],
+    [-4.829895, -7.400282, 5.474004],
+    [-4.015327, -7.042687, 0.703314],
+    [-1.612633, -6.389058, 13.879456],
+    [-9.587111, -8.813012, -0.560606],
+    [-11.053112, -3.933592, 1.23187],
+    [-2.146133, 7.2576350000000005, 2.344184],
+    [-0.566381, -6.040558, 14.725849],
+    [-1.08419, -6.719231000000001, 14.706674],
+    [-5.171019, 4.21175, -3.034384],
+    [-2.0921, 2.645106, -5.246524],
+    [-1.66333, 6.2937319999999985, -1.261715],
+    [-7.22446, 0.4266179999999995, -1.816326],
+    [-2.34563, -2.4331899999999997, -5.660416],
+    [-1.060229, -9.526682000000001, 3.893901],
+    [-4.81298, 0.19828200000000074, 7.707912],
+    [-4.82989, -4.000793, 8.547805],
+    [-6.599504, -1.3817730000000008, 5.348948],
+    [6.599504, -1.3817730000000008, 5.348948],
+    [-4.135162, -0.9990760000000005, 7.580709],
+    [4.135162, -0.9990760000000005, 7.580709],
+    [-1.551688, -1.8464950000000009, 9.58765],
+    [1.551688, -1.8464950000000009, 9.58765],
+    [-3.089554, 0.19827800000000018, 8.422374],
+    [3.089554, 0.19827800000000018, 8.422374]
   ]
 }
diff --git a/development/circular-deps.jsonc b/development/circular-deps.jsonc
@@ -12,25 +12,6 @@
     "ui/components/app/alert-system/confirm-alert-modal/index.tsx",
     "ui/pages/confirmations/components/confirm/footer/footer.tsx"
   ],
-  [
-    "ui/components/app/assets/asset-list/asset-list-control-bar/asset-list-control-bar.tsx",
-    "ui/components/app/assets/asset-list/asset-list-control-bar/index.ts",
-    "ui/components/app/assets/asset-list/asset-list.tsx",
-    "ui/components/app/assets/asset-list/network-filter/index.ts",
-    "ui/components/app/assets/asset-list/network-filter/network-filter.tsx",
-    "ui/hooks/useAccountTotalCrossChainFiatBalance.ts"
-  ],
-  [
-    "ui/components/app/assets/asset-list/asset-list.tsx",
-    "ui/components/app/assets/asset-list/native-token/index.ts",
-    "ui/components/app/assets/asset-list/native-token/native-token.tsx"
-  ],
-  [
-    "ui/components/app/assets/asset-list/asset-list.tsx",
-    "ui/components/app/assets/asset-list/native-token/index.ts",
-    "ui/components/app/assets/asset-list/native-token/native-token.tsx",
-    "ui/components/app/assets/asset-list/native-token/use-native-token-balance.ts"
-  ],
   [
     "ui/components/app/name/name-details/name-details.tsx",
     "ui/components/app/name/name.tsx"

diff --git a/ui/components/app/assets/asset-list/asset-list.tsx b/ui/components/app/assets/asset-list/asset-list.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useContext, useMemo } from 'react';
+import React, { useCallback, useContext } from 'react';
 import { useSelector } from 'react-redux';
 import TokenList from '../token-list';
 import { getMultichainIsEvm } from '../../../../selectors/multichain';
@@ -8,23 +8,14 @@ import {
   MetaMetricsEventName,
 } from '../../../../../shared/constants/metametrics';
 import DetectedToken from '../../detected-token/detected-token';
-import useAssetListTokenDetection from '../hooks/useAssetListTokenDetection';
-import usePrimaryCurrencyProperties from '../hooks/usePrimaryCurrencyProperties';
+import {
+  useAssetListTokenDetection,
+  usePrimaryCurrencyProperties,
+} from '../hooks';
 import AssetListControlBar from './asset-list-control-bar';
-import NativeToken from './native-token';
 import AssetListFundingModals from './asset-list-funding-modals';
 
-export type TokenWithBalance = {
-  address: string;
-  symbol: string;
-  string?: string;
-  image: string;
-  secondary?: string;
-  tokenFiatAmount?: string;
-  isNative?: boolean;
-};
-
-export type AssetListProps = {
+type AssetListProps = {
   onClickAsset: (chainId: string, address: string) => void;
   showTokensLinks?: boolean;
 };
@@ -33,7 +24,6 @@ const TokenListContainer = React.memo(
   ({ onClickAsset }: Pick<AssetListProps, 'onClickAsset'>) => {
     const trackEvent = useContext(MetaMetricsContext);
     const { primaryCurrencyProperties } = usePrimaryCurrencyProperties();
-    const isEvm = useSelector(getMultichainIsEvm);
 
     const onTokenClick = useCallback(
       (chainId: string, tokenAddress: string) => {
@@ -50,19 +40,7 @@ const TokenListContainer = React.memo(
       [],
     );
 
-    const nativeToken = useMemo(
-      () => !isEvm && <NativeToken onClickAsset={onClickAsset} />,
-      [isEvm, onClickAsset],
-    );
-
-    return (
-      <TokenList
-        // nativeToken is still needed to avoid breaking flask build's support for bitcoin
-        // TODO: refactor this to no longer be needed for non-evm chains
-        nativeToken={nativeToken}
-        onTokenClick={onTokenClick}
-      />
-    );
+    return <TokenList onTokenClick={onTokenClick} />;
   },
 );
 

diff --git a/ui/components/app/assets/asset-list/native-token/index.ts b/ui/components/app/assets/asset-list/native-token/index.ts
diff --git a/ui/components/app/assets/asset-list/native-token/native-token.tsx b/ui/components/app/assets/asset-list/native-token/native-token.tsx
diff --git a/ui/components/app/assets/hooks/index.ts b/ui/components/app/assets/hooks/index.ts
@@ -0,0 +1,5 @@
+export { default as useAssetListTokenDetection } from './useAssetListTokenDetection';
+export { default as useNativeTokenBalance } from './useNativeTokenBalance';
+export { default as useNetworkFilter } from './useNetworkFilter';
+export { default as usePrimaryCurrencyProperties } from './usePrimaryCurrencyProperties';
+export { default as useTokenDisplayInfo } from './useTokenDisplayInfo';
diff --git a/.../native-token/use-native-token-balance.ts → ...pp/assets/hooks/useNativeTokenBalance.tsx b/.../native-token/use-native-token-balance.ts → ...pp/assets/hooks/useNativeTokenBalance.tsx
@@ -1,24 +1,24 @@
 import currencyFormatter from 'currency-formatter';
 import { useSelector } from 'react-redux';
-
+import { Hex } from '@metamask/utils';
 import {
   getMultichainCurrencyImage,
   getMultichainCurrentNetwork,
   getMultichainSelectedAccountCachedBalance,
   getMultichainShouldShowFiat,
-} from '../../../../../selectors/multichain';
+} from '../../../../selectors/multichain';
 import {
   getPreferences,
   getSelectedInternalAccount,
-} from '../../../../../selectors';
-import { getCurrentCurrency } from '../../../../../ducks/metamask/metamask';
-import { useIsOriginalNativeTokenSymbol } from '../../../../../hooks/useIsOriginalNativeTokenSymbol';
-import { PRIMARY, SECONDARY } from '../../../../../helpers/constants/common';
-import { useUserPreferencedCurrency } from '../../../../../hooks/useUserPreferencedCurrency';
-import { useCurrencyDisplay } from '../../../../../hooks/useCurrencyDisplay';
-import { TokenWithBalance } from '../asset-list';
+} from '../../../../selectors';
+import { getCurrentCurrency } from '../../../../ducks/metamask/metamask';
+import { useIsOriginalNativeTokenSymbol } from '../../../../hooks/useIsOriginalNativeTokenSymbol';
+import { PRIMARY, SECONDARY } from '../../../../helpers/constants/common';
+import { useUserPreferencedCurrency } from '../../../../hooks/useUserPreferencedCurrency';
+import { useCurrencyDisplay } from '../../../../hooks/useCurrencyDisplay';
+import { TokenWithFiatAmount } from '../types';
 
-export const useNativeTokenBalance = () => {
+const useNativeTokenBalance = () => {
   const showFiat = useSelector(getMultichainShouldShowFiat);
   const account = useSelector(getSelectedInternalAccount);
   const primaryTokenImage = useSelector(getMultichainCurrencyImage);
@@ -81,21 +81,26 @@ export const useNativeTokenBalance = () => {
   // useCurrencyDisplay passes along the symbol and formatting into the value here
   // for sorting we need the raw value, without the currency and it should be decimal
   // this is the easiest way to do this without extensive refactoring of useCurrencyDisplay
-  const tokenFiatAmount = currencyFormatter
-    .unformat(unformattedTokenFiatAmount, {
+  const tokenFiatAmount = currencyFormatter.unformat(
+    unformattedTokenFiatAmount,
+    {
       code: currentCurrency.toUpperCase(),
-    })
-    .toString();
+    },
+  );
 
-  const nativeTokenWithBalance: TokenWithBalance = {
-    address: '',
+  const nativeTokenWithBalance: TokenWithFiatAmount = {
+    chainId: chainId as Hex,
+    address: '' as Hex,
     symbol: tokenSymbol ?? '',
     string: primaryBalance,
     image: primaryTokenImage,
     secondary: secondaryBalance,
     tokenFiatAmount,
     isNative: true,
+    decimals: 18,
   };
 
   return nativeTokenWithBalance;
 };
+
+export default useNativeTokenBalance;
diff --git a/ui/components/app/assets/hooks/useShouldShowFiat.tsx b/ui/components/app/assets/hooks/useShouldShowFiat.tsx