chore: use official Merge icon

Author: infiniteflower

app/component-library/components/Icons/Icon/Icon.assets.ts

@@ -117,7 +117,6 @@ import flaskSVG from './assets/flask.svg';
 import flowerSVG from './assets/flower.svg';
 import folderSVG from './assets/folder.svg';
 import forestSVG from './assets/forest.svg';
-import frameSVG from './assets/frame.svg';
 import fullcircleSVG from './assets/full-circle.svg';
 import gasSVG from './assets/gas.svg';
 import giftSVG from './assets/gift.svg';
@@ -407,7 +406,6 @@ export const assetByIconName: AssetByIconName = {
   [IconName.Flower]: flowerSVG,
   [IconName.Folder]: folderSVG,
   [IconName.Forest]: forestSVG,
-  [IconName.Frame]: frameSVG,
   [IconName.FullCircle]: fullcircleSVG,
   [IconName.Gas]: gasSVG,
   [IconName.Gift]: giftSVG,

app/component-library/components/Icons/Icon/Icon.types.ts

@@ -187,7 +187,6 @@ export enum IconName {
   Flower = 'Flower',
   Folder = 'Folder',
   Forest = 'Forest',
-  Frame = 'Frame',
   FullCircle = 'FullCircle',
   Gas = 'Gas',
   Gift = 'Gift',

app/component-library/components/Icons/Icon/assets/frame.svg

@@ -2,21 +2,18 @@ import MaskedView from '@react-native-masked-view/masked-view';
 import { useNavigation, useFocusEffect } from '@react-navigation/native';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import {
+  BackHandler,
   Platform,
   StyleSheet,
   View,
+  type ViewStyle,
   useWindowDimensions,
-  BackHandler,
 } from 'react-native';
 import Animated, {
   FadeInDown,
   FadeOutDown,
   runOnJS,
 } from 'react-native-reanimated';
-import LegacyIcon, {
-  IconName as LegacyIconName,
-  IconSize as LegacyIconSize,
-} from '../../../component-library/components/Icons/Icon';
 import Overlay from '../../../component-library/components/Overlay';
 import { useParams } from '../../../util/navigation/navUtils';
 import { Box } from '../../UI/Box/Box';
@@ -72,6 +69,9 @@ import useStakingEligibility from '../../UI/Stake/hooks/useStakingEligibility';
 
 const bottomMaskHeight = 35;
 const animationDuration = AnimationDuration.Fast;
+const batchSellIconStyle = {
+  transform: [{ rotate: '180deg' }],
+} satisfies ViewStyle;
 
 interface TradeWalletActionsParams {
   onDismiss?: () => void;
@@ -314,13 +314,10 @@ function TradeWalletActions() {
                     description={strings(
                       'asset_overview.batch_sell_description',
                     )}
-                    startAccessory={
-                      // eslint-disable-next-line @typescript-eslint/no-deprecated -- Frame is only available in the local icon registry.
-                      <LegacyIcon
-                        name={LegacyIconName.Frame}
-                        size={LegacyIconSize.Lg}
-                      />
-                    }
+                    iconName={IconName.Merge}
+                    iconProps={{
+                      style: batchSellIconStyle,
+                    }}
                     onPress={onBatchSell}
                     testID={
                       WalletActionsBottomSheetSelectorsIDs.BATCH_SELL_BUTTON