Fix issues on pools, farms, dragons and landing page

QuickSwap · Dec 21, 2021 · 8fda465 · 8fda465
1 parent 44ea072
commit 8fda465
Show file tree

Hide file tree

Showing 6 changed files with 47 additions and 46 deletions.
diff --git a/src/components/AddLiquidity/AddLiquidity.tsx b/src/components/AddLiquidity/AddLiquidity.tsx
@@ -43,7 +43,6 @@ import { ReactComponent as AddLiquidityIcon } from 'assets/images/AddLiquidityIc
 
 const useStyles = makeStyles(({ palette, breakpoints }) => ({
   exchangeSwap: {
-    cursor: 'pointer',
     display: 'flex',
     justifyContent: 'center',
     alignItems: 'center',

diff --git a/src/components/FarmLPCard/FarmLPCard.tsx b/src/components/FarmLPCard/FarmLPCard.tsx
@@ -204,16 +204,14 @@ const FarmLPCard: React.FC<{
     valueOfUnstakedAmountInBaseToken &&
     USDPrice?.quote(valueOfUnstakedAmountInBaseToken);
 
-  const perMonthReturnInRewards =
-    (Number(stakingInfo.dQuickToQuick) * Number(stakingInfo.quickPrice) * 30) /
-    Number(valueOfTotalStakedAmountInUSDC?.toSignificant(6));
-
   let apyWithFee: number | string = 0;
 
   if (stakingAPY && stakingAPY > 0) {
     apyWithFee =
       ((1 +
-        ((Number(perMonthReturnInRewards) + Number(stakingAPY) / 12) * 12) /
+        ((Number(stakingInfo.perMonthReturnInRewards) +
+          Number(stakingAPY) / 12) *
+          12) /
           12) **
         12 -
         1) *

diff --git a/src/components/PoolPositionCard/PoolPositionCard.tsx b/src/components/PoolPositionCard/PoolPositionCard.tsx
@@ -1,16 +1,15 @@
-import React, { useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { Box, Typography, Button, useMediaQuery } from '@material-ui/core';
 import { makeStyles, useTheme } from '@material-ui/core/styles';
 import { ChevronDown, ChevronUp } from 'react-feather';
 import { Pair, JSBI, Percent, Currency, TokenAmount } from '@uniswap/sdk';
 import { useActiveWeb3React } from 'hooks';
 import { unwrappedToken } from 'utils/wrappedCurrency';
 import { useTokenBalance } from 'state/wallet/hooks';
-import { useStakingInfo } from 'state/stake/hooks';
+import { useStakingInfo, getBulkPairData } from 'state/stake/hooks';
 import { useTotalSupply } from 'data/TotalSupply';
 import { usePair } from 'data/Reserves';
 import { EMPTY } from 'constants/index';
-import useUSDCPrice from 'utils/useUSDCPrice';
 import {
   CurrencyLogo,
   DoubleCurrencyLogo,
@@ -69,6 +68,7 @@ const PoolPositionCard: React.FC<PoolPositionCardProps> = ({
   handleAddLiquidity,
 }) => {
   const classes = useStyles();
+  const [bulkPairData, setBulkPairData] = useState<any>(null);
   const { palette, breakpoints } = useTheme();
   const isMobile = useMediaQuery(breakpoints.down('xs'));
 
@@ -85,6 +85,13 @@ const PoolPositionCard: React.FC<PoolPositionCardProps> = ({
     [stakingInfos],
   );
 
+  const pairId = stakingInfo ? stakingInfo.pair : null;
+
+  useEffect(() => {
+    const pairLists = pairId ? [pairId] : [];
+    getBulkPairData(pairLists).then((data) => setBulkPairData(data));
+  }, [pairId]);
+
   const [showMore, setShowMore] = useState(false);
 
   const userPoolBalance = useTokenBalance(
@@ -156,26 +163,17 @@ const PoolPositionCard: React.FC<PoolPositionCardProps> = ({
     );
   }
 
-  const USDPrice = useUSDCPrice(baseToken);
-  const valueOfTotalStakedAmountInUSDC =
-    valueOfTotalStakedAmountInBaseToken &&
-    USDPrice?.quote(valueOfTotalStakedAmountInBaseToken);
-
-  const perMonthReturnInRewards =
-    (Number(stakingInfo?.dQuickToQuick) *
-      Number(stakingInfo?.quickPrice) *
-      30) /
-    Number(valueOfTotalStakedAmountInUSDC?.toSignificant(6));
-
   const apyWithFee = useMemo(() => {
-    if (
-      stakingInfo &&
-      stakingInfo.oneYearFeeAPY &&
-      Number(stakingInfo.oneYearFeeAPY) > 0
-    ) {
+    if (stakingInfo && bulkPairData) {
+      const dayVolume = bulkPairData
+        ? bulkPairData[stakingInfo.pair]?.oneDayVolumeUSD
+        : 0;
+      const oneYearFee =
+        (dayVolume * 0.003 * 365) / bulkPairData[stakingInfo.pair]?.reserveUSD;
       const apy =
         ((1 +
-          ((perMonthReturnInRewards + Number(stakingInfo.oneYearFeeAPY) / 12) *
+          ((Number(stakingInfo.perMonthReturnInRewards) +
+            Number(oneYearFee) / 12) *
             12) /
             12) **
           12 -
@@ -187,7 +185,7 @@ const PoolPositionCard: React.FC<PoolPositionCardProps> = ({
         return Number(apy.toFixed(2)).toLocaleString();
       }
     }
-  }, [stakingInfo, perMonthReturnInRewards]);
+  }, [stakingInfo, bulkPairData]);
 
   return (
     <Box

diff --git a/src/pages/DragonPage/DragonPage.tsx b/src/pages/DragonPage/DragonPage.tsx
@@ -208,12 +208,15 @@ const DragonPage: React.FC = () => {
           (stakedOnly
             ? Boolean(syrupInfo.stakedAmount.greaterThan('0'))
             : true) &&
-          ((syrupInfo.token.symbol ?? '').toLowerCase().indexOf(syrupSearch) >
-            -1 ||
-            (syrupInfo.token.name ?? '').toLowerCase().indexOf(syrupSearch) >
-              -1 ||
-            (syrupInfo.token.address ?? '').toLowerCase().indexOf(syrupSearch) >
-              -1)
+          ((syrupInfo.token.symbol ?? '')
+            .toLowerCase()
+            .indexOf(syrupSearch.toLowerCase()) > -1 ||
+            (syrupInfo.token.name ?? '')
+              .toLowerCase()
+              .indexOf(syrupSearch.toLowerCase()) > -1 ||
+            (syrupInfo.token.address ?? '')
+              .toLowerCase()
+              .indexOf(syrupSearch.toLowerCase()) > -1)
         );
       });
     } else {

diff --git a/src/pages/FarmPage/FarmPage.tsx b/src/pages/FarmPage/FarmPage.tsx
@@ -205,22 +205,22 @@ const FarmPage: React.FC = () => {
               : true) &&
             ((stakingInfo.tokens[0].symbol ?? '')
               .toLowerCase()
-              .indexOf(farmSearch) > -1 ||
+              .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[0].name ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[0].address ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].symbol ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].name ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].address ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1)
+                .indexOf(farmSearch.toLowerCase()) > -1)
           );
         })
         .sort((a, b) => {
@@ -326,22 +326,22 @@ const FarmPage: React.FC = () => {
               : true) &&
             ((stakingInfo.tokens[0].symbol ?? '')
               .toLowerCase()
-              .indexOf(farmSearch) > -1 ||
+              .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[0].name ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[0].address ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].symbol ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].name ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1 ||
+                .indexOf(farmSearch.toLowerCase()) > -1 ||
               (stakingInfo.tokens[1].address ?? '')
                 .toLowerCase()
-                .indexOf(farmSearch) > -1)
+                .indexOf(farmSearch.toLowerCase()) > -1)
           );
         })
         .sort((a, b) => {

diff --git a/src/pages/LandingPage/LandingPage.tsx b/src/pages/LandingPage/LandingPage.tsx
@@ -396,8 +396,11 @@ const useStyles = makeStyles(({ palette, breakpoints }) => ({
       width: 32,
       height: 32,
       cursor: 'pointer',
+      '&:hover path': {
+        fill: palette.text.primary,
+      },
       '& path': {
-        fill: '#3e4252',
+        fill: palette.text.secondary,
       },
     },
     [breakpoints.down('xs')]: {