diff --git a/apps/frontend/src/components/InputDialog/index.tsx b/apps/frontend/src/components/InputDialog/index.tsx
index 069438c8..5ca20019 100644
--- a/apps/frontend/src/components/InputDialog/index.tsx
+++ b/apps/frontend/src/components/InputDialog/index.tsx
@@ -53,7 +53,7 @@ export const InputDialog = () => {
} = useMarketStore();
const { data: priceData } = usePrice();
- const marketBalanceOfBase = useMarketBalanceOfBase();
+ const { data: marketBalanceOfBase } = useMarketBalanceOfBase();
const { mutate: supplyCollateral } = useSupplyCollateral({
actionTokenAssetId,
diff --git a/apps/frontend/src/components/MarketsView/MarketOverview.tsx b/apps/frontend/src/components/MarketsView/MarketOverview.tsx
index 41755ebb..3150a835 100644
--- a/apps/frontend/src/components/MarketsView/MarketOverview.tsx
+++ b/apps/frontend/src/components/MarketsView/MarketOverview.tsx
@@ -46,14 +46,14 @@ export default function MarketOverview({
}: MarketOverviewProps) {
const { data: borrowRate } = useBorrowRate(baseAsset);
const { data: supplyRate } = useSupplyRate(baseAsset);
- const { data: totalReserves } = useTotalReserves(baseAsset);
+ const { data: totalReserves } = useTotalReserves();
const { data: collateralConfigurations } =
useCollateralConfigurations(baseAsset);
const { data: marketConfiguration } = useMarketConfiguration(baseAsset);
const borrowApr = useMemo(() => getBorrowApr(borrowRate), [borrowRate]);
const supplyApr = useMemo(() => getSupplyApr(supplyRate), [supplyRate]);
- const availableLiquidity = useMarketBalanceOfBase(baseAsset);
+ const { data: availableLiquidity } = useMarketBalanceOfBase(baseAsset);
const { data: totalCollateral } = useTotalCollateral(baseAsset);
const { data: marketBasics } = useMarketBasics(baseAsset);
@@ -195,7 +195,9 @@ export default function MarketOverview({
Available Liquidity
- {getFormattedPrice(availableLiquidity.formatted)}
+ {getFormattedPrice(
+ availableLiquidity?.formatted ?? BigNumber(0)
+ )}
diff --git a/apps/frontend/src/hooks/useMarketBalanceOfBase.ts b/apps/frontend/src/hooks/useMarketBalanceOfBase.ts
index 4a1b486f..5a8c07e9 100644
--- a/apps/frontend/src/hooks/useMarketBalanceOfBase.ts
+++ b/apps/frontend/src/hooks/useMarketBalanceOfBase.ts
@@ -2,31 +2,40 @@ import { formatUnits } from '@/utils';
import BigNumber from 'bignumber.js';
import { useMarketBasics } from './useMarketBasics';
import { useMarketConfiguration } from './useMarketConfiguration';
+import { useQuery } from '@tanstack/react-query';
+import { useMarketStore } from '@/stores';
+import { useTotalReserves } from './useTotalReserves';
export const useMarketBalanceOfBase = (marketParam?: string) => {
const { data: marketBasics } = useMarketBasics(marketParam);
const { data: marketConfiguration } = useMarketConfiguration(marketParam);
+ const { data: totalReserves } = useTotalReserves(marketParam);
+ const { market: storeMarket } = useMarketStore();
+ const market = marketParam ?? storeMarket;
- if (
- !marketBasics ||
- !marketBasics.total_borrow_base ||
- !marketBasics.total_supply_base ||
- !marketConfiguration
- )
- return {
- raw: BigNumber(0),
- formatted: BigNumber(0),
- };
+ return useQuery({
+ queryKey: ['marketBalanceOfBase', market],
+ queryFn: async () => {
+ if (!marketBasics || !marketConfiguration || !totalReserves) {
+ return {
+ raw: BigNumber(0),
+ formatted: BigNumber(0),
+ };
+ }
- const balanceOfBase = BigNumber(
- marketBasics.total_supply_base.toString()
- ).minus(BigNumber(marketBasics.total_borrow_base.toString()));
+ const balanceOfBase = BigNumber(marketBasics.total_supply_base.toString())
+ .minus(BigNumber(marketBasics.total_borrow_base.toString()))
+ .plus(totalReserves);
- return {
- raw: balanceOfBase,
- formatted: formatUnits(
- balanceOfBase,
- marketConfiguration.baseTokenDecimals
- ),
- };
+ return {
+ raw: balanceOfBase,
+ formatted: formatUnits(
+ balanceOfBase,
+ marketConfiguration.baseTokenDecimals
+ ),
+ };
+ },
+ refetchOnWindowFocus: false,
+ enabled: !!marketBasics && !!marketConfiguration && !!totalReserves,
+ });
};
diff --git a/apps/frontend/src/hooks/useTotalReserves.ts b/apps/frontend/src/hooks/useTotalReserves.ts
index 77d465f9..f7bb52a9 100644
--- a/apps/frontend/src/hooks/useTotalReserves.ts
+++ b/apps/frontend/src/hooks/useTotalReserves.ts
@@ -6,7 +6,7 @@ import { useQuery } from '@tanstack/react-query';
import BigNumber from 'bignumber.js';
import { useProvider } from './useProvider';
-export const useTotalReserves = (assetId: string, marketParam?: string) => {
+export const useTotalReserves = (marketParam?: string) => {
const provider = useProvider();
const { market: storeMarket } = useMarketStore();
const market = marketParam ?? storeMarket;
@@ -14,7 +14,7 @@ export const useTotalReserves = (assetId: string, marketParam?: string) => {
return useQuery({
queryKey: ['totalReserves', market],
queryFn: async () => {
- if (!provider || !assetId) return BigNumber(0);
+ if (!provider) return BigNumber(0);
const marketContract = new Market(
appConfig.markets[market].marketAddress,