Merge pull request #353 from SarjuHansaliya/fix/sentry-issue

Fix Few Sentry Errors, ignore user tx cancelled errors
pangolindex · Feb 18, 2022 · 8bbae0e · 8bbae0e
2 parents db6d9ba + 6329c8e
commit 8bbae0e
Show file tree

Hide file tree

Showing 18 changed files with 168 additions and 91 deletions.
diff --git a/src/components/WalletModal/index.tsx b/src/components/WalletModal/index.tsx
@@ -125,7 +125,7 @@ const WALLET_VIEWS = {
 function addAvalancheNetwork() {
   injected.getProvider().then(provider => {
     provider
-      .request({
+      ?.request({
         method: 'wallet_addEthereumChain',
         params: [AVALANCHE_CHAIN_PARAMS]
       })

diff --git a/src/components/earn/ClaimRewardModal.tsx b/src/components/earn/ClaimRewardModal.tsx
@@ -67,7 +67,10 @@ export default function ClaimRewardModal({
         })
         .catch((error: any) => {
           setAttempting(false)
-          console.log(error)
+          // we only care if the error is something _other_ than the user rejected the tx
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
         })
     }
   }

diff --git a/src/components/earn/ClaimRewardModalSingleSide.tsx b/src/components/earn/ClaimRewardModalSingleSide.tsx
@@ -54,7 +54,10 @@ export default function ClaimRewardModalSingleSide({ isOpen, onDismiss, stakingI
         })
         .catch((error: any) => {
           setAttempting(false)
-          console.log(error)
+          // we only care if the error is something _other_ than the user rejected the tx
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
         })
     }
   }
@@ -67,50 +70,48 @@ export default function ClaimRewardModalSingleSide({ isOpen, onDismiss, stakingI
     error = error ?? t('earn.enterAmount')
   }
 
-	return (
-		<Modal isOpen={isOpen} onDismiss={wrappedOnDismiss} maxHeight={90}>
-			{!attempting && !hash && (
-				<ContentWrapper gap="lg">
-					<RowBetween>
-						<TYPE.mediumHeader>{t('earn.claim')}</TYPE.mediumHeader>
-						<CloseIcon onClick={wrappedOnDismiss} />
-					</RowBetween>
-					{stakingInfo?.earnedAmount && (
-						<AutoColumn justify="center" gap="md">
-							<TYPE.body fontWeight={600} fontSize={36}>
-								{stakingInfo?.earnedAmount?.toSignificant(6)}
-							</TYPE.body>
-							<TYPE.body>{t('earn.unclaimedReward', { symbol: stakingInfo?.rewardToken?.symbol })}</TYPE.body>
-						</AutoColumn>
-					)}
-					<TYPE.subHeader style={{ textAlign: 'center' }}>
-						{t('earn.liquidityRemainsPool')}
-					</TYPE.subHeader>
-					<ButtonError disabled={!!error} error={!!error && !!stakingInfo?.stakedAmount} onClick={onClaimReward}>
-						{error ?? t('earn.claimReward', { symbol: stakingInfo?.rewardToken?.symbol })}
-					</ButtonError>
-				</ContentWrapper>
-			)}
-			{attempting && !hash && (
-				<LoadingView onDismiss={wrappedOnDismiss}>
-					<AutoColumn gap="12px" justify={'center'}>
-						<TYPE.body fontSize={20}>
+  return (
+    <Modal isOpen={isOpen} onDismiss={wrappedOnDismiss} maxHeight={90}>
+      {!attempting && !hash && (
+        <ContentWrapper gap="lg">
+          <RowBetween>
+            <TYPE.mediumHeader>{t('earn.claim')}</TYPE.mediumHeader>
+            <CloseIcon onClick={wrappedOnDismiss} />
+          </RowBetween>
+          {stakingInfo?.earnedAmount && (
+            <AutoColumn justify="center" gap="md">
+              <TYPE.body fontWeight={600} fontSize={36}>
+                {stakingInfo?.earnedAmount?.toSignificant(6)}
+              </TYPE.body>
+              <TYPE.body>{t('earn.unclaimedReward', { symbol: stakingInfo?.rewardToken?.symbol })}</TYPE.body>
+            </AutoColumn>
+          )}
+          <TYPE.subHeader style={{ textAlign: 'center' }}>{t('earn.liquidityRemainsPool')}</TYPE.subHeader>
+          <ButtonError disabled={!!error} error={!!error && !!stakingInfo?.stakedAmount} onClick={onClaimReward}>
+            {error ?? t('earn.claimReward', { symbol: stakingInfo?.rewardToken?.symbol })}
+          </ButtonError>
+        </ContentWrapper>
+      )}
+      {attempting && !hash && (
+        <LoadingView onDismiss={wrappedOnDismiss}>
+          <AutoColumn gap="12px" justify={'center'}>
+            <TYPE.body fontSize={20}>
               {t('earn.claimingReward', {
                 amount: stakingInfo?.earnedAmount?.toSignificant(6),
                 symbol: stakingInfo?.rewardToken?.symbol
               })}
             </TYPE.body>
-					</AutoColumn>
-				</LoadingView>
-			)}
-			{hash && (
-				<SubmittedView onDismiss={wrappedOnDismiss} hash={hash}>
-					<AutoColumn gap="12px" justify={'center'}>
-						<TYPE.largeHeader>{t('earn.transactionSubmitted')}</TYPE.largeHeader>
-						<TYPE.body fontSize={20}>{t('earn.claimedReward', { symbol: stakingInfo?.rewardToken?.symbol })}</TYPE.body>
-					</AutoColumn>
-				</SubmittedView>
-			)}
-		</Modal>
-	)
+          </AutoColumn>
+        </LoadingView>
+      )}
+      {hash && (
+        <SubmittedView onDismiss={wrappedOnDismiss} hash={hash}>
+          <AutoColumn gap="12px" justify={'center'}>
+            <TYPE.largeHeader>{t('earn.transactionSubmitted')}</TYPE.largeHeader>
+            <TYPE.body fontSize={20}>{t('earn.claimedReward', { symbol: stakingInfo?.rewardToken?.symbol })}</TYPE.body>
+          </AutoColumn>
+        </SubmittedView>
+      )}
+    </Modal>
+  )
 }
diff --git a/src/components/earn/StakingModal.tsx b/src/components/earn/StakingModal.tsx
@@ -117,7 +117,10 @@ export default function StakingModal({
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else if (signatureData) {
         const permitMethod = version < 2 ? 'stakeWithPermit' : 'depositWithPermit'
@@ -149,7 +152,10 @@ export default function StakingModal({
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else {
         setAttempting(false)

diff --git a/src/components/earn/StakingModalSingleSide.tsx b/src/components/earn/StakingModalSingleSide.tsx
@@ -42,7 +42,12 @@ interface StakingModalProps {
   userLiquidityUnstaked: TokenAmount | undefined
 }
 
-export default function StakingModalSingleSide({ isOpen, onDismiss, stakingInfo, userLiquidityUnstaked }: StakingModalProps) {
+export default function StakingModalSingleSide({
+  isOpen,
+  onDismiss,
+  stakingInfo,
+  userLiquidityUnstaked
+}: StakingModalProps) {
   const { account, chainId, library } = useActiveWeb3React()
 
   // track and parse user input
@@ -84,35 +89,41 @@ export default function StakingModalSingleSide({ isOpen, onDismiss, stakingInfo,
     if (stakingContract && parsedAmount && deadline) {
       if (approval === ApprovalState.APPROVED) {
         stakingContract
-	        .stake(`0x${parsedAmount.raw.toString(16)}`)
-	        .then((response: TransactionResponse) => {
-		        addTransaction(response, {
-			        summary: t('earnPage.stakeStakingTokens', { symbol: 'PNG' })
-		        })
-		        setHash(response.hash)
-	        })
-	        .catch((error: any) => {
-		        setAttempting(false)
-		        console.error(error)
-	        })
+          .stake(`0x${parsedAmount.raw.toString(16)}`)
+          .then((response: TransactionResponse) => {
+            addTransaction(response, {
+              summary: t('earnPage.stakeStakingTokens', { symbol: 'PNG' })
+            })
+            setHash(response.hash)
+          })
+          .catch((error: any) => {
+            setAttempting(false)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
+          })
       } else if (signatureData) {
         stakingContract
           .stakeWithPermit(
             `0x${parsedAmount.raw.toString(16)}`,
             signatureData.deadline,
             signatureData.v,
             signatureData.r,
-            signatureData.s,
+            signatureData.s
           )
           .then((response: TransactionResponse) => {
             addTransaction(response, {
-	            summary: t('earnPage.stakeStakingTokens', { symbol: 'PNG' })
+              summary: t('earnPage.stakeStakingTokens', { symbol: 'PNG' })
             })
             setHash(response.hash)
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else {
         setAttempting(false)
@@ -142,16 +153,16 @@ export default function StakingModalSingleSide({ isOpen, onDismiss, stakingInfo,
     // try to gather a signature for permission
     const nonce = await stakingTokenContract.nonces(account)
 
-	  const EIP712Domain = [
-		  { name: 'name', type: 'string' },
-		  { name: 'chainId', type: 'uint256' },
-		  { name: 'verifyingContract', type: 'address' }
-	  ]
-	  const domain = {
-		  name: 'Pangolin',
-		  chainId: chainId,
-		  verifyingContract: stakingTokenContract.address
-	  }
+    const EIP712Domain = [
+      { name: 'name', type: 'string' },
+      { name: 'chainId', type: 'uint256' },
+      { name: 'verifyingContract', type: 'address' }
+    ]
+    const domain = {
+      name: 'Pangolin',
+      chainId: chainId,
+      verifyingContract: stakingTokenContract.address
+    }
     const Permit = [
       { name: 'owner', type: 'address' },
       { name: 'spender', type: 'address' },
@@ -259,7 +270,9 @@ export default function StakingModalSingleSide({ isOpen, onDismiss, stakingInfo,
         <SubmittedView onDismiss={wrappedOnDismiss} hash={hash}>
           <AutoColumn gap="12px" justify={'center'}>
             <TYPE.largeHeader>{t('earn.transactionSubmitted')}</TYPE.largeHeader>
-            <TYPE.body fontSize={20}>{t('earn.deposited')} {parsedAmount?.toSignificant(4)} PNG</TYPE.body>
+            <TYPE.body fontSize={20}>
+              {t('earn.deposited')} {parsedAmount?.toSignificant(4)} PNG
+            </TYPE.body>
           </AutoColumn>
         </SubmittedView>
       )}

diff --git a/src/index.tsx b/src/index.tsx
@@ -32,7 +32,11 @@ Sentry.init({
   release: `pangolin-interface@${version}`, //manual for now
   tracesSampleRate: 0.4,
   allowUrls: ['https://app.pangolin.exchange', 'https://beta-app.pangolin.exchange'],
-  enabled: process.env.NODE_ENV === 'production'
+  enabled: process.env.NODE_ENV === 'production',
+  ignoreErrors: [
+    'ResizeObserver loop limit exceeded',
+    'Blocked a frame with origin "https://app.pangolin.exchange" from accessing a cross-origin frame.'
+  ]
 })
 
 const Web3ProviderNetwork = createWeb3ReactRoot(NetworkContextName)

diff --git a/src/pages/Beta/Pool/ClaimReward/index.tsx b/src/pages/Beta/Pool/ClaimReward/index.tsx
@@ -52,7 +52,10 @@ const ClaimReward = ({ stakingInfo, version, onClose }: ClaimProps) => {
         })
         .catch((error: any) => {
           setAttempting(false)
-          console.log(error)
+          // we only care if the error is something _other_ than the user rejected the tx
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
         })
     }
   }

diff --git a/src/pages/Beta/Pool/EarnWidget/Stake/index.tsx b/src/pages/Beta/Pool/EarnWidget/Stake/index.tsx
@@ -120,7 +120,10 @@ const Stake = ({ pair, version, onComplete }: StakeProps) => {
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else if (signatureData) {
         const permitMethod = version < 2 ? 'stakeWithPermit' : 'depositWithPermit'
@@ -152,7 +155,10 @@ const Stake = ({ pair, version, onComplete }: StakeProps) => {
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else {
         setAttempting(false)

diff --git a/src/pages/Beta/Pool/RemoveLiquidity/index.tsx b/src/pages/Beta/Pool/RemoveLiquidity/index.tsx
@@ -158,10 +158,13 @@ const RemoveLiquidity = ({ currencyA, currencyB, onClose }: RemoveLiquidityProps
   }
 
   // wrapped onUserInput to clear signatures
-  const onUserInput = useCallback((typedValue: string) => {
-    setSignatureData(null)
-    _onUserInput(Field.LIQUIDITY, typedValue)
-  }, [_onUserInput])
+  const onUserInput = useCallback(
+    (typedValue: string) => {
+      setSignatureData(null)
+      _onUserInput(Field.LIQUIDITY, typedValue)
+    },
+    [_onUserInput]
+  )
 
   const renderPoolDataRow = (label?: string, value?: string) => {
     return (
@@ -333,10 +336,12 @@ const RemoveLiquidity = ({ currencyA, currencyB, onClose }: RemoveLiquidityProps
             label: [currencyA?.symbol, currencyB?.symbol].join('/')
           })
         })
-        .catch((error: Error) => {
+        .catch((error: any) => {
           setAttempting(false)
           // we only care if the error is something _other_ than the user rejected the tx
-          console.error(error)
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
         })
     }
   }

diff --git a/src/pages/Beta/Pool/Withdraw/index.tsx b/src/pages/Beta/Pool/Withdraw/index.tsx
@@ -61,7 +61,10 @@ const Withdraw = ({ stakingInfo, version, onClose }: WithdrawProps) => {
         })
         .catch((error: any) => {
           setAttempting(false)
-          console.log(error)
+          // we only care if the error is something _other_ than the user rejected the tx
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
         })
     }
   }

diff --git a/src/pages/Beta/Stake/ClaimWidget/index.tsx b/src/pages/Beta/Stake/ClaimWidget/index.tsx
@@ -44,6 +44,11 @@ const ClaimWidget = ({ stakingInfo, onClose }: ClaimProps) => {
         })
         .catch((error: any) => {
           setAttempting(false)
+
+          // we only care if the error is something _other_ than the user rejected the tx
+          if (error?.code !== 4001) {
+            console.error(error)
+          }
           console.log(error)
         })
     }

diff --git a/src/pages/Beta/Stake/DepositWidget/index.tsx b/src/pages/Beta/Stake/DepositWidget/index.tsx
@@ -77,7 +77,10 @@ const DepositWidget: React.FC<Props> = ({ stakingInfo, onClose }) => {
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else if (signatureData) {
         stakingContract
@@ -96,7 +99,10 @@ const DepositWidget: React.FC<Props> = ({ stakingInfo, onClose }) => {
           })
           .catch((error: any) => {
             setAttempting(false)
-            console.error(error)
+            // we only care if the error is something _other_ than the user rejected the tx
+            if (error?.code !== 4001) {
+              console.error(error)
+            }
           })
       } else {
         setAttempting(false)