From 4e2ae985044d0c5558edd2eb7c9065a1a5fb1e5f Mon Sep 17 00:00:00 2001
From: Gorshtak <sg31191@gmail.com>
Date: Wed, 22 Mar 2023 14:12:19 +0100
Subject: [PATCH] fixed rpc errors breaking ui

---
 .../UserVaults/components/UserLP/UserLP.tsx         | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/pages/Profile/components/UserVaults/components/UserLP/UserLP.tsx b/src/pages/Profile/components/UserVaults/components/UserLP/UserLP.tsx
index 522c7f11..7e364d12 100644
--- a/src/pages/Profile/components/UserVaults/components/UserLP/UserLP.tsx
+++ b/src/pages/Profile/components/UserVaults/components/UserLP/UserLP.tsx
@@ -1,7 +1,7 @@
 import SPAAnchor from 'components/SPAAnchor';
 import ROUTES from 'constants/routes';
 import useLiquidityPoolUserDataQuery from 'queries/liquidityPool/useLiquidityPoolUserDataQuery';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { getIsWalletConnected, getNetworkId, getWalletAddress } from 'redux/modules/wallet';
@@ -13,12 +13,17 @@ const UserLP: React.FC = () => {
     const networkId = useSelector((state: RootState) => getNetworkId(state));
     const walletAddress = useSelector((state: RootState) => getWalletAddress(state)) || '';
     const isWalletConnected = useSelector((state: RootState) => getIsWalletConnected(state));
+    const [lastValidData, setLastValidData] = useState<number>(0);
 
-    const userVaultDataQuery = useLiquidityPoolUserDataQuery(walletAddress, networkId, {
+    const userLpQuery = useLiquidityPoolUserDataQuery(walletAddress, networkId, {
         enabled: isWalletConnected,
     });
 
-    const vaultAllocation = userVaultDataQuery.isSuccess ? userVaultDataQuery.data?.balanceTotal : 0;
+    useEffect(() => {
+        if (userLpQuery.isSuccess && userLpQuery.data) {
+            setLastValidData(userLpQuery.data?.balanceTotal);
+        }
+    }, [userLpQuery.isSuccess, userLpQuery.data]);
 
     return (
         <SPAAnchor href={ROUTES.LiquidityPool}>
@@ -30,7 +35,7 @@ const UserLP: React.FC = () => {
                 <ContentWrapper>
                     <TextWrapper>
                         <PreLabel>{t('profile.in-lp')}</PreLabel>
-                        <Value>{vaultAllocation?.toFixed(2)}</Value>
+                        <Value>{lastValidData?.toFixed(2)}</Value>
                         <PostLabel>USD</PostLabel>
                     </TextWrapper>
                     <Button>{t('profile.go-to-lp')}</Button>