chore: fix sonar cloud issues

MetaMask · Oct 7, 2024 · 00477d5 · 00477d5
1 parent 60f33ac
commit 00477d5
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 51 deletions.
diff --git a/app/scripts/migrations/130.test.ts b/app/scripts/migrations/130.test.ts
@@ -1,4 +1,5 @@
 import { migrate, version } from './130';
+
 const oldVersion = 129;
 
 describe(`migration #${version}`, () => {

diff --git a/ui/components/app/assets/asset-list/asset-list-control-bar/asset-list-control-bar.tsx b/ui/components/app/assets/asset-list/asset-list-control-bar/asset-list-control-bar.tsx
@@ -49,52 +49,50 @@ const AssetListControlBar = ({ showTokensLinks }: AssetListControlBarProps) => {
   };
 
   return (
-    <>
-      <Box
-        className="asset-list-control-bar"
-        ref={controlBarRef}
-        display={Display.Flex}
-        justifyContent={JustifyContent.spaceBetween}
-        marginLeft={4}
-        marginRight={4}
-        paddingTop={4}
+    <Box
+      className="asset-list-control-bar"
+      ref={controlBarRef}
+      display={Display.Flex}
+      justifyContent={JustifyContent.spaceBetween}
+      marginLeft={4}
+      marginRight={4}
+      paddingTop={4}
+    >
+      <ButtonBase
+        data-testid="sort-by-popover-toggle"
+        className="asset-list-control-bar__button"
+        onClick={handleOpenPopover}
+        size={ButtonBaseSize.Sm}
+        endIconName={IconName.ArrowDown}
+        backgroundColor={
+          isPopoverOpen
+            ? BackgroundColor.backgroundPressed
+            : BackgroundColor.backgroundDefault
+        }
+        borderColor={BorderColor.borderMuted}
+        borderStyle={BorderStyle.solid}
+        color={TextColor.textDefault}
       >
-        <ButtonBase
-          data-testid="sort-by-popover-toggle"
-          className="asset-list-control-bar__button"
-          onClick={handleOpenPopover}
-          size={ButtonBaseSize.Sm}
-          endIconName={IconName.ArrowDown}
-          backgroundColor={
-            isPopoverOpen
-              ? BackgroundColor.backgroundPressed
-              : BackgroundColor.backgroundDefault
-          }
-          borderColor={BorderColor.borderMuted}
-          borderStyle={BorderStyle.solid}
-          color={TextColor.textDefault}
-        >
-          {t('sortBy')}
-        </ButtonBase>
-        <ImportControl showTokensLinks={showTokensLinks} />
-        <Popover
-          onClickOutside={closePopover}
-          isOpen={isPopoverOpen}
-          position={PopoverPosition.BottomStart}
-          referenceElement={controlBarRef.current}
-          matchWidth={!isFullScreen}
-          style={{
-            zIndex: 10,
-            display: 'flex',
-            flexDirection: 'column',
-            padding: 0,
-            minWidth: isFullScreen ? '325px' : '',
-          }}
-        >
-          <SortControl handleClose={closePopover} />
-        </Popover>
-      </Box>
-    </>
+        {t('sortBy')}
+      </ButtonBase>
+      <ImportControl showTokensLinks={showTokensLinks} />
+      <Popover
+        onClickOutside={closePopover}
+        isOpen={isPopoverOpen}
+        position={PopoverPosition.BottomStart}
+        referenceElement={controlBarRef.current}
+        matchWidth={!isFullScreen}
+        style={{
+          zIndex: 10,
+          display: 'flex',
+          flexDirection: 'column',
+          padding: 0,
+          minWidth: isFullScreen ? '325px' : '',
+        }}
+      >
+        <SortControl handleClose={closePopover} />
+      </Popover>
+    </Box>
   );
 };
 

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
@@ -44,8 +44,6 @@ const NativeToken = ({ onClickAsset }: AssetListProps) => {
     <TokenListItem
       onClick={() => onClickAsset(nativeCurrency)}
       title={nativeCurrency}
-      // The primary and secondary currencies are subject to change based on the user's settings
-      // TODO: rename this primary/secondary concept here to be more intuitive, regardless of setting
       primary={string}
       tokenSymbol={symbol}
       secondary={secondary}

diff --git a/ui/components/app/assets/asset-list/native-token/use-native-token-balance.ts b/ui/components/app/assets/asset-list/native-token/use-native-token-balance.ts
@@ -82,7 +82,7 @@ export const useNativeTokenBalance = () => {
 
   const nativeTokenWithBalance: TokenWithBalance = {
     address: '',
-    symbol: tokenSymbol || '',
+    symbol: tokenSymbol ?? '',
     string: primaryBalance,
     image: primaryTokenImage,
     secondary: secondaryBalance,

diff --git a/ui/components/app/assets/token-list/token-list.tsx b/ui/components/app/assets/token-list/token-list.tsx
@@ -75,14 +75,20 @@ export default function TokenList({
     </Box>
   ) : (
     <div>
-      {sortedTokens.map((tokenData, index) => {
+      {sortedTokens.map((tokenData) => {
         if (tokenData?.isNative) {
           // we need cloneElement so that we can pass the unique key
           return React.cloneElement(nativeToken as React.ReactElement, {
-            key: index,
+            key: `${tokenData.symbol}-${tokenData.address}`,
           });
         }
-        return <TokenCell key={index} {...tokenData} onClick={onTokenClick} />;
+        return (
+          <TokenCell
+            key={`${tokenData.symbol}-${tokenData.address}`}
+            {...tokenData}
+            onClick={onTokenClick}
+          />
+        );
       })}
     </div>
   );