update function to check supported network

QuickSwap · Feb 8, 2022 · 9e61601 · 9e61601
1 parent 478a791
commit 9e61601
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 31 deletions.
diff --git a/src/components/AddLiquidity/AddLiquidity.tsx b/src/components/AddLiquidity/AddLiquidity.tsx
@@ -37,7 +37,7 @@ import {
   calculateSlippageAmount,
   calculateGasMargin,
   returnTokenFromKey,
-  checkNetworkisNotMatic,
+  isSupportedNetwork,
 } from 'utils';
 import { wrappedCurrency } from 'utils/wrappedCurrency';
 import { ReactComponent as AddLiquidityIcon } from 'assets/images/AddLiquidityIcon.svg';
@@ -170,7 +170,7 @@ const AddLiquidity: React.FC<{
       : parsedAmounts[dependentField]?.toSignificant(6) ?? '',
   };
 
-  const isnotMatic = checkNetworkisNotMatic();
+  const { ethereum } = window as any;
   const toggleWalletModal = useWalletModalToggle();
   const [approvingA, setApprovingA] = useState(false);
   const [approvingB, setApprovingB] = useState(false);
@@ -367,7 +367,7 @@ const AddLiquidity: React.FC<{
   };
 
   const connectWallet = () => {
-    if (isnotMatic) {
+    if (!isSupportedNetwork(ethereum)) {
       addMaticToMetamask();
     } else {
       toggleWalletModal();
@@ -386,11 +386,11 @@ const AddLiquidity: React.FC<{
   const buttonText = useMemo(() => {
     if (account) {
       return error ?? 'Supply';
-    } else if (isnotMatic) {
+    } else if (!isSupportedNetwork(ethereum)) {
       return 'Switch to Polygon';
     }
     return 'Connect Wallet';
-  }, [account, isnotMatic, error]);
+  }, [account, ethereum, error]);
 
   const modalHeader = () => {
     return (

diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
@@ -9,11 +9,7 @@ import {
   useAllTransactions,
 } from 'state/transactions/hooks';
 import { TransactionDetails } from 'state/transactions/reducer';
-import {
-  shortenAddress,
-  addMaticToMetamask,
-  checkNetworkisNotMatic,
-} from 'utils';
+import { shortenAddress, addMaticToMetamask, isSupportedNetwork } from 'utils';
 import useENSName from 'hooks/useENSName';
 import { WalletModal } from 'components';
 import { useActiveWeb3React } from 'hooks';
@@ -280,6 +276,7 @@ const Header: React.FC = () => {
   const classes = useStyles();
   const { pathname } = useLocation();
   const { account } = useActiveWeb3React();
+  const { ethereum } = window as any;
   const { ENSName } = useENSName(account ?? undefined);
   const [openDetailMenu, setOpenDetailMenu] = useState(false);
   const theme = useTheme();
@@ -295,7 +292,6 @@ const Header: React.FC = () => {
   const confirmed = sortedRecentTransactions
     .filter((tx: any) => tx.receipt)
     .map((tx: any) => tx.hash);
-  const isnotMatic = checkNetworkisNotMatic();
   const tabletWindowSize = useMediaQuery(theme.breakpoints.down('sm'));
   const mobileWindowSize = useMediaQuery(theme.breakpoints.down('xs'));
   const toggleWalletModal = useWalletModalToggle();
@@ -466,7 +462,7 @@ const Header: React.FC = () => {
         >
           <LightIcon />
         </Box>
-        {!isnotMatic && account ? (
+        {isSupportedNetwork(ethereum) && account ? (
           <Box
             id='web3-status-connected'
             className={classes.accountDetails}
@@ -479,16 +475,16 @@ const Header: React.FC = () => {
           <Box
             className={cx(
               classes.connectButton,
-              isnotMatic ? classes.danger : classes.primary,
+              !isSupportedNetwork(ethereum) ? classes.danger : classes.primary,
             )}
             onClick={() => {
-              if (!isnotMatic) {
+              if (isSupportedNetwork(ethereum)) {
                 toggleWalletModal();
               }
             }}
           >
-            {isnotMatic ? 'Wrong Network' : 'Connect Wallet'}
-            {isnotMatic && (
+            {!isSupportedNetwork(ethereum) ? 'Wrong Network' : 'Connect Wallet'}
+            {!isSupportedNetwork(ethereum) && (
               <Box
                 position='absolute'
                 top={36}
@@ -538,11 +534,15 @@ const Header: React.FC = () => {
             <Button
               color='primary'
               onClick={() => {
-                isnotMatic ? addMaticToMetamask() : toggleWalletModal();
+                !isSupportedNetwork(ethereum)
+                  ? addMaticToMetamask()
+                  : toggleWalletModal();
               }}
             >
               <Typography variant='body2'>
-                {isnotMatic ? 'Switch to Polygon' : 'Connect Wallet'}
+                {!isSupportedNetwork(ethereum)
+                  ? 'Switch to Polygon'
+                  : 'Connect Wallet'}
               </Typography>
             </Button>
           )}

diff --git a/src/components/Swap/Swap.tsx b/src/components/Swap/Swap.tsx
@@ -36,7 +36,7 @@ import useWrapCallback, { WrapType } from 'hooks/useWrapCallback';
 import useToggledVersion, { Version } from 'hooks/useToggledVersion';
 import {
   addMaticToMetamask,
-  checkNetworkisNotMatic,
+  isSupportedNetwork,
   confirmPriceImpactWithoutFee,
   halfAmountSpend,
   maxAmountSpend,
@@ -206,7 +206,7 @@ const Swap: React.FC<{
 
   const { priceImpactWithoutFee } = computeTradePriceBreakdown(trade);
   const [approvalSubmitted, setApprovalSubmitted] = useState<boolean>(false);
-  const isnotMatic = checkNetworkisNotMatic();
+  const { ethereum } = window as any;
   const [mainPrice, setMainPrice] = useState(true);
   const priceImpactSeverity = warningSeverity(priceImpactWithoutFee);
   const isValid = !swapInputError;
@@ -229,7 +229,7 @@ const Swap: React.FC<{
   }, [approval, approvalSubmitted]);
 
   const connectWallet = () => {
-    if (isnotMatic) {
+    if (!isSupportedNetwork(ethereum)) {
       addMaticToMetamask();
     } else {
       toggleWalletModal();
@@ -276,13 +276,15 @@ const Swap: React.FC<{
         return swapInputError ?? 'Swap';
       }
     } else {
-      return isnotMatic ? 'Switch to Polygon' : 'Connect Wallet';
+      return !isSupportedNetwork(ethereum)
+        ? 'Switch to Polygon'
+        : 'Connect Wallet';
     }
   }, [
     formattedAmounts,
     currencies,
     account,
-    isnotMatic,
+    ethereum,
     noRoute,
     userHasSpecifiedInputOutput,
     showWrap,

diff --git a/src/pages/LandingPage/LandingPage.tsx b/src/pages/LandingPage/LandingPage.tsx
@@ -43,10 +43,9 @@ import {
   formatCompact,
   getDaysCurrentYear,
   returnTokenFromKey,
-  checkNetworkisNotMatic,
+  isSupportedNetwork,
 } from 'utils';
 import { useGlobalData, useWalletModalToggle } from 'state/application/hooks';
-import { GlobalConst } from 'constants/index';
 import { useLairInfo, useTotalRewardsDistributed } from 'state/stake/hooks';
 
 const useStyles = makeStyles(({ palette, breakpoints }) => ({
@@ -426,7 +425,7 @@ const LandingPage: React.FC = () => {
   const [openStakeModal, setOpenStakeModal] = useState(false);
   const { palette, breakpoints } = useTheme();
   const { account } = useActiveWeb3React();
-  const isnotMatic = checkNetworkisNotMatic();
+  const { ethereum } = window as any;
   const mobileWindowSize = useMediaQuery(breakpoints.down('sm'));
   const { initTransak } = useInitTransak();
   const toggleWalletModal = useWalletModalToggle();
@@ -580,14 +579,14 @@ const LandingPage: React.FC = () => {
               fontWeight: 500,
             }}
             onClick={() => {
-              isnotMatic
+              !isSupportedNetwork(ethereum)
                 ? addMaticToMetamask()
                 : account
                 ? history.push('/swap')
                 : toggleWalletModal();
             }}
           >
-            {isnotMatic
+            {!isSupportedNetwork(ethereum)
               ? 'Switch to Polygon'
               : account
               ? 'Enter App'

diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -2000,7 +2000,6 @@ export function getUSDString(usdValue?: CurrencyAmount) {
   return `$${usdStr}`;
 }
 
-export function checkNetworkisNotMatic() {
-  const { ethereum } = window as any;
-  return ethereum && ethereum.isMetaMask && Number(ethereum.chainId) !== 137;
+export function isSupportedNetwork(ethereum: any) {
+  return ethereum && Number(ethereum.chainId) === 137;
 }