diff --git a/packages/hooks/src/useTotalAccountBalance.ts b/packages/hooks/src/useTotalAccountBalance.ts index b791b926f5ce..0fad88acc054 100644 --- a/packages/hooks/src/useTotalAccountBalance.ts +++ b/packages/hooks/src/useTotalAccountBalance.ts @@ -1,6 +1,7 @@ import useRealTotalAssetCurrency from './useTotalAssetCurrency'; import useExchangeRate from './useExchangeRate'; -import { useEffect, useState } from 'react'; +import { useStore } from '@deriv/stores'; +import { CFD_PLATFORMS } from '../../shared/src/utils/platform'; /** * we can use this hook to get the total balance of the given accounts list. * it loops through the accounts list and adds the balance of each account @@ -8,26 +9,20 @@ import { useEffect, useState } from 'react'; * first account in the list */ const useTotalAccountBalance = (accounts: { balance?: number; currency?: string }[]) => { + const { traders_hub } = useStore(); + const { is_demo } = traders_hub; const total_assets_real_currency = useRealTotalAssetCurrency(); const { getRate } = useExchangeRate(); - const [balance, setBalance] = useState(0); + if (!accounts.length) return { balance: 0, currency: total_assets_real_currency }; - useEffect(() => { - if (!accounts.length) { - setBalance(0); - return; - } + const balance = accounts.reduce((total, account) => { + const base_rate = getRate(total_assets_real_currency || ''); + const rate = is_demo && CFD_PLATFORMS.MT5 ? getRate('USD') : getRate(total_assets_real_currency || ''); + const exchange_rate = base_rate / rate; - const updatedBalance = accounts.reduce((total, account) => { - const base_rate = getRate(total_assets_real_currency || ''); - const rate = getRate(account.currency || total_assets_real_currency || ''); - const exchange_rate = base_rate / rate; - return total + (account.balance || 0) * exchange_rate; - }, 0); - - setBalance(updatedBalance); - }, [accounts, getRate, total_assets_real_currency]); + return total + (account.balance || 0) * exchange_rate; + }, 0); return { balance, diff --git a/packages/stores/src/providers/ExchangeRatesProvider.tsx b/packages/stores/src/providers/ExchangeRatesProvider.tsx index e41f0d5fd727..bc8f04a35173 100644 --- a/packages/stores/src/providers/ExchangeRatesProvider.tsx +++ b/packages/stores/src/providers/ExchangeRatesProvider.tsx @@ -4,24 +4,22 @@ import merge from 'lodash.merge'; import useStore from '../useStore'; const ExchangeRatesProvider = ({ children }: React.PropsWithChildren) => { - const { is_loading, data, subscribe } = useSubscription('exchange_rates'); + const { data, subscribe } = useSubscription('exchange_rates'); const { exchange_rates: { update }, } = useStore(); - useEffect(() => { subscribe({ payload: { base_currency: 'USD' } }); }, [subscribe]); useEffect(() => { - if (!is_loading && data) { + if (data) { const { exchange_rates } = data; if (exchange_rates) update(prev => merge(prev, exchange_rates)); } - }, [is_loading, update, data]); + }, [update, data]); return <>{children}; }; - export default ExchangeRatesProvider;