remove comment

public/configs/potentialMarketParameters.csv

@@ -1,69 +1,68 @@
-base_asset,reference_price,num_oracles,liquidity_tier,asset_name,p,atomic_resolution,min_exchanges,min_price_change_ppm,price_exponent,step_base_quantum,ticksize_exponent,subticks_per_tick,min_order_size,quantum_conversion_exponent
-AAVE,88.41933533,7,2,AAVE,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-ADA,0.4713770925,9,1,Cardano,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
-AGIX,0.2111443656,6,2,SingularityNET,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-ALGO,0.1613430877,6,2,Algorand,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-APE,1.121514886,7,2,ApeCoin,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-APT,7.323447408,8,2,Aptos,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-ARB,1.701673341,8,1,Arbitrum,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
-ATOM,8.050389759,8,2,Cosmos,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-AVAX,30.38272818,9,1,Avalanche,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
-BCH,236.328774,9,1,Bitcoin Cash,2,-8,3,2500,-7,1000000,-3,1000000,1000000,-9
-BLUR,0.6050104719,7,2,Blur,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-BNB,243.1294766,6,2,Binance Coin,2,-8,3,4000,-7,1000000,-3,1000000,1000000,-9
-BONK,1.09E-05,6,2,Bonk Token,-5,-1,3,4000,-14,1000000,-3,1000000,1000000,-9
-BTC,39909.14585,9,1,Bitcoin,4,-10,3,2500,-5,1000000,-3,1000000,1000000,-9
-CFX,0.1454384387,5,2,Conflux Token,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-CHZ,0.08712744693,6,2,Chiliz,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-COMP,52.74250938,5,2,Compound Coin,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-CRV,0.4443624604,6,2,Curve DAO Token,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-DOGE,0.07793177878,9,1,Dogecoin,-2,-4,3,2500,-11,1000000,-3,1000000,1000000,-9
-DOT,6.452414058,8,1,Polkadot,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
-EGLD,39.03897897,5,2,MultiversX,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-ENS,14.85690244,6,2,Ethereum Name Service (ENS),1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-EOS,0.5977251446,8,2,Eos,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-ETC,22.84861344,8,1,Ethereum Classic,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
-ETH,2211.721168,9,1,Ethereum,3,-9,3,2500,-6,1000000,-3,1000000,1000000,-9
-FET,0.5864541562,6,2,Fetch AI,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-FIL,4.930296959,8,1,Filecoin,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
-FLOW,0.5828593278,5,2,Flow - Dapper Labs,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-FTM,0.3359983176,6,2,Fantom,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-GALA,0.01840015547,6,2,Gala,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-GMT,0.2045438866,5,2,STEPN,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-GRT,0.128018834,7,2,The Graph,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-HBAR,0.07127967284,7,2,Hedera Hashgraph,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-ICP,11.47442186,7,2,Internet Computer,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-INJ,31.78305093,7,2,Injective Protocol,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-JTO,1.886208515,6,2,Jito,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-JUP,0.69,6,2,Jupiter,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-KAVA,0.5751546332,6,2,Kava,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-LDO,2.524539255,8,2,Lido DAO,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-LINK,13.81655633,8,1,ChainLink,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
-LTC,65.43204352,9,1,Litecoin,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
-MANA,0.3716510229,7,2,Decentraland,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-MASK,2.787727403,7,2,Mask Network,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-MATIC,0.7288467315,9,1,Matic Network,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
-MEME,0.01801497104,5,2,Memecoin Price,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-MINA,1.008126033,5,2,Mina,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-MKR,2113.151651,6,2,Maker,3,-9,3,4000,-6,1000000,-3,1000000,1000000,-9
-NEAR,2.674751578,8,1,Near,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
-OP,2.456951554,7,2,Optimism,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-ORDI,43.0494516,6,2,Ordinals,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-PEOPLE,0.02194591464,5,2,ConstitutionDAO,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-PEPE,1.02E-06,6,2,Pepe,-6,0,3,4000,-15,1000000,-3,1000000,1000000,-9
-RNDR,3.777241656,6,2,Render Token,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-SAND,0.3751083804,7,2,SAND,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-SEI,0.6149970988,7,2,Sei,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-SHIB,8.84E-06,8,1,Shiba Inu,-6,0,3,2500,-15,1000000,-3,1000000,1000000,-9
-SNX,3.130619706,6,2,Synthetix Network Token,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-SOL,87.46988589,9,1,Solana,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
-STX,1.255152213,7,2,Stacks,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-SUI,1.224271493,6,2,SuiNetwork,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-SUSHI,0.8926299706,6,2,Sushi,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
-TIA,15.55257715,7,2,Celestia,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
-TRX,0.09702155504,8,2,TRON,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
-UNI,5.760612586,7,2,Uniswap,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-WAVES,2.145700544,5,2,Waves,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-WLD,1.907665645,6,2,Worldcoin WLD,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
-XLM,0.1116437262,8,1,Stellar,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
-XRP,0.5112717386,9,1,Ripple,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
+base_asset,reference_price,num_oracles,liquidity_tier,asset_name,p,atomic_resolution,min_exchanges,min_price_change_ppm,price_exponent,step_base_quantum,ticksize_exponent,subticks_per_tick,min_order_size,quantum_conversion_exponent
+AAVE,88.41933533,7,2,AAVE,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+ADA,0.4713770925,9,1,Cardano,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
+AGIX,0.2111443656,6,2,SingularityNET,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+ALGO,0.1613430877,6,2,Algorand,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+APE,1.121514886,7,2,ApeCoin,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+APT,7.323447408,8,2,Aptos,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+ARB,1.701673341,8,1,Arbitrum,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
+ATOM,8.050389759,8,2,Cosmos,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+AVAX,30.38272818,9,1,Avalanche,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
+BCH,236.328774,9,1,Bitcoin Cash,2,-8,3,2500,-7,1000000,-3,1000000,1000000,-9
+BLUR,0.6050104719,7,2,Blur,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+BNB,243.1294766,6,2,Binance Coin,2,-8,3,4000,-7,1000000,-3,1000000,1000000,-9
+BONK,1.09E-05,6,2,Bonk Token,-5,-1,3,4000,-14,1000000,-3,1000000,1000000,-9
+BTC,39909.14585,9,1,Bitcoin,4,-10,3,2500,-5,1000000,-3,1000000,1000000,-9
+CFX,0.1454384387,5,2,Conflux Token,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+CHZ,0.08712744693,6,2,Chiliz,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+COMP,52.74250938,5,2,Compound Coin,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+CRV,0.4443624604,6,2,Curve DAO Token,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+DOGE,0.07793177878,9,1,Dogecoin,-2,-4,3,2500,-11,1000000,-3,1000000,1000000,-9
+DOT,6.452414058,8,1,Polkadot,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
+EGLD,39.03897897,5,2,MultiversX,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+ENS,14.85690244,6,2,Ethereum Name Service (ENS),1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+EOS,0.5977251446,8,2,Eos,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+ETC,22.84861344,8,1,Ethereum Classic,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
+ETH,2211.721168,9,1,Ethereum,3,-9,3,2500,-6,1000000,-3,1000000,1000000,-9
+FET,0.5864541562,6,2,Fetch AI,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+FIL,4.930296959,8,1,Filecoin,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
+FLOW,0.5828593278,5,2,Flow - Dapper Labs,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+FTM,0.3359983176,6,2,Fantom,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+GALA,0.01840015547,6,2,Gala,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+GMT,0.2045438866,5,2,STEPN,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+GRT,0.128018834,7,2,The Graph,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+HBAR,0.07127967284,7,2,Hedera Hashgraph,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+ICP,11.47442186,7,2,Internet Computer,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+INJ,31.78305093,7,2,Injective Protocol,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+JTO,1.886208515,6,2,Jito,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+KAVA,0.5751546332,6,2,Kava,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+LDO,2.524539255,8,2,Lido DAO,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+LINK,13.81655633,8,1,ChainLink,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
+LTC,65.43204352,9,1,Litecoin,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
+MANA,0.3716510229,7,2,Decentraland,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+MASK,2.787727403,7,2,Mask Network,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+MATIC,0.7288467315,9,1,Matic Network,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
+MEME,0.01801497104,5,2,Memecoin Price,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+MINA,1.008126033,5,2,Mina,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+MKR,2113.151651,6,2,Maker,3,-9,3,4000,-6,1000000,-3,1000000,1000000,-9
+NEAR,2.674751578,8,1,Near,0,-6,3,2500,-9,1000000,-3,1000000,1000000,-9
+OP,2.456951554,7,2,Optimism,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+ORDI,43.0494516,6,2,Ordinals,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+PEOPLE,0.02194591464,5,2,ConstitutionDAO,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+PEPE,1.02E-06,6,2,Pepe,-6,0,3,4000,-15,1000000,-3,1000000,1000000,-9
+RNDR,3.777241656,6,2,Render Token,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+SAND,0.3751083804,7,2,SAND,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+SEI,0.6149970988,7,2,Sei,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+SHIB,8.84E-06,8,1,Shiba Inu,-6,0,3,2500,-15,1000000,-3,1000000,1000000,-9
+SNX,3.130619706,6,2,Synthetix Network Token,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+SOL,87.46988589,9,1,Solana,1,-7,3,2500,-8,1000000,-3,1000000,1000000,-9
+STX,1.255152213,7,2,Stacks,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+SUI,1.224271493,6,2,SuiNetwork,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+SUSHI,0.8926299706,6,2,Sushi,-1,-5,3,4000,-10,1000000,-3,1000000,1000000,-9
+TIA,15.55257715,7,2,Celestia,1,-7,3,4000,-8,1000000,-3,1000000,1000000,-9
+TRX,0.09702155504,8,2,TRON,-2,-4,3,4000,-11,1000000,-3,1000000,1000000,-9
+UNI,5.760612586,7,2,Uniswap,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+WAVES,2.145700544,5,2,Waves,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+WLD,1.907665645,6,2,Worldcoin WLD,0,-6,3,4000,-9,1000000,-3,1000000,1000000,-9
+XLM,0.1116437262,8,1,Stellar,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9
+XRP,0.5112717386,9,1,Ripple,-1,-5,3,2500,-10,1000000,-3,1000000,1000000,-9

src/components/ComboboxMenu.tsx

@@ -50,11 +50,11 @@ export const ComboboxMenu = <MenuItemValue extends string, MenuGroupValue extend
       label={title}
       // value={highlightedCommand}
       // onValueChange={setHighlightedCommand}
-      filter={(value: string, search: string) =>
+      filter={(value: string, search: string) => {
         value.replace(/ /g, '').toLowerCase().includes(search.replace(/ /g, '').toLowerCase())
           ? 1
-          : 0
-      }
+          : 0;
+      }}
       className={className}
       $withStickyLayout={withStickyLayout}
     >

src/components/DropdownMenu.stories.tsx

@@ -6,34 +6,29 @@ import { StoryWrapper } from '.ladle/components';
 
 export const DropdownMenuStory: Story<Parameters<typeof DropdownMenu>> = (args) => {
   const exampleItems = [
-    {
-      value: '0',
-      label: 'Item 0',
-      onSelect: () => alert('Item 0 action'),
-    },
     {
       value: '1',
-      label: 'Item 1 (accent)',
+      label: 'Item 1',
       onSelect: () => alert('Item 1 action'),
-      highlightColor: 'accent',
     },
     {
       value: '2',
-      label: 'Item 2 (create)',
+      label: 'Item 2',
       onSelect: () => alert('Item 2 action'),
-      highlightColor: 'create',
     },
     {
       value: '3',
-      label: 'Item 3 (destroy)',
+      label: 'Item 3',
       onSelect: () => alert('Item 3 action'),
-      highlightColor: 'destroy',
     },
   ];
 
   return (
     <StoryWrapper>
-      <DropdownMenu {...args} items={exampleItems}>
+      <DropdownMenu
+        {...args}
+        items={exampleItems}
+      >
         <span>Menu</span>
       </DropdownMenu>
     </StoryWrapper>

src/components/DropdownMenu.tsx

@@ -13,7 +13,7 @@ export type DropdownMenuItem<T> = {
   label: React.ReactNode;
   onSelect?: () => void;
   separator?: boolean;
-  highlightColor?: 'accent' | 'create' | 'destroy';
+  highlightColor?: 'accent' | 'positive' | 'negative';
 };
 
 type StyleProps = {
@@ -82,7 +82,7 @@ Styled.Separator = styled(Separator)`
   margin: 0.25rem 1rem;
 `;
 
-Styled.Item = styled(Item)<{ $highlightColor: 'accent' | 'create' | 'destroy' }>`
+Styled.Item = styled(Item)<{ $highlightColor: 'accent' | 'positive' | 'negative' }>`
   ${popoverMixins.item}
   --item-font-size: var(--dropdownMenu-item-font-size);
   ${({ $highlightColor }) =>
@@ -90,10 +90,10 @@ Styled.Item = styled(Item)<{ $highlightColor: 'accent' | 'create' | 'destroy' }>
       ['accent']: `
         --item-highlighted-textColor: var(--color-accent);
       `,
-      ['create']: `
+      ['positive']: `
         --item-highlighted-textColor: var(--color-success);
       `,
-      ['destroy']: `
+      ['negative']: `
         --item-highlighted-textColor: var(--color-error);
       `,
     }[$highlightColor])}

src/hooks/useSubaccount.tsx

@@ -433,8 +433,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo
         params,
         utils.getGovAddNewMarketTitle(params.ticker),
         utils.getGovAddNewMarketSummary(params.ticker, newMarketProposal.delayBlocks),
-        // @ts-ignore - Need to change type in v4-client-js
-        BigInt(newMarketProposal.initialDepositAmount).toString()
+        newMarketProposal.initialDepositAmount
       );
 
       return response;

src/views/dialogs/DisplaySettingsDialog.tsx

@@ -19,8 +19,10 @@ import { layoutMixins } from '@/styles/layoutMixins';
 import { Themes } from '@/styles/themes';
 
 import { STRING_KEYS } from '@/constants/localization';
+import { NumberSign } from '@/constants/numbers';
 
 import { Dialog } from '@/components/Dialog';
+import { DiffArrow } from '@/components/DiffArrow';
 import { Icon, IconName } from '@/components/Icon';
 import { HorizontalSeparatorFiller } from '@/components/Separator';
 
@@ -39,7 +41,6 @@ export const DisplaySettingsDialog = ({ setIsOpen }: ElementProps) => {
   const sectionHeader = (heading: string) => {
     return (
       <Styled.Header>
-        {heading}
         {heading}
         <HorizontalSeparatorFiller />
       </Styled.Header>
@@ -67,12 +68,7 @@ export const DisplaySettingsDialog = ({ setIsOpen }: ElementProps) => {
             label: STRING_KEYS.LIGHT,
           },
         ].map(({ themeSetting, label }) => {
-          const theme =
-            themeSetting === AppThemeSystemSetting.System
-              ? globalThis.matchMedia('(prefers-color-scheme: dark)').matches
-                ? AppTheme.Dark
-                : AppTheme.Light
-              : themeSetting;
+          const theme = themeSetting === AppThemeSystemSetting.System ? currentTheme : themeSetting;
 
           const backgroundColor = Themes[theme][currentColorMode].layer2;
           const gridColor = Themes[theme][currentColorMode].borderDefault;
@@ -123,18 +119,20 @@ export const DisplaySettingsDialog = ({ setIsOpen }: ElementProps) => {
             }}
           >
             <Styled.ColorPreferenceLabel>
-              <Styled.ArrowIconContainer>
-                <Styled.ArrowIcon
-                  iconName={IconName.Arrow}
+              <Styled.DiffArrowContainer>
+                <Styled.DiffArrow
                   direction="up"
-                  color={colorMode === AppColorMode.GreenUp ? 'green' : 'red'}
+                  sign={
+                    colorMode === AppColorMode.GreenUp ? NumberSign.Positive : NumberSign.Negative
+                  }
                 />
-                <Styled.ArrowIcon
-                  iconName={IconName.Arrow}
+                <Styled.DiffArrow
                   direction="down"
-                  color={colorMode === AppColorMode.GreenUp ? 'red' : 'green'}
+                  sign={
+                    colorMode === AppColorMode.GreenUp ? NumberSign.Negative : NumberSign.Positive
+                  }
                 />
-              </Styled.ArrowIconContainer>
+              </Styled.DiffArrowContainer>
               {stringGetter({ key: label })}
             </Styled.ColorPreferenceLabel>
             <Styled.DotIndicator $selected={currentColorMode === colorMode} />
@@ -263,36 +261,19 @@ Styled.ColorPreferenceLabel = styled.div`
   gap: 1ch;
 `;
 
-Styled.ArrowIconContainer = styled.div`
+Styled.DiffArrowContainer = styled.div`
   ${layoutMixins.column}
   gap: 0.5ch;
-
-  svg {
-    height: 0.75em;
-    width: 0.75em;
-  }
 `;
 
-Styled.ArrowIcon = styled(Icon)<{ direction: 'up' | 'down'; color: 'green' | 'red' }>`
-  ${({ direction }) =>
-    ({
-      ['up']: css`
-        transform: rotate(-90deg);
-      `,
-      ['down']: css`
-        transform: rotate(90deg);
-      `,
-    }[direction])}
+Styled.DiffArrow = styled(DiffArrow)`
+  --diffArrow-color-positive: var(--color-success);
+  --diffArrow-color-negative: var(--color-error);
 
-  ${({ color }) =>
-    ({
-      ['green']: css`
-        color: var(--color-success);
-      `,
-      ['red']: css`
-        color: var(--color-error);
-      `,
-    }[color])}
+  svg {
+    width: 0.75em;
+    height: 0.75em;
+  }
 `;
 
 const indicatorStyle = css`

src/views/menus/AccountMenu.tsx

@@ -203,7 +203,7 @@ export const AccountMenu = () => {
                 value: 'MnemonicExport',
                 icon: <Icon iconName={IconName.ExportKeys} />,
                 label: <span>{stringGetter({ key: STRING_KEYS.EXPORT_SECRET_PHRASE })}</span>,
-                highlightColor: 'destroy',
+                highlightColor: 'negative',
                 onSelect: () => dispatch(openDialog({ type: DialogTypes.MnemonicExport })),
               },
             ].filter(isTruthy)
@@ -212,7 +212,7 @@ export const AccountMenu = () => {
           value: 'Disconnect',
           icon: <Icon iconName={IconName.BoxClose} />,
           label: stringGetter({ key: STRING_KEYS.DISCONNECT }),
-          highlightColor: 'destroy',
+          highlightColor: 'negative',
           onSelect: () => dispatch(openDialog({ type: DialogTypes.DisconnectWallet })),
         },
       ].filter(isTruthy)}