more strictness everywhere, fix a pair pricing issue in mint/hooks.ts

src/components/AccountDetails/index.tsx

@@ -282,6 +282,7 @@ export default function AccountDetails({
         </>
       )
     }
+    return null
   }
 
   const clearAllTransactionsCallback = useCallback(

src/components/AddressInputPanel/index.tsx

@@ -65,11 +65,6 @@ const Input = styled.input<{ error?: boolean }>`
   }
 `
 
-interface Value {
-  address: string
-  name?: string
-}
-
 export default function AddressInputPanel({
   id,
   value,

src/components/Popups/PopupItem.tsx

@@ -55,7 +55,7 @@ export default function PopupItem({
   const removePopup = useRemovePopup()
   const removeThisPopup = useCallback(() => removePopup(popKey), [popKey, removePopup])
   useEffect(() => {
-    if (removeAfterMs === null) return
+    if (removeAfterMs === null) return undefined
 
     const timeout = setTimeout(() => {
       removeThisPopup()

src/components/Web3Status/index.tsx

@@ -1,4 +1,5 @@
 import React, { useMemo } from 'react'
+import { AbstractConnector } from '@web3-react/abstract-connector'
 import styled, { css } from 'styled-components'
 import { useTranslation } from 'react-i18next'
 import { useWeb3React, UnsupportedChainIdError } from '@web3-react/core'
@@ -132,9 +133,91 @@ const SOCK = (
   </span>
 )
 
-export default function Web3Status() {
+// eslint-disable-next-line react/prop-types
+function StatusIcon({ connector }: { connector: AbstractConnector }) {
+  if (connector === injected) {
+    return <Identicon />
+  } else if (connector === walletconnect) {
+    return (
+      <IconWrapper size={16}>
+        <img src={WalletConnectIcon} alt={''} />
+      </IconWrapper>
+    )
+  } else if (connector === walletlink) {
+    return (
+      <IconWrapper size={16}>
+        <img src={CoinbaseWalletIcon} alt={''} />
+      </IconWrapper>
+    )
+  } else if (connector === fortmatic) {
+    return (
+      <IconWrapper size={16}>
+        <img src={FortmaticIcon} alt={''} />
+      </IconWrapper>
+    )
+  } else if (connector === portis) {
+    return (
+      <IconWrapper size={16}>
+        <img src={PortisIcon} alt={''} />
+      </IconWrapper>
+    )
+  }
+  return null
+}
+
+function Web3StatusInner() {
   const { t } = useTranslation()
-  const { active, account, connector, error } = useWeb3React()
+  const { account, connector, error } = useWeb3React()
+
+  const { ENSName } = useENSName(account)
+
+  const allTransactions = useAllTransactions()
+
+  const sortedRecentTransactions = useMemo(() => {
+    const txs = Object.values(allTransactions)
+    return txs.filter(recentTransactionsOnly).sort(newTranscationsFirst)
+  }, [allTransactions])
+
+  const pending = sortedRecentTransactions.filter(tx => !tx.receipt).map(tx => tx.hash)
+
+  const hasPendingTransactions = !!pending.length
+  const hasSocks = useHasSocks()
+  const toggleWalletModal = useWalletModalToggle()
+
+  if (account) {
+    return (
+      <Web3StatusConnected id="web3-status-connected" onClick={toggleWalletModal} pending={hasPendingTransactions}>
+        {hasPendingTransactions ? (
+          <RowBetween>
+            <Text>{pending?.length} Pending</Text> <Loader stroke="white" />
+          </RowBetween>
+        ) : (
+          <>
+            {hasSocks ? SOCK : null}
+            <Text>{ENSName || shortenAddress(account)}</Text>
+          </>
+        )}
+        {!hasPendingTransactions && <StatusIcon connector={connector} />}
+      </Web3StatusConnected>
+    )
+  } else if (error) {
+    return (
+      <Web3StatusError onClick={toggleWalletModal}>
+        <NetworkIcon />
+        <Text>{error instanceof UnsupportedChainIdError ? 'Wrong Network' : 'Error'}</Text>
+      </Web3StatusError>
+    )
+  } else {
+    return (
+      <Web3StatusConnect id="connect-wallet" onClick={toggleWalletModal} faded={!account}>
+        <Text>{t('Connect to a wallet')}</Text>
+      </Web3StatusConnect>
+    )
+  }
+}
+
+export default function Web3Status() {
+  const { active, account } = useWeb3React()
   const contextNetwork = useWeb3React(NetworkContextName)
 
   const { ENSName } = useENSName(account)
@@ -149,81 +232,13 @@ export default function Web3Status() {
   const pending = sortedRecentTransactions.filter(tx => !tx.receipt).map(tx => tx.hash)
   const confirmed = sortedRecentTransactions.filter(tx => tx.receipt).map(tx => tx.hash)
 
-  const hasPendingTransactions = !!pending.length
-  const hasSocks = useHasSocks()
-  const toggleWalletModal = useWalletModalToggle()
-
-  // handle the logo we want to show with the account
-  function getStatusIcon() {
-    if (connector === injected) {
-      return <Identicon />
-    } else if (connector === walletconnect) {
-      return (
-        <IconWrapper size={16}>
-          <img src={WalletConnectIcon} alt={''} />
-        </IconWrapper>
-      )
-    } else if (connector === walletlink) {
-      return (
-        <IconWrapper size={16}>
-          <img src={CoinbaseWalletIcon} alt={''} />
-        </IconWrapper>
-      )
-    } else if (connector === fortmatic) {
-      return (
-        <IconWrapper size={16}>
-          <img src={FortmaticIcon} alt={''} />
-        </IconWrapper>
-      )
-    } else if (connector === portis) {
-      return (
-        <IconWrapper size={16}>
-          <img src={PortisIcon} alt={''} />
-        </IconWrapper>
-      )
-    }
-  }
-
-  function getWeb3Status() {
-    if (account) {
-      return (
-        <Web3StatusConnected id="web3-status-connected" onClick={toggleWalletModal} pending={hasPendingTransactions}>
-          {hasPendingTransactions ? (
-            <RowBetween>
-              <Text>{pending?.length} Pending</Text> <Loader stroke="white" />
-            </RowBetween>
-          ) : (
-            <>
-              {hasSocks ? SOCK : null}
-              <Text>{ENSName || shortenAddress(account)}</Text>
-            </>
-          )}
-          {!hasPendingTransactions && getStatusIcon()}
-        </Web3StatusConnected>
-      )
-    } else if (error) {
-      return (
-        <Web3StatusError onClick={toggleWalletModal}>
-          <NetworkIcon />
-          <Text>{error instanceof UnsupportedChainIdError ? 'Wrong Network' : 'Error'}</Text>
-        </Web3StatusError>
-      )
-    } else {
-      return (
-        <Web3StatusConnect id="connect-wallet" onClick={toggleWalletModal} faded={!account}>
-          <Text>{t('Connect to a wallet')}</Text>
-        </Web3StatusConnect>
-      )
-    }
-  }
-
   if (!contextNetwork.active && !active) {
     return null
   }
 
   return (
     <>
-      {getWeb3Status()}
+      <Web3StatusInner />
       <WalletModal ENSName={ENSName} pendingTransactions={pending} confirmedTransactions={confirmed} />
     </>
   )

src/hooks/index.ts

@@ -82,6 +82,6 @@ export function useInactiveListener(suppress = false) {
         }
       }
     }
-    return
+    return undefined
   }, [active, error, suppress, activate])
 }

src/hooks/useCopyClipboard.ts

@@ -19,7 +19,7 @@ export default function useCopyClipboard(timeout = 500): [boolean, (toCopy: stri
         clearTimeout(hide)
       }
     }
-    return
+    return undefined
   }, [isCopied, setIsCopied, timeout])
 
   return [isCopied, staticCopy]

src/hooks/useInterval.ts

@@ -20,6 +20,6 @@ export default function useInterval(callback: () => void, delay: null | number,
       const id = setInterval(tick, delay)
       return () => clearInterval(id)
     }
-    return
+    return undefined
   }, [delay, leading])
 }

src/hooks/useIsWindowVisible.ts

@@ -16,7 +16,7 @@ export default function useIsWindowVisible(): boolean {
   }, [setFocused])
 
   useEffect(() => {
-    if (!VISIBILITY_STATE_SUPPORTED) return
+    if (!VISIBILITY_STATE_SUPPORTED) return undefined
 
     document.addEventListener('visibilitychange', listener)
     return () => {

src/state/application/updater.ts

@@ -31,7 +31,7 @@ export default function Updater() {
 
   // attach/detach listeners
   useEffect(() => {
-    if (!library || !chainId || !windowVisible) return
+    if (!library || !chainId || !windowVisible) return undefined
 
     setState({ chainId, blockNumber: null })
 

src/state/mint/hooks.ts

@@ -72,7 +72,7 @@ export function useDerivedMintInfo(
       if (otherTypedValue && currencies[dependentField]) {
         return tryParseAmount(otherTypedValue, currencies[dependentField])
       }
-      return
+      return undefined
     } else if (independentAmount) {
       // we wrap the currencies just to get the price in terms of the other token
       const wrappedIndependentAmount = wrappedCurrencyAmount(independentAmount, chainId)
@@ -85,9 +85,9 @@ export function useDerivedMintInfo(
             : pair.priceOf(tokenB).quote(wrappedIndependentAmount)
         return dependentCurrency === ETHER ? CurrencyAmount.ether(dependentTokenAmount.raw) : dependentTokenAmount
       }
-      return
+      return undefined
     } else {
-      return
+      return undefined
     }
   }, [noLiquidity, otherTypedValue, currencies, dependentField, independentAmount, currencyA, chainId, currencyB, pair])
   const parsedAmounts: { [field in Field]: CurrencyAmount | undefined } = {
@@ -95,18 +95,18 @@ export function useDerivedMintInfo(
     [Field.CURRENCY_B]: independentField === Field.CURRENCY_A ? dependentAmount : independentAmount
   }
 
-  const token0Price = pair?.token0Price
   const price = useMemo(() => {
     if (noLiquidity) {
       const { [Field.CURRENCY_A]: currencyAAmount, [Field.CURRENCY_B]: currencyBAmount } = parsedAmounts
       if (currencyAAmount && currencyBAmount) {
         return new Price(currencyAAmount.currency, currencyBAmount.currency, currencyAAmount.raw, currencyBAmount.raw)
       }
-      return
+      return undefined
     } else {
-      return token0Price
+      const wrappedCurrencyA = wrappedCurrency(currencyA, chainId)
+      return pair && wrappedCurrencyA ? pair.priceOf(wrappedCurrencyA) : undefined
     }
-  }, [noLiquidity, token0Price, parsedAmounts])
+  }, [chainId, currencyA, noLiquidity, pair, parsedAmounts])
 
   // liquidity minted
   const liquidityMinted = useMemo(() => {
@@ -118,7 +118,7 @@ export function useDerivedMintInfo(
     if (pair && totalSupply && tokenAmountA && tokenAmountB) {
       return pair.getLiquidityMinted(totalSupply, tokenAmountA, tokenAmountB)
     } else {
-      return
+      return undefined
     }
   }, [parsedAmounts, chainId, pair, totalSupply])
 
@@ -126,7 +126,7 @@ export function useDerivedMintInfo(
     if (liquidityMinted && totalSupply) {
       return new Percent(liquidityMinted.raw, totalSupply.add(liquidityMinted).raw)
     } else {
-      return
+      return undefined
     }
   }, [liquidityMinted, totalSupply])
 

src/state/multicall/hooks.ts

@@ -30,7 +30,8 @@ function isMethodArg(x: unknown): x is MethodArg {
 
 function isValidMethodArgs(x: unknown): x is MethodArgs | undefined {
   return (
-    x === undefined || (Array.isArray(x) && x.every(y => isMethodArg(y) || (Array.isArray(y) && y.every(isMethodArg))))
+    x === undefined ||
+    (Array.isArray(x) && x.every(xi => isMethodArg(xi) || (Array.isArray(xi) && xi.every(isMethodArg))))
   )
 }
 
@@ -67,7 +68,7 @@ function useCallsData(calls: (Call | undefined)[], options?: ListenerOptions): C
   // update listeners when there is an actual change that persists for at least 100ms
   useEffect(() => {
     const callKeys: string[] = JSON.parse(serializedCallKeys)
-    if (!chainId || callKeys.length === 0) return
+    if (!chainId || callKeys.length === 0) return undefined
     const calls = callKeys.map(key => parseCallKey(key))
     dispatch(
       addMulticallListeners({

src/state/swap/hooks.ts

@@ -71,7 +71,7 @@ export function useSwapActionHandlers(): {
 // try to parse a user entered amount for a given token
 export function tryParseAmount(value?: string, currency?: Currency): CurrencyAmount | undefined {
   if (!value || !currency) {
-    return
+    return undefined
   }
   try {
     const typedValueParsed = parseUnits(value, currency.decimals).toString()
@@ -85,7 +85,7 @@ export function tryParseAmount(value?: string, currency?: Currency): CurrencyAmo
     console.debug(`Failed to parse input amount: "${value}"`, error)
   }
   // necessary for all paths to return a value
-  return
+  return undefined
 }
 
 const BAD_RECIPIENT_ADDRESSES: string[] = [

src/state/wallet/hooks.ts

@@ -90,7 +90,7 @@ export function useTokenBalances(
 // get the balance for a single token/account combo
 export function useTokenBalance(account?: string, token?: Token): TokenAmount | undefined {
   const tokenBalances = useTokenBalances(account, [token])
-  if (!token) return
+  if (!token) return undefined
   return tokenBalances[token.address]
 }
 
@@ -109,10 +109,10 @@ export function useCurrencyBalances(
   return useMemo(
     () =>
       currencies?.map(currency => {
-        if (!account || !currency) return
+        if (!account || !currency) return undefined
         if (currency instanceof Token) return tokenBalances[currency.address]
         if (currency === ETHER) return ethBalance[account]
-        return
+        return undefined
       }) ?? [],
     [account, currencies, ethBalance, tokenBalances]
   )

src/utils/maxAmountSpend.ts

@@ -6,7 +6,7 @@ import { MIN_ETH } from '../constants'
  * @param currencyAmount to return max of
  */
 export function maxAmountSpend(currencyAmount?: CurrencyAmount): CurrencyAmount | undefined {
-  if (!currencyAmount) return
+  if (!currencyAmount) return undefined
   if (currencyAmount.currency === ETHER) {
     if (JSBI.greaterThan(currencyAmount.raw, MIN_ETH)) {
       return CurrencyAmount.ether(JSBI.subtract(currencyAmount.raw, MIN_ETH))

src/utils/parseENSAddress.ts

@@ -2,6 +2,6 @@ const ENS_NAME_REGEX = /^(([a-zA-Z0-9]+\.)+)eth(\/.*)?$/
 
 export function parseENSAddress(ensAddress: string): { ensName: string; ensPath: string | undefined } | undefined {
   const match = ensAddress.match(ENS_NAME_REGEX)
-  if (!match) return
+  if (!match) return undefined
   return { ensName: `${match[1].toLowerCase()}eth`, ensPath: match[3] }
 }

src/utils/useUSDCPrice.ts

@@ -27,7 +27,7 @@ export default function useUSDCPrice(currency?: Currency): Price | undefined {
 
   return useMemo(() => {
     if (!currency || !wrapped || !chainId) {
-      return
+      return undefined
     }
     // handle weth/eth
     if (wrapped.equals(WETH[chainId])) {
@@ -61,6 +61,6 @@ export default function useUSDCPrice(currency?: Currency): Price | undefined {
         return new Price(currency, USDC, usdcPrice.denominator, usdcPrice.numerator)
       }
     }
-    return
+    return undefined
   }, [chainId, currency, ethPair, ethPairState, usdcEthPair, usdcEthPairState, usdcPair, usdcPairState, wrapped])
 }

tsconfig.json

@@ -13,6 +13,10 @@
     "noEmit": true,
     "esModuleInterop": true,
     "module": "esnext",
+    "noUnusedLocals": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitThis": true,
+    "noImplicitReturns": true,
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
@@ -29,8 +33,7 @@
     "cypress"
   ],
   "include": [
-    "**/*.js",
-    "**/*.ts",
-    "**/*.tsx"
+    "./src/**/*.ts",
+    "./src/**/*.tsx"
   ]
 }

tsconfig.strict.json

@@ -4,10 +4,6 @@
     "strict": true,
     "noImplicitAny": true,
     "alwaysStrict": true,
-    "strictNullChecks": true,
-    "noImplicitReturns": true,
-    "noImplicitThis": true,
-    "noUnusedLocals": true,
-    "noFallthroughCasesInSwitch": true
+    "strictNullChecks": true
   }
 }