diff --git a/CHANGELOG.md b/CHANGELOG.md index bb2a0dc58..1069cfcae 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,7 @@ - Update poolAddress & pooldetail logic for all Sends [#227] (https://github.com/asgardex/asgardex-desktop/pull/232) - Fix EVM send Dollar value bug [#230] (https://github.com/asgardex/asgardex-desktop/pull/231) - Fix Mayachain liquidity charts & stats [#224] (https://github.com/asgardex/asgardex-desktop/pull/234) +- Improve Asset page performance & update Total title [#225] (https://github.com/asgardex/asgardex-desktop/pull/238) # 1.21.6 (2024-04-24) diff --git a/src/renderer/components/Bonds/table/helpers.tsx b/src/renderer/components/Bonds/table/helpers.tsx index 7bb45cda7..bfff1c2ac 100644 --- a/src/renderer/components/Bonds/table/helpers.tsx +++ b/src/renderer/components/Bonds/table/helpers.tsx @@ -2,7 +2,7 @@ import React from 'react' import { StopOutlined } from '@ant-design/icons' import { Network } from '@xchainjs/xchain-client' -import { MayaChain } from '@xchainjs/xchain-mayachain-query' +import { MAYAChain } from '@xchainjs/xchain-mayachain' import { THORChain } from '@xchainjs/xchain-thorchain' import { NodeStatusEnum } from '@xchainjs/xchain-thornode' import { Address, baseToAsset, formatAssetAmountCurrency } from '@xchainjs/xchain-util' @@ -17,7 +17,7 @@ export const NodeAddress: React.FC<{ address: Address; network: Network }> = ({ diff --git a/src/renderer/components/deposit/add/SymDeposit.tsx b/src/renderer/components/deposit/add/SymDeposit.tsx index 866c6c627..4dae35fc6 100644 --- a/src/renderer/components/deposit/add/SymDeposit.tsx +++ b/src/renderer/components/deposit/add/SymDeposit.tsx @@ -38,6 +38,7 @@ import { WalletType } from '../../../../shared/wallet/types' import { ZERO_ASSET_AMOUNT, ZERO_BASE_AMOUNT } from '../../../const' import { convertBaseAmountDecimal, + getArbTokenAddress, getAvaxTokenAddress, getBscTokenAddress, getEthTokenAddress, @@ -468,7 +469,7 @@ export const SymDeposit: React.FC = (props) => { oPoolAddress, O.chain(({ router }) => router) ) - //tobeFixed + const oTokenAddress: O.Option = (() => { switch (chain) { case ETHChain: @@ -477,6 +478,8 @@ export const SymDeposit: React.FC = (props) => { return getAvaxTokenAddress(asset) case BSCChain: return getBscTokenAddress(asset) + case ARBChain: + return getArbTokenAddress(asset) default: return O.none } diff --git a/src/renderer/components/swap/Swap.tsx b/src/renderer/components/swap/Swap.tsx index b76560ac4..fe9be4cb9 100644 --- a/src/renderer/components/swap/Swap.tsx +++ b/src/renderer/components/swap/Swap.tsx @@ -14,12 +14,7 @@ import { BSCChain } from '@xchainjs/xchain-bsc' import { Network } from '@xchainjs/xchain-client' import { ETHChain } from '@xchainjs/xchain-ethereum' import { AssetCacao } from '@xchainjs/xchain-mayachain' -import { - isCacaoAsset, - MayachainQuery, - QuoteSwap, - QuoteSwapParams as QuoteSwapParamsMaya -} from '@xchainjs/xchain-mayachain-query' +import { MayachainQuery, QuoteSwap, QuoteSwapParams as QuoteSwapParamsMaya } from '@xchainjs/xchain-mayachain-query' import { AssetRuneNative, THORChain } from '@xchainjs/xchain-thorchain' import { InboundDetail, QuoteSwapParams, ThorchainQuery, TxDetails } from '@xchainjs/xchain-thorchain-query' import { @@ -76,7 +71,8 @@ import { max1e10BaseAmount, getArbTokenAddress, isArbTokenAsset, - isAethAsset + isAethAsset, + isCacaoAsset } from '../../helpers/assetHelper' import { getChainAsset, diff --git a/src/renderer/components/wallet/assets/AssetDetails.tsx b/src/renderer/components/wallet/assets/AssetDetails.tsx index 305c77ba7..8881dc74b 100644 --- a/src/renderer/components/wallet/assets/AssetDetails.tsx +++ b/src/renderer/components/wallet/assets/AssetDetails.tsx @@ -73,8 +73,8 @@ export const AssetDetails: React.FC = (props): JSX.Element => { const intl = useIntl() const isHaltedChain = haltedChains.includes(chain) - const disableSwap = isHaltedChain || AssetHelper.isMayaAsset(asset) || asset.synth - const disableAdd = isHaltedChain || asset.synth || AssetHelper.isMayaAsset(asset) + const disableSwap = isHaltedChain || AssetHelper.isMayaAsset(asset) + const disableAdd = isHaltedChain || AssetHelper.isMayaAsset(asset) // If the chain is not halted, perform the action @@ -189,15 +189,16 @@ export const AssetDetails: React.FC = (props): JSX.Element => { disabled={disableSwap}> {intl.formatMessage({ id: 'common.swap' })} - - {intl.formatMessage({ id: 'common.manage' })} - - + {!asset.synth && ( + + {intl.formatMessage({ id: 'common.manage' })} + + )} {AssetHelper.isRuneNativeAsset(asset) && ( >) => { poolDetails={[]} poolDetailsMaya={[]} pendingPoolDetails={[]} - pendingPoolDetailsMaya={[]} + pendingPoolsDetailsMaya={[]} poolsData={{}} poolsDataMaya={{}} pricePool={RUNE_PRICE_POOL} diff --git a/src/renderer/components/wallet/assets/AssetsTableCollapsable.tsx b/src/renderer/components/wallet/assets/AssetsTableCollapsable.tsx index acaa3a27a..b5d227a91 100644 --- a/src/renderer/components/wallet/assets/AssetsTableCollapsable.tsx +++ b/src/renderer/components/wallet/assets/AssetsTableCollapsable.tsx @@ -1,14 +1,14 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react' import * as RD from '@devexperts/remote-data-ts' -import { Network } from '@xchainjs/xchain-client' +import { Balance, Network } from '@xchainjs/xchain-client' import { AssetCacao } from '@xchainjs/xchain-mayachain' -import { assetUSDC } from '@xchainjs/xchain-thorchain-query' import { Address, Asset, assetFromString, assetToString, + BaseAmount, baseAmount, baseToAsset, Chain, @@ -27,19 +27,11 @@ import { useNavigate } from 'react-router' import { Dex } from '../../../../shared/api/types' import { AssetRuneNative } from '../../../../shared/utils/asset' -import { chainToString, isChainOfMaya } from '../../../../shared/utils/chain' +import { chainToString, isChainOfMaya, isChainOfThor } from '../../../../shared/utils/chain' import { isKeystoreWallet } from '../../../../shared/utils/guard' -import { DEFAULT_WALLET_TYPE } from '../../../const' -import { - isAethAsset, - isCacaoAsset, - isDashAsset, - isKujiAsset, - isMayaAsset, - isRuneNativeAsset, - isUSDAsset -} from '../../../helpers/assetHelper' -import { getChainAsset, isArbChain } from '../../../helpers/chainHelper' +import { AssetUSDC, DEFAULT_WALLET_TYPE } from '../../../const' +import { isCacaoAsset, isMayaAsset, isRuneNativeAsset, isUSDAsset } from '../../../helpers/assetHelper' +import { getChainAsset } from '../../../helpers/chainHelper' import { getDeepestPool, getPoolPriceValue } from '../../../helpers/poolHelper' import { getPoolPriceValue as getPoolPriceValueM } from '../../../helpers/poolHelperMaya' import { hiddenString, noDataString } from '../../../helpers/stringHelper' @@ -72,6 +64,18 @@ const { Panel } = Collapse export type AssetAction = 'send' | 'deposit' +export type GetPoolPriceValueFnThor = (params: { + balance: Balance + poolDetails: PoolDetails + pricePool: PricePool +}) => O.Option + +export type GetPoolPriceValueFnMaya = (params: { + balance: Balance + poolDetails: PoolDetailsMaya + pricePool: PricePool +}) => O.Option + type Props = { disableRefresh: boolean chainBalances: ChainBalances @@ -80,7 +84,7 @@ type Props = { poolDetails: PoolDetails poolDetailsMaya: PoolDetailsMaya pendingPoolDetails: PoolDetails - pendingPoolDetailsMaya: PoolDetailsMaya + pendingPoolsDetailsMaya: PoolDetailsMaya poolsData: PoolsDataMap poolsDataMaya: PoolsDataMap selectAssetHandler: (asset: SelectedWalletAsset) => void @@ -126,32 +130,29 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { localStorage.setItem('filterByValue', JSON.stringify(filterByValue)) }, [filterByValue]) - // State to store open panel keys const [openPanelKeys, setOpenPanelKeys] = useState(() => { - // Initialize from localStorage if available const cachedKeys = localStorage.getItem('openPanelKeys') return cachedKeys ? JSON.parse(cachedKeys) : [] }) - // Effect to cache openPanelKeys changes useEffect(() => { localStorage.setItem('openPanelKeys', JSON.stringify(openPanelKeys)) }, [openPanelKeys]) const [allPanelKeys, setAllPanelKeys] = useState() - // State track that user has changed collpase state const [collapseChangedByUser, setCollapseChangedByUser] = useState(false) const [collapseAll, setCollapseAll] = useState(false) const handleRefreshClick = (chain: Chain) => { - // Assuming reloadBalancesByChain is a function that returns another function const lazyReload = reloadBalancesByChain(chain) - lazyReload() // Invoke the returned lazy function to perform the actual reload + lazyReload() } + // store previous data of asset data to render these while reloading + const previousAssetsTableData = useRef([]) + const handleCollapseAll = useCallback(() => { if (collapseAll) { - // Cache current open keys before collapsing localStorage.setItem('openPanelKeys', JSON.stringify(openPanelKeys)) setOpenPanelKeys([]) } else { @@ -159,25 +160,10 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { setOpenPanelKeys(previousOpenKeys) } setCollapseAll(!collapseAll) - // Toggle the collapseAll state }, [allPanelKeys, collapseAll, openPanelKeys]) - // store previous data of asset data to render these while reloading - const previousAssetsTableData = useRef([]) - - // // get halt status from Mimir - // const { haltTHORChain, haltETHChain, haltBNGChain } = useMemo( - // () => - // FP.pipe( - // mimirHaltRD, - // RD.getOrElse(() => ({ haltTHORChain: true, haltETHChain: true, haltBNBChain: true })) - // ), - // [mimirHaltRD] - // ) - const onRowHandler = useCallback( ({ asset, walletAddress, walletType, walletIndex, hdMode }: WalletBalance) => ({ - // Disable click for NativeRUNE if Thorchain is halted onClick: () => selectAssetHandler({ asset, walletAddress, walletType, walletIndex, hdMode }) }), [selectAssetHandler] @@ -213,76 +199,92 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { }), [] ) + const balanceColumn: ColumnType = useMemo( () => ({ render: ({ asset, amount }: WalletBalance) => { const balance = formatAssetAmountCurrency({ amount: baseToAsset(amount), asset, decimal: 3 }) let price: string = noDataString // Default to "no data" string - if (isUSDAsset(asset)) { - price = balance.toString() - } else if ( - isCacaoAsset(asset) || - isDashAsset(asset) || - isKujiAsset(asset) || - isAethAsset(asset) || - isArbChain(asset.chain) - ) { - // First try to get the price of those assets from MayaChain poolDetails - const priceOptionFromPoolDetails = getPoolPriceValueM({ - balance: { asset, amount }, - poolDetails: poolDetailsMaya, - pricePool: mayaPricePool - }) - if (O.isSome(priceOptionFromPoolDetails)) { - price = formatAssetAmountCurrency({ - amount: baseToAsset(priceOptionFromPoolDetails.value), - asset: mayaPricePool.asset, - decimal: isUSDAsset(mayaPricePool.asset) ? 2 : 4 + // Helper function to format price + const formatPrice = (priceOption: O.Option, pricePoolAsset: Asset) => { + if (O.isSome(priceOption)) { + return formatAssetAmountCurrency({ + amount: baseToAsset(priceOption.value), + asset: pricePoolAsset, + decimal: isUSDAsset(pricePoolAsset) ? 2 : 4 }) } - } else { - // Then get the price for the remaining assets from THorchain Pool Details - const priceOptionFromPoolDetails = getPoolPriceValue({ + return null + } + + // Helper function to get price from pool details + const getPriceThor = ( + getPoolPriceValueFn: GetPoolPriceValueFnThor, + poolDetails: PoolDetails, + pricePool: PricePool + ) => { + const priceOption = getPoolPriceValueFn({ balance: { asset, amount }, poolDetails, pricePool }) - if (O.isSome(priceOptionFromPoolDetails)) { - price = formatAssetAmountCurrency({ - amount: baseToAsset(priceOptionFromPoolDetails.value), - asset: pricePool.asset, - decimal: isUSDAsset(pricePool.asset) ? 2 : 4 - }) + return formatPrice(priceOption, pricePool.asset) + } + + const getPriceMaya = ( + getPoolPriceValueFn: GetPoolPriceValueFnMaya, + poolDetails: PoolDetailsMaya, + pricePool: PricePool + ) => { + const priceOption = getPoolPriceValueFn({ + balance: { asset, amount }, + poolDetails, + pricePool + }) + return formatPrice(priceOption, pricePool.asset) + } + + // USD Asset case + if (isUSDAsset(asset)) { + price = balance.toString() + } else { + if (isChainOfMaya(asset.chain) && isChainOfThor(asset.chain)) { + // Chain is supported by both MAYA and THOR, prioritize THOR + price = + getPriceThor(getPoolPriceValue, poolDetails as PoolDetails, pricePool) || + getPriceMaya(getPoolPriceValueM, poolDetailsMaya as PoolDetailsMaya, mayaPricePool) || + price + } else if (isChainOfMaya(asset.chain)) { + // Chain is supported only by MAYA + price = getPriceMaya(getPoolPriceValueM, poolDetailsMaya as PoolDetailsMaya, mayaPricePool) || price + } else if (isChainOfThor(asset.chain)) { + // Chain is supported only by THOR + price = getPriceThor(getPoolPriceValue, poolDetails as PoolDetails, pricePool) || price } else { - // If not available, try to get it from pendingPoolDetails + // Handle pending pool details const priceOptionFromPendingPoolDetails = getPoolPriceValue({ balance: { asset, amount }, poolDetails: pendingPoolDetails, pricePool }) - if (O.isSome(priceOptionFromPendingPoolDetails)) { + price = formatPrice(priceOptionFromPendingPoolDetails, pricePool.asset) || price + } + + // Special case for Maya assets + if (price === noDataString && isMayaAsset(asset)) { + const mayaPrice = calculateMayaValueInUSD(amount, mayaScanPrice) + if (RD.isSuccess(mayaPrice)) { price = formatAssetAmountCurrency({ - amount: baseToAsset(priceOptionFromPendingPoolDetails.value), - asset: pricePool.asset, - decimal: isUSDAsset(pricePool.asset) ? 2 : 4 + amount: mayaPrice.value.assetAmount, + asset: mayaPrice.value.asset, + decimal: isUSDAsset(mayaPrice.value.asset) ? 2 : 6, + trimZeros: !isUSDAsset(mayaPrice.value.asset) }) - } else { - price = noDataString - } - if (isMayaAsset(asset)) { - const mayaPrice = calculateMayaValueInUSD(amount, mayaScanPrice) - price = RD.isSuccess(mayaPrice) - ? formatAssetAmountCurrency({ - amount: mayaPrice.value.assetAmount, - asset: mayaPrice.value.asset, - decimal: isUSDAsset(mayaPrice.value.asset) ? 2 : 6, - trimZeros: !isUSDAsset(mayaPrice.value.asset) - }) - : noDataString } } } + return (
{hidePrivateData ? hiddenString : balance}
@@ -309,188 +311,131 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { O.toNullable ) - let actions: ActionButtonAction[] = [] + const createAction = (labelId: string, callback: () => void) => ({ + label: intl.formatMessage({ id: labelId }), + callback + }) + + const actions: ActionButtonAction[] = [ + createAction('wallet.action.send', () => assetHandler(walletAsset, 'send')) + ] + + if (isRuneNativeAsset(asset) && deepestPoolAsset && dex !== 'MAYA') { + actions.push( + createAction('common.swap', () => + navigate( + poolsRoutes.swap.path({ + source: assetToString(asset), + target: assetToString(deepestPoolAsset), + sourceWalletType: walletType, + targetWalletType: DEFAULT_WALLET_TYPE + }) + ) + ) + ) + } + + if (isCacaoAsset(asset) && deepestPoolAsset && dex !== 'THOR') { + actions.push( + createAction('common.swap', () => + navigate( + poolsRoutes.swap.path({ + source: assetToString(asset), + target: assetToString(deepestPoolAsset), + sourceWalletType: walletType, + targetWalletType: DEFAULT_WALLET_TYPE + }) + ) + ) + ) + } - actions = FP.pipe( - [ - { - label: intl.formatMessage({ id: 'wallet.action.send' }), - callback: () => { - assetHandler(walletAsset, 'send') - } - } - ], - // 'swap' for RUNE - A.concatW( - isRuneNativeAsset(asset) && deepestPoolAsset !== null && dex !== 'MAYA' - ? [ - { - label: intl.formatMessage({ id: 'common.swap' }), - callback: () => { - navigate( - poolsRoutes.swap.path({ - source: assetToString(asset), - target: assetToString(deepestPoolAsset), - sourceWalletType: walletType, - targetWalletType: DEFAULT_WALLET_TYPE - }) - ) - } - } - ] - : [] - ), - // 'swap' for cacao - A.concatW( - isCacaoAsset(asset) && deepestPoolAsset !== null && dex !== 'THOR' - ? [ - { - label: intl.formatMessage({ id: 'common.swap' }), - callback: () => { - navigate( - poolsRoutes.swap.path({ - source: assetToString(asset), - target: assetToString(deepestPoolAsset), - sourceWalletType: walletType, - targetWalletType: DEFAULT_WALLET_TYPE - }) - ) - } - } - ] - : [] - ), - - // 'swap' for synths assets of active pools only - A.concatW( - isSynthAsset(asset) - ? [ - { - label: intl.formatMessage({ id: 'common.swap' }), - callback: () => { - navigate( - poolsRoutes.swap.path({ - source: `${asset.chain}/${asset.symbol}`, - target: assetToString(dex === 'THOR' ? AssetRuneNative : AssetCacao), - sourceWalletType: walletType, - targetWalletType: DEFAULT_WALLET_TYPE - }) - ) - } - } - ] - : [] - ), - // 'swap' for assets of active pools only - A.concatW( - hasActivePool - ? [ - { - label: intl.formatMessage({ id: 'common.swap' }), - callback: () => { - navigate( - poolsRoutes.swap.path({ - source: assetToString(asset), - target: assetToString(isRuneNativeAsset(asset) ? AssetCacao : AssetRuneNative), - sourceWalletType: walletType, - targetWalletType: DEFAULT_WALLET_TYPE - }) - ) - } - } - ] - : [] - ), - // 'Earn' for assets of active pools only - A.concatW( - hasActivePool && dex !== 'MAYA' - ? [ - { - label: intl.formatMessage({ id: 'common.earn' }), - callback: () => { - navigate( - poolsRoutes.earn.path({ - asset: assetToString(asset), - walletType: walletType - }) - ) - } - } - ] - : [] - ), - // 'add' LP RUNE - A.concatW( - dex === 'THOR' && isRuneNativeAsset(asset) && deepestPoolAsset !== null - ? [ - { - label: intl.formatMessage({ id: 'common.add' }), - callback: () => { - navigate( - poolsRoutes.deposit.path({ - asset: assetToString(deepestPoolAsset), - assetWalletType: DEFAULT_WALLET_TYPE, - runeWalletType: walletType - }) - ) - } - } - ] - : [] - ), - // 'add' LP CACAO - A.concatW( - dex === 'MAYA' && isCacaoAsset(asset) && deepestPoolAsset !== null - ? [ - { - label: intl.formatMessage({ id: 'common.add' }), - callback: () => { - navigate( - poolsRoutes.deposit.path({ - asset: assetToString(deepestPoolAsset), - assetWalletType: DEFAULT_WALLET_TYPE, - runeWalletType: walletType - }) - ) - } - } - ] - : [] - ), - // 'add' LP for assets of active pools only - A.concatW( - hasActivePool - ? [ - { - label: intl.formatMessage({ id: 'common.add' }), - callback: () => { - navigate( - poolsRoutes.deposit.path({ - asset: assetToString(asset), - assetWalletType: walletType, - runeWalletType: DEFAULT_WALLET_TYPE - }) - ) - } - } - ] - : [] - ), - - // 'deposit' for dex chain only - A.concatW( - isRuneNativeAsset(asset) || isCacaoAsset(asset) - ? [ - { - label: intl.formatMessage({ id: 'wallet.action.deposit' }), - callback: () => { - assetHandler(walletAsset, 'deposit') - } - } - ] - : [] + if (isSynthAsset(asset)) { + actions.push( + createAction('common.swap', () => + navigate( + poolsRoutes.swap.path({ + source: `${asset.chain}/${asset.symbol}`, + target: assetToString(dex === 'THOR' ? AssetRuneNative : AssetCacao), + sourceWalletType: walletType, + targetWalletType: DEFAULT_WALLET_TYPE + }) + ) + ) ) - ) + } + + if (hasActivePool) { + actions.push( + createAction('common.swap', () => + navigate( + poolsRoutes.swap.path({ + source: assetToString(asset), + target: assetToString(isRuneNativeAsset(asset) ? AssetCacao : AssetRuneNative), + sourceWalletType: walletType, + targetWalletType: DEFAULT_WALLET_TYPE + }) + ) + ) + ) + + if (dex !== 'MAYA') { + actions.push( + createAction('common.earn', () => + navigate( + poolsRoutes.earn.path({ + asset: assetToString(asset), + walletType: walletType + }) + ) + ) + ) + } + + if (isRuneNativeAsset(asset) && dex === 'THOR' && deepestPoolAsset) { + actions.push( + createAction('common.add', () => + navigate( + poolsRoutes.deposit.path({ + asset: assetToString(deepestPoolAsset), + assetWalletType: DEFAULT_WALLET_TYPE, + runeWalletType: walletType + }) + ) + ) + ) + } + + if (isCacaoAsset(asset) && dex === 'MAYA' && deepestPoolAsset) { + actions.push( + createAction('common.add', () => + navigate( + poolsRoutes.deposit.path({ + asset: assetToString(deepestPoolAsset), + assetWalletType: DEFAULT_WALLET_TYPE, + runeWalletType: walletType + }) + ) + ) + ) + } + + actions.push( + createAction('common.add', () => + navigate( + poolsRoutes.deposit.path({ + asset: assetToString(asset), + assetWalletType: walletType, + runeWalletType: DEFAULT_WALLET_TYPE + }) + ) + ) + ) + } + + if (isRuneNativeAsset(asset) || isCacaoAsset(asset)) { + actions.push(createAction('wallet.action.deposit', () => assetHandler(walletAsset, 'deposit'))) + } return (
@@ -510,19 +455,15 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { ) const columns = useMemo(() => { - // desktop if (screenMap?.lg ?? false) { return [iconColumn, tickerColumn, balanceColumn, actionColumn] } - // tablet if (screenMap?.sm ?? false) { return [iconColumn, tickerColumn, balanceColumn, actionColumn] } - // mobile if (screenMap?.xs ?? false) { return [iconColumn, balanceColumn, actionColumn] } - return [] }, [actionColumn, balanceColumn, iconColumn, screenMap?.lg, screenMap?.sm, screenMap?.xs, tickerColumn]) @@ -547,9 +488,7 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { return FP.pipe( balancesRD, RD.fold( - // initial state () => renderAssetsTable({ tableData: [], loading: false }), - // loading state () => { const data = previousAssetsTableData.current[index] ?? [] return renderAssetsTable({ @@ -557,15 +496,11 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { loading: true }) }, - // error state ({ msg }: ApiError) => { return }, - // success state (balances) => { - let sortedBalances = balances.sort((a, b) => { - return b.amount.amount().minus(a.amount.amount()).toNumber() - }) + let sortedBalances = balances.sort((a, b) => b.amount.amount().minus(a.amount.amount()).toNumber()) if (filterByValue) { sortedBalances = sortedBalances.filter(({ amount, asset }) => { @@ -579,15 +514,12 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { return ( O.isSome(usdValue) && - new CryptoAmount(baseAmount(usdValue.value.amount()), assetUSDC).assetAmount.gt(1) + new CryptoAmount(baseAmount(usdValue.value.amount()), AssetUSDC).assetAmount.gt(1) ) }) } if ((dex === 'MAYA' && chain === 'THOR') || (dex === 'THOR' && chain === 'MAYA')) { - sortedBalances = sortedBalances.filter(({ asset }) => { - const filter = !asset.synth - return filter - }) + sortedBalances = sortedBalances.filter(({ asset }) => !asset.synth) } previousAssetsTableData.current[index] = sortedBalances return renderAssetsTable({ @@ -601,16 +533,8 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { [dex, filterByValue, poolDetails, poolDetailsMaya, pricePool, renderAssetsTable] ) - // Panel const renderPanel = useCallback( ({ chain, walletType, walletAddress: oWalletAddress, balances: balancesRD }: ChainBalance, key: number) => { - /** - * We need to push initial value to the ledger-based streams - * 'cuz chainBalances$ stream is created by 'combineLatest' - * which will not emit anything if some of stream has - * not emitted at least once - * @see btcLedgerChainBalance$'s getOrElse branch at src/renderer/services/wallet/balances.ts - */ if (O.isNone(oWalletAddress) && RD.isInitial(balancesRD)) { return null } @@ -701,11 +625,8 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { [disableRefresh, hidePrivateData, intl, renderBalances] ) - // open all panels by default useEffect(() => { - // don't change openPanelKeys if user has already changed panel state if (!collapseChangedByUser) { - // filter out empty list of balances const keys = FP.pipe( chainBalances, A.map(({ balances }) => balances), @@ -726,7 +647,6 @@ export const AssetsTableCollapsable: React.FC = (props): JSX.Element => { } else { setOpenPanelKeys([key]) } - // user has changed collpase state setCollapseChangedByUser(true) }, []) diff --git a/src/renderer/components/wallet/txs/interact/InteractFormMaya.tsx b/src/renderer/components/wallet/txs/interact/InteractFormMaya.tsx index 0e6e2a635..c822d2d50 100644 --- a/src/renderer/components/wallet/txs/interact/InteractFormMaya.tsx +++ b/src/renderer/components/wallet/txs/interact/InteractFormMaya.tsx @@ -4,7 +4,7 @@ import * as RD from '@devexperts/remote-data-ts' import { MagnifyingGlassMinusIcon, MagnifyingGlassPlusIcon } from '@heroicons/react/24/outline' import { Network } from '@xchainjs/xchain-client' import { AssetCacao, CACAO_DECIMAL, MAYAChain } from '@xchainjs/xchain-mayachain' -import { MayaChain, MayachainQuery } from '@xchainjs/xchain-mayachain-query' +import { MayachainQuery } from '@xchainjs/xchain-mayachain-query' import { PoolDetails } from '@xchainjs/xchain-mayamidgard' import { MAYANameDetails } from '@xchainjs/xchain-mayamidgard-query' import { @@ -486,7 +486,7 @@ export const InteractFormMaya: React.FC = (props) => { onSuccess={onSuccessHandler} onClose={onCloseHandler} visible={showConfirmationModal} - chain={MayaChain} + chain={MAYAChain} description2={intl.formatMessage({ id: 'ledger.sign' })} addresses={O.none} /> diff --git a/src/renderer/components/wallet/txs/interact/InteractFormThor.tsx b/src/renderer/components/wallet/txs/interact/InteractFormThor.tsx index 3ff922442..947e0efa1 100644 --- a/src/renderer/components/wallet/txs/interact/InteractFormThor.tsx +++ b/src/renderer/components/wallet/txs/interact/InteractFormThor.tsx @@ -5,7 +5,7 @@ import { MagnifyingGlassMinusIcon, MagnifyingGlassPlusIcon } from '@heroicons/re import { Network } from '@xchainjs/xchain-client' import { PoolDetails } from '@xchainjs/xchain-midgard' import { THORChain } from '@xchainjs/xchain-thorchain' -import { AssetDOGE, QuoteThornameParams, ThorchainQuery, ThornameDetails } from '@xchainjs/xchain-thorchain-query' +import { QuoteThornameParams, ThorchainQuery, ThornameDetails } from '@xchainjs/xchain-thorchain-query' import { Asset, assetAmount, @@ -26,7 +26,7 @@ import * as O from 'fp-ts/lib/Option' import { debounce } from 'lodash' import { useIntl } from 'react-intl' -import { AssetAVAX, AssetBTC, AssetETH, AssetRuneNative } from '../../../../../shared/utils/asset' +import { AssetAVAX, AssetBTC, AssetDOGE, AssetETH, AssetRuneNative } from '../../../../../shared/utils/asset' import { isKeystoreWallet, isLedgerWallet } from '../../../../../shared/utils/guard' import { HDMode, WalletType } from '../../../../../shared/wallet/types' import { AssetUSDTDAC, ZERO_BASE_AMOUNT } from '../../../../const' diff --git a/src/renderer/hooks/useWalletBalance.ts b/src/renderer/hooks/useWalletBalance.ts index bd34d2fcb..378da4395 100644 --- a/src/renderer/hooks/useWalletBalance.ts +++ b/src/renderer/hooks/useWalletBalance.ts @@ -14,6 +14,11 @@ import { to1e8BaseAmount } from '../helpers/assetHelper' import { getPoolPriceValue } from '../helpers/poolHelper' import { getPoolPriceValue as getPoolPriceValueM } from '../helpers/poolHelperMaya' +interface BalancesAndErrors { + balancesByChain: Record + errorsByChain: Record +} + export const useTotalWalletBalance = () => { const { chainBalances$ } = useWalletContext() const { @@ -55,7 +60,6 @@ export const useTotalWalletBalance = () => { }, (walletBalances) => { // Calculate the total balance for the chain - const totalForChain = walletBalances.reduce((acc, { asset, amount }) => { let value = getPoolPriceValue({ balance: { asset, amount }, @@ -82,7 +86,10 @@ export const useTotalWalletBalance = () => { }) ) - const balancesAndErrors = useObservableState(balancesAndErrors$, { balancesByChain: {}, errorsByChain: {} }) + const balancesAndErrors: BalancesAndErrors = useObservableState(balancesAndErrors$, { + balancesByChain: {}, + errorsByChain: {} + }) return balancesAndErrors } diff --git a/src/renderer/i18n/de/wallet.ts b/src/renderer/i18n/de/wallet.ts index 5bb60dc2d..ac7a4424c 100644 --- a/src/renderer/i18n/de/wallet.ts +++ b/src/renderer/i18n/de/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.create': 'Erstellen', 'wallet.action.connect': 'Verbinden', 'wallet.action.deposit': 'Einzahlung', - 'wallet.balance.total.poolAssets': 'Gesamtguthaben von Pool Assets', + 'wallet.balance.total.poolAssets': 'Gesamtbilanz der Wallet-Assets', 'wallet.balance.total.poolAssets.info': - 'Die Gesamtsumme beinhaltet das Guthaben aller Assets, welche bei THORChain in Pools verfügbar sind. Nur über Pools können Preise bei THORChain ermittelt werden.', + 'Gesamtbilanz der Wallet-Assets unter Verwendung von Pooldaten von Thorchain & Mayachain. Nur über Pools können Preise bei THORChain ermittelt werden.', 'wallet.shares.total': 'Gesamtwert', 'wallet.connect.instruction': 'Bitte verbinde Deine Wallet', 'wallet.lock.label': 'Wallet sperren', diff --git a/src/renderer/i18n/en/wallet.ts b/src/renderer/i18n/en/wallet.ts index ac49f4158..bdf2de980 100644 --- a/src/renderer/i18n/en/wallet.ts +++ b/src/renderer/i18n/en/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.import': 'Import', 'wallet.action.create': 'Create', 'wallet.action.deposit': 'Deposit', - 'wallet.balance.total.poolAssets': 'Total balance of pool assets', + 'wallet.balance.total.poolAssets': 'Total balance of wallet assets', 'wallet.balance.total.poolAssets.info': - 'Total balance includes balances of assets available in pools at THORChain & MAYAChain. Pools are source of truth to determine prices at THORChain & MAYAchain', + 'Total balance of wallet assets using pool data from Thorchain & Mayachain. Pools are source of truth to determine prices at THORChain & MAYAchain', 'wallet.shares.total': 'Total value', 'wallet.connect.instruction': 'Please connect your wallet', 'wallet.lock.label': 'Lock wallet', diff --git a/src/renderer/i18n/es/wallet.ts b/src/renderer/i18n/es/wallet.ts index 724576635..da1eda0c2 100644 --- a/src/renderer/i18n/es/wallet.ts +++ b/src/renderer/i18n/es/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.import': 'Importar', 'wallet.action.create': 'Cree', 'wallet.action.deposit': 'Depósito', - 'wallet.balance.total.poolAssets': 'Saldo total de los activos comunes', + 'wallet.balance.total.poolAssets': 'Saldo total de los activos de la billetera', 'wallet.balance.total.poolAssets.info': - 'El saldo total incluye los saldos de activos disponibles en pools en THORChain & MAYAChain. Los pools son la fuente de la verdad para determinar los precios en THORChain y MAYAchain.', + 'Saldo total de los activos de la billetera utilizando datos de pool de Thorchain & Mayachain. Los pools son la fuente de la verdad para determinar los precios en THORChain y MAYAchain.', 'wallet.shares.total': 'Valor total', 'wallet.connect.instruction': 'Conecte su monedero', 'wallet.lock.label': 'Cartera de cerraduras', diff --git a/src/renderer/i18n/fr/wallet.ts b/src/renderer/i18n/fr/wallet.ts index 46d639541..53d55e155 100644 --- a/src/renderer/i18n/fr/wallet.ts +++ b/src/renderer/i18n/fr/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.import': 'Importer', 'wallet.action.create': 'Créer', 'wallet.action.deposit': 'Déposer', - 'wallet.balance.total.poolAssets': 'Solde total des actifs en pools', + 'wallet.balance.total.poolAssets': 'Solde total des actifs du portefeuille', 'wallet.balance.total.poolAssets.info': - 'Le solde total comprend les soldes des actifs disponibles dans les pools de THORChain uniquement. Les pools sont une source de vérité pour déterminer les prix chez THORChain.', + 'Solde total des actifs du portefeuille en utilisant les données des pools de Thorchain & Mayachain. Les pools sont une source de vérité pour déterminer les prix chez THORChain.', 'wallet.shares.total': 'Valeur totale', 'wallet.connect.instruction': 'Veuillez connecter votre portefeuille', 'wallet.lock.label': 'Verrouiller le portefeuille', diff --git a/src/renderer/i18n/hi/wallet.ts b/src/renderer/i18n/hi/wallet.ts index a907edfff..1c53ec4e2 100644 --- a/src/renderer/i18n/hi/wallet.ts +++ b/src/renderer/i18n/hi/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.import': 'आयात करें', 'wallet.action.create': 'बनाएं', 'wallet.action.deposit': 'जमा करें', - 'wallet.balance.total.poolAssets': 'पूल संपत्तियों का कुल बैलेंस', + 'wallet.balance.total.poolAssets': 'वॉलेट संपत्तियों का कुल बैलेंस', 'wallet.balance.total.poolAssets.info': - 'कुल बैलेंस में THORChain पर पूलों में उपलब्ध संपत्तियों के बैलेंस शामिल हैं। पूल ही THORChain में कीमतों को निर्धारित करने के स्रोत हैं।', + 'Thorchain और Mayachain के पूल डेटा का उपयोग करके वॉलेट संपत्तियों का कुल बैलेंस। THORChain और MAYAchain पर कीमतें निर्धारित करने के लिए पूल सत्य के स्रोत हैं।', 'wallet.shares.total': 'कुल मूल्य', 'wallet.connect.instruction': 'कृपया अपना वॉलेट कनेक्ट करें', 'wallet.lock.label': 'वॉलेट लॉक करें', diff --git a/src/renderer/i18n/ru/wallet.ts b/src/renderer/i18n/ru/wallet.ts index 0a66e40b1..da413ea22 100644 --- a/src/renderer/i18n/ru/wallet.ts +++ b/src/renderer/i18n/ru/wallet.ts @@ -21,9 +21,9 @@ const wallet: WalletMessages = { 'wallet.action.create': 'Создать', 'wallet.action.connect': 'Подключить', 'wallet.action.deposit': 'Вложить', - 'wallet.balance.total.poolAssets': 'Общий баланс активов пула', + 'wallet.balance.total.poolAssets': 'Общий баланс активов кошелька', 'wallet.balance.total.poolAssets.info': - 'Общий баланс включает остатки активов, доступных только в пулах THORChain. Пулы являются источником истины для определения цен в THORChain.', + 'Общий баланс активов кошелька с использованием данных пулов от Thorchain & Mayachain. Пулы являются источником истины для определения цен в THORChain.', 'wallet.shares.total': 'Итоговая стоимость', 'wallet.connect.instruction': 'Пожалуйста подключите ваш кошелёк', 'wallet.lock.label': 'Заблокировать кошелёк', diff --git a/src/renderer/services/midgard/utils.test.ts b/src/renderer/services/midgard/utils.test.ts index 55d986548..81be57101 100644 --- a/src/renderer/services/midgard/utils.test.ts +++ b/src/renderer/services/midgard/utils.test.ts @@ -7,7 +7,6 @@ import { GAIAChain } from '@xchainjs/xchain-cosmos' import { ETH_GAS_ASSET_DECIMAL as ETH_DECIMAL } from '@xchainjs/xchain-ethereum' import { ETHChain } from '@xchainjs/xchain-ethereum' import { LTCChain } from '@xchainjs/xchain-litecoin' -import { BtcChain } from '@xchainjs/xchain-mayachain-query' import { PoolDetail } from '@xchainjs/xchain-midgard' import { THORChain } from '@xchainjs/xchain-thorchain' import { assetAmount, assetToBase, assetToString, baseAmount, bn } from '@xchainjs/xchain-util' @@ -495,7 +494,7 @@ describe('services/midgard/utils/', () => { describe('getOutboundAssetFeeByChain', () => { const data: { chain: Chain; outbound_fee?: string }[] = [ - { chain: BtcChain, outbound_fee: '1' }, + { chain: BTCChain, outbound_fee: '1' }, { chain: ETHChain, outbound_fee: '2' }, { chain: GAIAChain, outbound_fee: '300' }, { chain: LTCChain }, // no value diff --git a/src/renderer/services/wallet/util.test.ts b/src/renderer/services/wallet/util.test.ts index c7193cde9..6fe9adefc 100644 --- a/src/renderer/services/wallet/util.test.ts +++ b/src/renderer/services/wallet/util.test.ts @@ -1,9 +1,8 @@ -import { AssetBSC, AssetDOGE } from '@xchainjs/xchain-thorchain-query' import { baseAmount } from '@xchainjs/xchain-util' import * as O from 'fp-ts/lib/Option' import { ASSETS_MAINNET } from '../../../shared/mock/assets' -import { AssetBTC, AssetETH, AssetRuneNative } from '../../../shared/utils/asset' +import { AssetBSC, AssetBTC, AssetDOGE, AssetETH, AssetRuneNative } from '../../../shared/utils/asset' import { eqOWalletBalance, eqWalletBalances } from '../../helpers/fp/eq' import { WalletBalances } from '../clients' import { KeystoreState } from './types' diff --git a/src/renderer/views/deposit/add/SymDepositView.tsx b/src/renderer/views/deposit/add/SymDepositView.tsx index e2d50818f..a4342b055 100644 --- a/src/renderer/views/deposit/add/SymDepositView.tsx +++ b/src/renderer/views/deposit/add/SymDepositView.tsx @@ -4,7 +4,6 @@ import * as RD from '@devexperts/remote-data-ts' import { BTCChain } from '@xchainjs/xchain-bitcoin' import { Network } from '@xchainjs/xchain-client' import { AssetCacao, MAYAChain } from '@xchainjs/xchain-mayachain' -import { MayaChain } from '@xchainjs/xchain-mayachain-query' import { THORChain } from '@xchainjs/xchain-thorchain' import { Asset, assetToString } from '@xchainjs/xchain-util' import * as FP from 'fp-ts/function' @@ -191,7 +190,7 @@ export const SymDepositView: React.FC = (props) => { ) const { openExplorerTxUrl: openRuneExplorerTxUrl, getExplorerTxUrl: getRuneExplorerTxUrl } = useOpenExplorerTxUrl( - O.some(dex === 'THOR' ? THORChain : MayaChain) + O.some(dex === 'THOR' ? THORChain : MAYAChain) ) const protocolLimitReached = useMemo( diff --git a/src/renderer/views/pools/Pools.util.test.ts b/src/renderer/views/pools/Pools.util.test.ts index 6c6018be7..7d36bd095 100644 --- a/src/renderer/views/pools/Pools.util.test.ts +++ b/src/renderer/views/pools/Pools.util.test.ts @@ -2,13 +2,12 @@ import { BTCChain } from '@xchainjs/xchain-bitcoin' import { BSCChain } from '@xchainjs/xchain-bsc' import { Network } from '@xchainjs/xchain-client' import { PoolDetail } from '@xchainjs/xchain-midgard' -import { AssetAVAX } from '@xchainjs/xchain-thorchain-query' import { assetAmount, assetToBase } from '@xchainjs/xchain-util' import * as FP from 'fp-ts/lib/function' import * as O from 'fp-ts/lib/Option' import { ASSETS_MAINNET, ERC20_TESTNET } from '../../../shared/mock/assets' -import { AssetBCH, AssetBTC, AssetETH, AssetLTC } from '../../../shared/utils/asset' +import { AssetAVAX, AssetBCH, AssetBTC, AssetETH, AssetLTC } from '../../../shared/utils/asset' import { AssetUSDC, AssetUSDT62E, AssetUSDTDAC } from '../../const' import { GetPoolsStatusEnum } from '../../services/midgard/types' import { LastblockItems } from '../../services/thorchain/types' diff --git a/src/renderer/views/savers/SaversView.tsx b/src/renderer/views/savers/SaversView.tsx index 0bdabac7e..f964bd4f5 100644 --- a/src/renderer/views/savers/SaversView.tsx +++ b/src/renderer/views/savers/SaversView.tsx @@ -4,7 +4,7 @@ import * as RD from '@devexperts/remote-data-ts' import { Tab } from '@headlessui/react' import { BTCChain } from '@xchainjs/xchain-bitcoin' import { Network } from '@xchainjs/xchain-client' -import { THORChain } from '@xchainjs/xchain-thorchain-query' +import { THORChain } from '@xchainjs/xchain-thorchain' import { Address, Asset, assetToString, baseAmount, Chain, CryptoAmount } from '@xchainjs/xchain-util' import * as A from 'fp-ts/lib/Array' import * as Eq from 'fp-ts/lib/Eq' diff --git a/src/renderer/views/swap/SwapView.tsx b/src/renderer/views/swap/SwapView.tsx index aaf6884f7..d87812ec9 100644 --- a/src/renderer/views/swap/SwapView.tsx +++ b/src/renderer/views/swap/SwapView.tsx @@ -3,7 +3,7 @@ import React, { useCallback, useEffect, useMemo } from 'react' import * as RD from '@devexperts/remote-data-ts' import { BTCChain } from '@xchainjs/xchain-bitcoin' import { Network } from '@xchainjs/xchain-client' -import { MayaChain } from '@xchainjs/xchain-mayachain-query' +import { MAYAChain } from '@xchainjs/xchain-mayachain' import { THORChain } from '@xchainjs/xchain-thorchain' import { Address, Asset, assetToString, bn, Chain, baseAmount } from '@xchainjs/xchain-util' import * as FP from 'fp-ts/function' @@ -227,7 +227,7 @@ const SuccessRouteView: React.FC = ({ }, [targetChain, updateTargetKeystoreAddress$]) const { openExplorerTxUrl, getExplorerTxUrl } = useOpenExplorerTxUrl( - dex === 'THOR' ? O.some(THORChain) : O.some(MayaChain) + dex === 'THOR' ? O.some(THORChain) : O.some(MAYAChain) ) const renderError = useCallback( diff --git a/src/renderer/views/wallet/AssetDetailsView.tsx b/src/renderer/views/wallet/AssetDetailsView.tsx index 8ad622344..c326c627a 100644 --- a/src/renderer/views/wallet/AssetDetailsView.tsx +++ b/src/renderer/views/wallet/AssetDetailsView.tsx @@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useMemo } from 'react' import * as RD from '@devexperts/remote-data-ts' import { XChainClient } from '@xchainjs/xchain-client' -import { MayaChain } from '@xchainjs/xchain-mayachain-query' +import { MAYAChain } from '@xchainjs/xchain-mayachain' import { THORChain } from '@xchainjs/xchain-thorchain' import * as FP from 'fp-ts/function' import * as O from 'fp-ts/lib/Option' @@ -132,7 +132,7 @@ export const AssetDetailsView: React.FC = (): JSX.Element => { const { openExplorerTxUrl } = useOpenExplorerTxUrl( FP.pipe( oSelectedAsset, - O.map(({ asset }) => (asset.synth ? (dex === 'THOR' ? THORChain : MayaChain) : asset.chain)) + O.map(({ asset }) => (asset.synth ? (dex === 'THOR' ? THORChain : MAYAChain) : asset.chain)) ) ) diff --git a/src/renderer/views/wallet/AssetsView.tsx b/src/renderer/views/wallet/AssetsView.tsx index df5c2b56e..a99fac1b8 100644 --- a/src/renderer/views/wallet/AssetsView.tsx +++ b/src/renderer/views/wallet/AssetsView.tsx @@ -39,12 +39,9 @@ export const AssetsView: React.FC = (): JSX.Element => { const intl = useIntl() const { chainBalances$, balancesState$, setSelectedAsset } = useWalletContext() - const { network } = useNetwork() const { dex } = useDex() - const { mayaScanPriceRD } = useMayaScanPrice() - const { isPrivate } = usePrivateData() const [chainBalances] = useObservableState( @@ -54,7 +51,6 @@ export const AssetsView: React.FC = (): JSX.Element => { RxOp.map((chainBalances) => FP.pipe( chainBalances, - // we show all balances A.filter(({ balancesType }) => balancesType === 'all') ) ) @@ -64,21 +60,19 @@ export const AssetsView: React.FC = (): JSX.Element => { const getChainWeight = (chain: Chain, dex: Dex) => { const weights = dex === 'THOR' ? CHAIN_WEIGHTS_THOR : CHAIN_WEIGHTS_MAYA - - // If the chain is enabled, use its defined weight, otherwise sort it to the end return isEnabledChain(chain) ? weights[chain] : Infinity } - const sortedBalances = chainBalances.sort((a, b) => { - const weightA = getChainWeight(a.chain, dex) // selectedDex should be either 'MAYA' or 'THOR' - const weightB = getChainWeight(b.chain, dex) - return weightA - weightB - }) + const sortedBalances = useMemo( + () => chainBalances.sort((a, b) => getChainWeight(a.chain, dex) - getChainWeight(b.chain, dex)), + [chainBalances, dex] + ) const [{ loading: loadingBalances }] = useObservableState( () => balancesState$(DEFAULT_BALANCES_FILTER), INITIAL_BALANCES_STATE ) + const { service: { pools: { poolsState$, selectedPricePool$, pendingPoolsState$ } @@ -95,15 +89,11 @@ export const AssetsView: React.FC = (): JSX.Element => { } = useMidgardMayaContext() const selectedPricePoolMaya = useObservableState(mayaSelectedPricePool$, MAYA_PRICE_POOL) - const poolsMayaRD = useObservableState(mayaPoolsState$, RD.pending) - const { balancesByChain, errorsByChain } = useTotalWalletBalance() - const poolsRD = useObservableState(poolsState$, RD.pending) const pendingPoolsThorRD = useObservableState(pendingPoolsState$, RD.pending) const pendingPoolsMayaRD = useObservableState(pendingPoolsStateMaya$, RD.pending) - const selectedPricePool = useObservableState(selectedPricePool$, RUNE_PRICE_POOL) const selectAssetHandler = useCallback( @@ -129,14 +119,15 @@ export const AssetsView: React.FC = (): JSX.Element => { [navigate, setSelectedAsset] ) - const poolDetails = RD.toNullable(poolsRD)?.poolDetails ?? [] - const poolDetailsMaya = RD.toNullable(poolsMayaRD)?.poolDetails ?? [] - const poolsData = RD.toNullable(poolsRD)?.poolsData ?? {} - const poolsDataMaya = RD.toNullable(poolsMayaRD)?.poolsData ?? {} - - const pendingPoolsDetails = RD.toNullable(pendingPoolsThorRD)?.poolDetails ?? [] - const pendingPoolsDetailsMaya = RD.toNullable(pendingPoolsMayaRD)?.poolDetails ?? [] - + const poolDetails = useMemo(() => RD.toNullable(poolsRD)?.poolDetails ?? [], [poolsRD]) + const poolDetailsMaya = useMemo(() => RD.toNullable(poolsMayaRD)?.poolDetails ?? [], [poolsMayaRD]) + const poolsData = useMemo(() => RD.toNullable(poolsRD)?.poolsData ?? {}, [poolsRD]) + const poolsDataMaya = useMemo(() => RD.toNullable(poolsMayaRD)?.poolsData ?? {}, [poolsMayaRD]) + const pendingPoolsDetails = useMemo(() => RD.toNullable(pendingPoolsThorRD)?.poolDetails ?? [], [pendingPoolsThorRD]) + const pendingPoolsDetailsMaya = useMemo( + () => RD.toNullable(pendingPoolsMayaRD)?.poolDetails ?? [], + [pendingPoolsMayaRD] + ) const { mimirHaltRD } = useMimirHalt() const disableRefresh = useMemo(() => RD.isPending(poolsRD) || loadingBalances, [loadingBalances, poolsRD]) @@ -185,7 +176,7 @@ export const AssetsView: React.FC = (): JSX.Element => { poolDetails={poolDetails} poolDetailsMaya={poolDetailsMaya} pendingPoolDetails={pendingPoolsDetails} - pendingPoolDetailsMaya={pendingPoolsDetailsMaya} + pendingPoolsDetailsMaya={pendingPoolsDetailsMaya} poolsData={poolsData} poolsDataMaya={poolsDataMaya} selectAssetHandler={selectAssetHandler} diff --git a/src/shared/utils/chain.test.ts b/src/shared/utils/chain.test.ts index 422bf0f43..3e06f473d 100755 --- a/src/shared/utils/chain.test.ts +++ b/src/shared/utils/chain.test.ts @@ -7,7 +7,7 @@ import { GAIAChain } from '@xchainjs/xchain-cosmos' import { DOGEChain } from '@xchainjs/xchain-doge' import { ETHChain } from '@xchainjs/xchain-ethereum' import { LTCChain } from '@xchainjs/xchain-litecoin' -import { MayaChain } from '@xchainjs/xchain-mayachain-query' +import { MAYAChain } from '@xchainjs/xchain-mayachain' import { THORChain } from '@xchainjs/xchain-thorchain' import { chainToString, isEnabledChain } from './chain' @@ -61,7 +61,7 @@ describe('chain', () => { expect(chainToString(ARBChain)).toEqual('Arbitrum') }) it('MAYA', () => { - expect(chainToString(MayaChain)).toEqual('MAYAChain') + expect(chainToString(MAYAChain)).toEqual('MAYAChain') }) }) }) diff --git a/src/shared/utils/chain.ts b/src/shared/utils/chain.ts index 270a88724..af3c4ca73 100644 --- a/src/shared/utils/chain.ts +++ b/src/shared/utils/chain.ts @@ -11,7 +11,6 @@ import { KUJIChain } from '@xchainjs/xchain-kujira' import { LTCChain } from '@xchainjs/xchain-litecoin' import { MAYAChain } from '@xchainjs/xchain-mayachain' import { THORChain } from '@xchainjs/xchain-thorchain' -import { ChainAttributes } from '@xchainjs/xchain-thorchain-query' import { Chain } from '@xchainjs/xchain-util' /** @@ -106,6 +105,14 @@ export const chainToString = (chain: Chain): string => { } } +/** + * Represents chain attributes. + */ +export type ChainAttributes = { + blockReward: number + avgBlockTimeInSecs: number +} + export const DefaultChainAttributes: Record = { BCH: { blockReward: 6.25,