diff --git a/packages/trader/src/AppV2/Components/Guide/guide.tsx b/packages/trader/src/AppV2/Components/Guide/guide.tsx index 44d0914f1f65..8506bd9f3b19 100644 --- a/packages/trader/src/AppV2/Components/Guide/guide.tsx +++ b/packages/trader/src/AppV2/Components/Guide/guide.tsx @@ -17,6 +17,7 @@ type TGuide = { const Guide = observer(({ has_label, show_guide_for_selected_contract }: TGuide) => { const { ui: { is_dark_mode_on }, + common: { current_language }, } = useStore(); const { contract_type } = useTraderStore(); const contract_type_title = AVAILABLE_CONTRACTS.find(item => item.for.includes(contract_type))?.id ?? ''; @@ -61,6 +62,7 @@ const Guide = observer(({ has_label, show_guide_for_selected_contract }: TGuide) icon={} onClick={() => setIsDescriptionOpened(true)} variant={has_label ? 'secondary' : 'tertiary'} + key={current_language} > {has_label && ( diff --git a/packages/trader/src/AppV2/Components/TradeParameters/trade-parameters.tsx b/packages/trader/src/AppV2/Components/TradeParameters/trade-parameters.tsx index de160d733dfd..e63b95b1bbf5 100644 --- a/packages/trader/src/AppV2/Components/TradeParameters/trade-parameters.tsx +++ b/packages/trader/src/AppV2/Components/TradeParameters/trade-parameters.tsx @@ -1,6 +1,7 @@ import React from 'react'; import clsx from 'clsx'; import { observer } from 'mobx-react'; +import { useStore } from '@deriv/stores'; import { useTraderStore } from 'Stores/useTraderStores'; import { isTradeParamVisible } from 'AppV2/Utils/layout-utils'; import AllowEquals from './AllowEquals'; @@ -28,6 +29,9 @@ type TTradeParametersProps = { const TradeParameters = observer(({ is_minimized }: TTradeParametersProps) => { const { contract_type, has_cancellation, symbol } = useTraderStore(); + const { + common: { current_language }, + } = useStore(); const isVisible = (component_key: string) => isTradeParamVisible({ component_key, contract_type, has_cancellation, symbol }); @@ -37,6 +41,7 @@ const TradeParameters = observer(({ is_minimized }: TTradeParametersProps) => { 'trade-params__options__wrapper', is_minimized && 'trade-params__options__wrapper--minimized' )} + key={current_language} > {is_minimized && ( diff --git a/packages/trader/src/AppV2/Hooks/__tests__/useActiveSymbols.spec.tsx b/packages/trader/src/AppV2/Hooks/__tests__/useActiveSymbols.spec.tsx index d4a6149ee44a..76164df34c63 100644 --- a/packages/trader/src/AppV2/Hooks/__tests__/useActiveSymbols.spec.tsx +++ b/packages/trader/src/AppV2/Hooks/__tests__/useActiveSymbols.spec.tsx @@ -84,6 +84,7 @@ describe('useActiveSymbols', () => { 'active_symbols', mocked_store.client.loginid ?? '', mocked_store.modules.trade.contract_type, + mocked_store.common.current_language, ]); }); diff --git a/packages/trader/src/AppV2/Hooks/useActiveSymbols.ts b/packages/trader/src/AppV2/Hooks/useActiveSymbols.ts index 9f6872133c60..5558a2b69711 100644 --- a/packages/trader/src/AppV2/Hooks/useActiveSymbols.ts +++ b/packages/trader/src/AppV2/Hooks/useActiveSymbols.ts @@ -16,7 +16,7 @@ import { useDtraderQuery } from './useDtraderQuery'; const useActiveSymbols = () => { const { client, common } = useStore(); const { loginid, is_switching } = client; - const { showError } = common; + const { showError, current_language } = common; const { active_symbols: symbols_from_store, contract_type, @@ -57,7 +57,7 @@ const useActiveSymbols = () => { }; const { data: response } = useDtraderQuery( - ['active_symbols', loginid ?? '', getContractType()], + ['active_symbols', loginid ?? '', getContractType(), current_language], { active_symbols: 'brief', contract_type: getContractTypesList(),