extract constant

Author: n3ps

ui/components/app/assets/asset-list/cells/asset-title.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import {
-  Display,
   FontWeight,
   TextVariant,
 } from '../../../../../helpers/constants/design-system';
@@ -10,7 +9,6 @@ import {
   networkTitleOverrides,
 } from '../../util/networkTitleOverrides';
 import { useI18nContext } from '../../../../../hooks/useI18nContext';
-import Tooltip from '../../../../ui/tooltip';
 
 type AssetCellTitleProps = {
   title: string;
@@ -19,27 +17,6 @@ type AssetCellTitleProps = {
 export const AssetCellTitle = ({ title }: AssetCellTitleProps) => {
   const t = useI18nContext();
 
-  if (false &&title && title.length > 12) {
-    return (
-      <Tooltip
-        position="bottom"
-        html={title}
-        wrapperClassName="token-cell-title--ellipsis"
-      >
-        <Text
-          as="span"
-          data-testid="multichain-token-list-item-token-name"
-          fontWeight={FontWeight.Medium}
-          variant={TextVariant.bodyMd}
-          display={Display.Block}
-          ellipsis
-        >
-          {networkTitleOverrides(t as TranslateFunction, { title })}
-        </Text>
-      </Tooltip>
-    );
-  }
-
   // non-ellipsized title
   return (
     <Text

ui/components/app/assets/asset-list/cells/generic-asset-cell-layout.tsx

@@ -6,6 +6,7 @@ import {
   BlockSize,
   JustifyContent,
 } from '../../../../../helpers/constants/design-system';
+import { ASSET_CELL_HEIGHT } from '../../constants';
 
 type GenericAssetCellLayoutProps = {
   onClick?: () => void;
@@ -54,7 +55,7 @@ export default function GenericAssetCellLayout({
         paddingRight={4}
         width={BlockSize.Full}
         style={{
-          height: 62,
+          height: ASSET_CELL_HEIGHT,
           cursor: onClick ? 'pointer' : 'auto',
           backgroundColor:
             !disableHover && isHovered

ui/components/app/assets/constants.ts

@@ -9,3 +9,5 @@ export const ACCOUNT_TYPE_LABELS: Partial<Record<KeyringAccountType, string>> =
     [BtcAccountType.P2wpkh]: 'Native SegWit',
     [BtcAccountType.P2tr]: 'Taproot',
   };
+
+export const ASSET_CELL_HEIGHT = 62;

ui/components/app/assets/token-list/token-list.tsx

@@ -1,9 +1,10 @@
-import React, { useContext, useEffect, useMemo, useRef } from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { useSelector } from 'react-redux';
 import { type CaipChainId, type Hex } from '@metamask/utils';
 import { NON_EVM_TESTNET_IDS } from '@metamask/multichain-network-controller';
 import { useVirtualizer } from '@tanstack/react-virtual';
 import TokenCell from '../token-cell';
+import { ASSET_CELL_HEIGHT } from '../constants';
 import {
   getEnabledNetworksByNamespace,
   getIsMultichainAccountsState2Enabled,
@@ -150,8 +151,8 @@ function TokenList({ onTokenClick, safeChains }: TokenListProps) {
 
   const virtualizer = useVirtualizer({
     count: sortedFilteredTokens.length,
-    getScrollElement: () => scrollContainerRef.current,
-    estimateSize: () => 62, // TokenCell height from generic-asset-cell-layout.tsx
+    getScrollElement: () => scrollContainerRef?.current || null,
+    estimateSize: () => ASSET_CELL_HEIGHT,
     overscan: 5,
   });