diff --git a/apps/cowswap-frontend/src/modules/usdAmount/state/usdRawPricesAtom.ts b/apps/cowswap-frontend/src/modules/usdAmount/state/usdRawPricesAtom.ts index 039cd56ea3..9fe741c9d1 100644 --- a/apps/cowswap-frontend/src/modules/usdAmount/state/usdRawPricesAtom.ts +++ b/apps/cowswap-frontend/src/modules/usdAmount/state/usdRawPricesAtom.ts @@ -2,8 +2,6 @@ import { atom } from 'jotai' import { Fraction, Token } from '@uniswap/sdk-core' -import ms from 'ms.macro' - import { deepEqual } from 'utils/deepEqual' export interface UsdRawPriceState { @@ -15,53 +13,51 @@ export interface UsdRawPriceState { export type UsdRawPrices = { [tokenAddress: string]: UsdRawPriceState } -const DELETION_FROM_QUEUE_DEBOUNCE = ms`5s` +const usdPriceQueueSubscribersCountAtom = atom<{ [tokenAddress: string]: number }>({}) export const currenciesUsdPriceQueueAtom = atom<{ [tokenAddress: string]: Token }>({}) export const usdRawPricesAtom = atom({}) -const currenciesToDeleteFromQueueAtom = atom<{ [tokenAddress: string]: Token | undefined }>({}) +export const addCurrencyToUsdPriceQueue = atom(null, (get, set, token: Token) => { + const currencyAddress = token.address.toLowerCase() + const usdPriceQueueSubscribersCount = get(usdPriceQueueSubscribersCountAtom) + const currenciesToLoadUsdPrice = { ...get(currenciesUsdPriceQueueAtom) } -export const addCurrencyToUsdPriceQueue = atom(null, (get, set, currency: Token) => { - const currencyAddress = currency.address.toLowerCase() - const currenciesToLoadUsdPrice = get(currenciesUsdPriceQueueAtom) + const subscribersCount = (usdPriceQueueSubscribersCount[currencyAddress] || 0) + 1 - // Remove the currency from deletion queue - set(currenciesToDeleteFromQueueAtom, { ...get(currenciesToDeleteFromQueueAtom), [currencyAddress]: undefined }) + // Increase the subscribers count + set(usdPriceQueueSubscribersCountAtom, { + ...usdPriceQueueSubscribersCount, + [currencyAddress]: subscribersCount, + }) if (!currenciesToLoadUsdPrice[currencyAddress]) { set(currenciesUsdPriceQueueAtom, { ...currenciesToLoadUsdPrice, - [currencyAddress]: currency, + [currencyAddress]: token, }) } }) -export const removeCurrencyToUsdPriceFromQueue = atom(null, (get, set, currency: Token) => { - const currencyAddress = currency.address.toLowerCase() - const currenciesToLoadUsdPrice = get(currenciesUsdPriceQueueAtom) - const currenciesToDeleteFromQueue = get(currenciesToDeleteFromQueueAtom) - - const isCurrencyInUsdPriceQueue = !!currenciesToLoadUsdPrice[currencyAddress] - const isCurrencyInDeletionQueue = !!currenciesToDeleteFromQueue[currencyAddress] - - if (isCurrencyInUsdPriceQueue && !isCurrencyInDeletionQueue) { - // Add the currency from deletion queue - set(currenciesToDeleteFromQueueAtom, { ...currenciesToDeleteFromQueue, [currencyAddress]: currency }) +export const removeCurrencyToUsdPriceFromQueue = atom(null, (get, set, token: Token) => { + const currencyAddress = token.address.toLowerCase() + const usdPriceQueueSubscribersCount = get(usdPriceQueueSubscribersCountAtom) + const currenciesToLoadUsdPrice = { ...get(currenciesUsdPriceQueueAtom) } - setTimeout(() => { - const currenciesToLoadUsdPrice = { ...get(currenciesUsdPriceQueueAtom) } + const subscribersCount = Math.max((usdPriceQueueSubscribersCount[currencyAddress] || 0) - 1, 0) - // Remove the currency from USD price queue only if it's not added again - if (get(currenciesToDeleteFromQueueAtom)[currencyAddress]) { - set(currenciesToDeleteFromQueueAtom, { ...get(currenciesToDeleteFromQueueAtom), [currencyAddress]: undefined }) + // Decrease the subscribers count + set(usdPriceQueueSubscribersCountAtom, { + ...usdPriceQueueSubscribersCount, + [currencyAddress]: subscribersCount, + }) - delete currenciesToLoadUsdPrice[currencyAddress] + // If there are no subscribers, then delete the token from queue + if (subscribersCount === 0) { + delete currenciesToLoadUsdPrice[currencyAddress] - set(currenciesUsdPriceQueueAtom, currenciesToLoadUsdPrice) - } - }, DELETION_FROM_QUEUE_DEBOUNCE) + set(currenciesUsdPriceQueueAtom, currenciesToLoadUsdPrice) } })