diff --git a/package.json b/package.json
index 3ac202d6d1..db175d0d7d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "interbtc-ui",
- "version": "2.29.1",
+ "version": "2.29.3",
"private": true,
"dependencies": {
"@craco/craco": "^6.1.1",
diff --git a/src/App.tsx b/src/App.tsx
index fc2f89f241..3a16fbf509 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -215,7 +215,7 @@ const App = (): JSX.Element => {
-
+
diff --git a/src/pages/Staking/index.tsx b/src/pages/Staking/index.tsx
index d56075801e..15914d27ff 100644
--- a/src/pages/Staking/index.tsx
+++ b/src/pages/Staking/index.tsx
@@ -319,10 +319,11 @@ const Staking = (): JSX.Element => {
React.useEffect(() => {
if (!lockTime) return;
+ if (!currentBlockNumber) return;
const lockTimeValue = Number(lockTime);
- setBlockLockTimeExtension(convertWeeksToBlockNumbers(lockTimeValue));
- }, [lockTime]);
+ setBlockLockTimeExtension(currentBlockNumber + convertWeeksToBlockNumbers(lockTimeValue));
+ }, [currentBlockNumber, lockTime]);
React.useEffect(() => {
reset({
diff --git a/src/pages/Transfer/CrossChainTransferForm/index.tsx b/src/pages/Transfer/CrossChainTransferForm/index.tsx
index c5f88a6cda..16dbf590aa 100644
--- a/src/pages/Transfer/CrossChainTransferForm/index.tsx
+++ b/src/pages/Transfer/CrossChainTransferForm/index.tsx
@@ -131,7 +131,7 @@ const CrossChainTransferForm = (): JSX.Element => {
const availableFromChains: Array = XCMBridge.adapters.map((adapter: any) => {
return {
type: adapter.chain.id,
- name: adapter.chain.id,
+ name: adapter.chain.display,
icon:
};
});
@@ -149,7 +149,7 @@ const CrossChainTransferForm = (): JSX.Element => {
const availableToChains = destinationChains.map((chain: any) => {
return {
type: chain.id,
- name: chain.id,
+ name: chain.display,
icon:
};
});
diff --git a/src/pages/Wallet/WalletOverview/components/WalletInsights/WalletInsights.tsx b/src/pages/Wallet/WalletOverview/components/WalletInsights/WalletInsights.tsx
index 234b4368db..ddbfbe04d3 100644
--- a/src/pages/Wallet/WalletOverview/components/WalletInsights/WalletInsights.tsx
+++ b/src/pages/Wallet/WalletOverview/components/WalletInsights/WalletInsights.tsx
@@ -5,6 +5,8 @@ import { convertMonetaryAmountToValueInUSD, formatUSD } from '@/common/utils/uti
import { Card, Dd, Dl, DlGroup, Dt, theme } from '@/component-library';
import { useMediaQuery } from '@/component-library/utils/use-media-query';
import { getTokenPrice } from '@/utils/helpers/prices';
+import { useGetAccountPools } from '@/utils/hooks/api/amm/use-get-account-pools';
+import { useGetAccountLendingStatistics } from '@/utils/hooks/api/loans/use-get-account-lending-statistics';
import { BalanceData } from '@/utils/hooks/api/tokens/use-get-balances';
import { useGetPrices } from '@/utils/hooks/api/use-get-prices';
@@ -18,9 +20,12 @@ const WalletInsights = ({ balances }: WalletInsightsProps): JSX.Element => {
const { t } = useTranslation();
const prices = useGetPrices();
+ const { data: accountLendingStatistics } = useGetAccountLendingStatistics();
+ const { data: accountPools } = useGetAccountPools();
+
const isMobile = useMediaQuery(theme.breakpoints.down('md'));
- const totalBalance =
+ const rawBalance =
balances &&
Object.values(balances).reduce(
(total, balance) =>
@@ -33,9 +38,14 @@ const WalletInsights = ({ balances }: WalletInsightsProps): JSX.Element => {
new Big(0)
);
+ const totalBalance = rawBalance
+ ?.add(accountLendingStatistics?.supplyAmountUSD || 0)
+ .sub(accountLendingStatistics?.borrowAmountUSD || 0)
+ .add(accountPools?.accountLiquidityUSD || 0);
+
const totalBalanceLabel = totalBalance ? formatUSD(totalBalance.toNumber(), { compact: true }) : '-';
- const transfarableBalance =
+ const transferableBalance =
balances &&
Object.values(balances).reduce(
(total, balance) =>
@@ -48,8 +58,8 @@ const WalletInsights = ({ balances }: WalletInsightsProps): JSX.Element => {
new Big(0)
);
- const transfarableBalanceLabel = transfarableBalance
- ? formatUSD(transfarableBalance.toNumber(), { compact: true })
+ const transferableBalanceLabel = transferableBalance
+ ? formatUSD(transferableBalance.toNumber(), { compact: true })
: '-';
return (
@@ -73,7 +83,7 @@ const WalletInsights = ({ balances }: WalletInsightsProps): JSX.Element => {
{t('transferable_balance')}
- {transfarableBalanceLabel}
+ {transferableBalanceLabel}
diff --git a/src/utils/hooks/api/amm/use-get-account-pools.tsx b/src/utils/hooks/api/amm/use-get-account-pools.tsx
index 4c38e495db..2d440ddbae 100644
--- a/src/utils/hooks/api/amm/use-get-account-pools.tsx
+++ b/src/utils/hooks/api/amm/use-get-account-pools.tsx
@@ -1,10 +1,13 @@
import { CurrencyExt, isCurrencyEqual, LiquidityPool, LpCurrency } from '@interlay/interbtc-api';
import { MonetaryAmount } from '@interlay/monetary-js';
import { AccountId } from '@polkadot/types/interfaces';
+import Big from 'big.js';
import { useErrorHandler } from 'react-error-boundary';
import { useQuery } from 'react-query';
+import { calculateAccountLiquidityUSD, calculateTotalLiquidityUSD } from '@/pages/AMM/shared/utils';
import { BLOCKTIME_REFETCH_INTERVAL } from '@/utils/constants/api';
+import { Prices, useGetPrices } from '@/utils/hooks/api/use-get-prices';
import useAccountId from '../../use-account-id';
import { useGetLiquidityPools } from './use-get-liquidity-pools';
@@ -14,9 +17,14 @@ type AccountLiquidityPool = { data: LiquidityPool; amount: MonetaryAmount[]>;
+ accountLiquidityUSD: Big;
}
-const getAccountLiqudityPools = async (accountId: AccountId, pools: LiquidityPool[]): Promise => {
+const getAccountLiqudityPools = async (
+ accountId: AccountId,
+ pools: LiquidityPool[],
+ prices: Prices
+): Promise => {
const accountLiquidityPools = await window.bridge.amm.getLiquidityProvidedByAccount(accountId);
const claimableRewards = await window.bridge.amm.getClaimableFarmingRewards(accountId, accountLiquidityPools, pools);
const filteredPools = accountLiquidityPools.filter((lpToken) => !lpToken.isZero());
@@ -31,7 +39,18 @@ const getAccountLiqudityPools = async (accountId: AccountId, pools: LiquidityPoo
return [...acc, data];
}, []);
- return { positions, claimableRewards };
+ const accountLiquidityUSD = positions
+ .map(({ data, amount: accountLPTokenAmount }) => {
+ const { pooledCurrencies, totalSupply } = data;
+ const totalLiquidityUSD = calculateTotalLiquidityUSD(pooledCurrencies, prices);
+
+ return accountLPTokenAmount
+ ? calculateAccountLiquidityUSD(accountLPTokenAmount, totalLiquidityUSD, totalSupply)
+ : 0;
+ })
+ .reduce((total, accountLPTokenAmount) => total.add(accountLPTokenAmount), new Big(0));
+
+ return { positions, claimableRewards, accountLiquidityUSD };
};
interface UseGetAccountProvidedLiquidity {
@@ -42,12 +61,13 @@ interface UseGetAccountProvidedLiquidity {
// Mixes current pools with liquidity provided by the account
const useGetAccountPools = (): UseGetAccountProvidedLiquidity => {
const accountId = useAccountId();
+ const prices = useGetPrices();
const { data: liquidityPools, refetch: refetchLiquidityPools } = useGetLiquidityPools();
const queryKey = ['account-pools', accountId];
const { data, error, refetch: refetchQuery } = useQuery({
queryKey: ['account-pools', accountId],
- queryFn: () => accountId && liquidityPools && getAccountLiqudityPools(accountId, liquidityPools),
+ queryFn: () => accountId && liquidityPools && prices && getAccountLiqudityPools(accountId, liquidityPools, prices),
enabled: !!liquidityPools,
refetchInterval: BLOCKTIME_REFETCH_INTERVAL
});