refactor(rewards history): set data to undefined if is data not avail…

…able
lidofinance · Aug 22, 2024 · d9d098a · d9d098a
1 parent 0d1befc
commit d9d098a
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 23 deletions.
diff --git a/features/rewards/components/stats/average-apr-block.tsx b/features/rewards/components/stats/average-apr-block.tsx
@@ -8,11 +8,7 @@ import { Item } from './components/item';
 import { FlexCenter } from './components/styles';
 
 export const AverageAprBlock: FC = () => {
-  const {
-    data,
-    isDataAvailable,
-    initialLoading: loading,
-  } = useRewardsHistory();
+  const { data, initialLoading: loading } = useRewardsHistory();
 
   return (
     <Item
@@ -27,7 +23,7 @@ export const AverageAprBlock: FC = () => {
         </FlexCenter>
       }
       value={
-        parseFloat(data?.averageApr || '0') && isDataAvailable ? (
+        parseFloat(data?.averageApr || '0') ? (
           <>
             <NumberFormat number={data?.averageApr} percent />
             <Box display="inline-block" pl="3px">

diff --git a/features/rewards/components/stats/steth-balance-block.tsx b/features/rewards/components/stats/steth-balance-block.tsx
@@ -10,8 +10,8 @@ import { Item } from './components/item';
 export const StEthBalanceBlock: FC = () => {
   const { data: balanceData } = useRewardsBalanceData();
   const {
+    data: dataRewards,
     currencyObject: currency,
-    isDataAvailable,
     loading,
   } = useRewardsHistory();
 
@@ -21,7 +21,7 @@ export const StEthBalanceBlock: FC = () => {
       dataTestId="stEthBalanceBlock"
       title="stETH balance"
       value={
-        balanceData?.stEthBalanceParsed && isDataAvailable ? (
+        balanceData?.stEthBalanceParsed && dataRewards ? (
           <>
             <NumberFormat number={balanceData?.stEthBalanceParsed} />
             <Box display="inline-block" pl={'3px'}>
@@ -34,7 +34,7 @@ export const StEthBalanceBlock: FC = () => {
       }
       valueDataTestId="stEthBalance"
       underValue={
-        balanceData?.stEthCurrencyBalance && isDataAvailable ? (
+        balanceData?.stEthCurrencyBalance ? (
           <>
             <Box display="inline-block" pr={'3px'}>
               {currency.symbol}

diff --git a/features/rewards/components/stats/steth-price-block.tsx b/features/rewards/components/stats/steth-price-block.tsx
@@ -11,7 +11,6 @@ export const StEthPriceBlock: FC = () => {
   const {
     currencyObject: currency,
     data,
-    isDataAvailable,
     initialLoading: loading,
   } = useRewardsHistory();
   const stEthEth = useStethEthRate();
@@ -22,7 +21,7 @@ export const StEthPriceBlock: FC = () => {
       dataTestId="stEthPriceBlock"
       title="stETH price"
       value={
-        data?.stETHCurrencyPrice[currency.id] && isDataAvailable ? (
+        data?.stETHCurrencyPrice[currency.id] ? (
           <>
             <Box display="inline-block" pr="3px">
               {currency.symbol}
@@ -35,7 +34,7 @@ export const StEthPriceBlock: FC = () => {
       }
       valueDataTestId="stEthPrice"
       underValue={
-        data?.stETHCurrencyPrice[currency.id] && isDataAvailable ? (
+        data?.stETHCurrencyPrice[currency.id] ? (
           <>
             <NumberFormat number={stEthEth?.toString()} StEthEth />
             <Box display="inline-block" pl={'3px'}>

diff --git a/features/rewards/components/stats/steth-rewarded-block.tsx b/features/rewards/components/stats/steth-rewarded-block.tsx
@@ -11,7 +11,6 @@ export const StEthRewardedBlock: FC = () => {
   const {
     currencyObject: currency,
     data,
-    isDataAvailable,
     initialLoading: loading,
   } = useRewardsHistory();
 
@@ -21,7 +20,7 @@ export const StEthRewardedBlock: FC = () => {
       dataTestId="stEthRewardedBlock"
       title="stETH rewarded"
       value={
-        data?.totals.ethRewards && isDataAvailable ? (
+        data?.totals.ethRewards ? (
           <GreenText>
             <NumberFormat number={data?.totals.ethRewards} />
             <Box display="inline-block" pl={'3px'}>
@@ -34,7 +33,7 @@ export const StEthRewardedBlock: FC = () => {
       }
       valueDataTestId="stEthRewarded"
       underValue={
-        data?.totals.currencyRewards && isDataAvailable ? (
+        data?.totals.currencyRewards ? (
           <>
             <Box display="inline-block" pr={'3px'}>
               {currency.symbol}

diff --git a/providers/rewardsHistory.tsx b/providers/rewardsHistory.tsx
@@ -23,7 +23,6 @@ import { useDappStatus } from 'shared/hooks/use-dapp-status';
 
 export type RewardsHistoryValue = {
   currencyObject: CurrencyType;
-  isDataAvailable: boolean;
   data?: Backend;
   error?: unknown;
   initialLoading: boolean;
@@ -91,15 +90,16 @@ const RewardsHistoryProvider: FC<PropsWithChildren> = (props) => {
 
   const currencyObject = getCurrency(currency);
 
-  const isDataNotAvailable = useMemo(
-    () => !data || (isWalletConnected && !isSupportedChain),
-    [data, isWalletConnected, isSupportedChain],
-  );
+  const isDataAvailable = useMemo(() => {
+    const isDataNotAvailable =
+      !data || (isWalletConnected && !isSupportedChain);
+    return !isDataNotAvailable;
+  }, [data, isWalletConnected, isSupportedChain]);
 
   const value = useMemo(
     (): RewardsHistoryValue => ({
-      isDataAvailable: !isDataNotAvailable,
-      data,
+      // we want user to not confuse which chain rewards are showing
+      data: isDataAvailable ? data : undefined,
       error,
       loading,
       initialLoading,
@@ -124,7 +124,7 @@ const RewardsHistoryProvider: FC<PropsWithChildren> = (props) => {
       address,
       addressError,
       currencyObject,
-      isDataNotAvailable,
+      isDataAvailable,
       data,
       error,
       initialLoading,