refactor: remove derived FX from account configurations, fix duplicat…

…ed key error (#17962)
deriv-com · Jan 14, 2025 · 30b4e37 · 30b4e37
1 parent 28943c8
commit 30b4e37
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 24 deletions.
diff --git a/packages/cfd/src/Containers/cfd-compare-accounts/cfd-compare-accounts.tsx b/packages/cfd/src/Containers/cfd-compare-accounts/cfd-compare-accounts.tsx
@@ -1,23 +1,26 @@
 import React from 'react';
 import { useHistory } from 'react-router-dom';
 import classNames from 'classnames';
-import { Text, Icon, PageOverlay, CFDCompareAccountsCarousel } from '@deriv/components';
+
+import { CFDCompareAccountsCarousel, Icon, PageOverlay, Text } from '@deriv/components';
+import { useIsRtl } from '@deriv/hooks';
 import { routes } from '@deriv/shared';
-import { Localize, localize } from '@deriv/translations';
 import { observer, useStore } from '@deriv/stores';
+import { Localize, localize } from '@deriv/translations';
 import { useDevice } from '@deriv-com/ui';
-import { useIsRtl } from '@deriv/hooks';
-import CFDCompareAccountsCard from './cfd-compare-accounts-card';
+
 import {
-    getSortedCFDAvailableAccounts,
+    ctrader_data,
+    dxtrade_data,
+    getCtraderDemoData,
+    getDxtradeDemoData,
     getEUAvailableAccounts,
     getMT5DemoData,
-    getDxtradeDemoData,
-    getCtraderDemoData,
-    dxtrade_data,
-    ctrader_data,
+    getSortedCFDAvailableAccounts,
 } from '../../Helpers/compare-accounts-config';
 
+import CFDCompareAccountsCard from './cfd-compare-accounts-card';
+
 const CompareCFDs = observer(() => {
     const { isDesktop } = useDevice();
     const is_rtl = useIsRtl();
@@ -147,7 +150,7 @@ const CompareCFDs = observer(() => {
                     {all_cfd_available_accounts.map(item => (
                         <CFDCompareAccountsCard
                             trading_platforms={item}
-                            key={item.market_type + item.shortcode}
+                            key={item.market_type + item.shortcode + (item?.product || '')}
                             is_eu_user={is_eu_user}
                             is_demo={is_demo}
                         />

diff --git a/packages/cfd/src/Helpers/compare-accounts-config.ts b/packages/cfd/src/Helpers/compare-accounts-config.ts
@@ -1,6 +1,8 @@
 import { localize } from '@deriv/translations';
+
 import { TInstrumentsIcon, TModifiedTradingPlatformAvailableAccount, TProducts } from '../Components/props.types';
-import { CFD_PLATFORMS, MARKET_TYPE, JURISDICTION, REGION, MARKET_TYPE_SHORTCODE, PRODUCT } from './cfd-config';
+
+import { CFD_PLATFORMS, JURISDICTION, MARKET_TYPE, MARKET_TYPE_SHORTCODE, PRODUCT, REGION } from './cfd-config';
 
 // Map the accounts according to the market type
 const getHighlightedIconLabel = (
@@ -40,8 +42,6 @@ const getHighlightedIconLabel = (
                 return 'forex';
             } else if (item === 'ETFs') {
                 return 'ETFs'; // Preserve the original form for ETFs
-            } else if (item === 'Derived FX') {
-                return 'derived_FX'; // Handle FX case
             }
             return item.toLowerCase().replace(/\s+/g, '_'); // Replace spaces with underscores
         });
@@ -69,12 +69,6 @@ const getHighlightedIconLabel = (
             text: localize('Basket indices'),
             is_available: selected_region === REGION.NON_EU,
         },
-        {
-            id: 'derived_FX',
-            icon: 'DerivedFX',
-            text: localize('Derived FX'),
-            is_available: selected_region === REGION.NON_EU,
-        },
     ];
 
     return instrumentsData.map((item: TInstrumentsIcon) => ({

diff --git a/packages/wallets/src/features/cfd/screens/CompareAccounts/compareAccountsConfig.ts b/packages/wallets/src/features/cfd/screens/CompareAccounts/compareAccountsConfig.ts
@@ -66,11 +66,6 @@ const getHighlightedIconLabel = (values: TValues) => {
                   { highlighted: shouldHighlight('Basket indices'), icon: 'Baskets', text: localize('Basket indices') },
               ] as const)
             : []),
-        ...(!isEuRegion
-            ? ([
-                  { highlighted: shouldHighlight('Derived FX'), icon: 'DerivedFX', text: localize('Derived FX') },
-              ] as const)
-            : []),
     ] as const;
 };