feat: add multicall to widget (#3112)

* feat: mv block number to atom

* fix: add block updater

* fix: fast forward dep

* refactor: mv multicall to lib

* feat: add multicall to widget

* chore: update widget deps

* nit: pluralize updaters

* chore: minimize deps

package.json

@@ -59,11 +59,8 @@
     "@uniswap/smart-order-router": "^2.5.10",
     "@uniswap/v2-core": "1.0.0",
     "@uniswap/v2-periphery": "^1.1.0-beta.0",
-    "@uniswap/v2-sdk": "^3.0.1",
     "@uniswap/v3-core": "1.0.0",
     "@uniswap/v3-periphery": "^1.1.1",
-    "@uniswap/v3-sdk": "^3.7.1",
-    "@web3-react/core": "^6.0.9",
     "@web3-react/fortmatic-connector": "^6.0.9",
     "@web3-react/injected-connector": "^6.0.7",
     "@web3-react/portis-connector": "^6.0.9",
@@ -98,7 +95,6 @@
     "react-ga": "^2.5.7",
     "react-is": "^17.0.2",
     "react-markdown": "^4.3.1",
-    "react-redux": "^7.2.2",
     "react-router-dom": "^5.0.0",
     "react-scripts": "^4.0.3",
     "react-spring": "^8.0.27",
@@ -178,10 +174,14 @@
     "@uniswap/redux-multicall": "^1.0.0",
     "@uniswap/sdk-core": "^3.0.1",
     "@uniswap/token-lists": "^1.0.0-beta.27",
+    "@uniswap/v2-sdk": "^3.0.1",
+    "@uniswap/v3-sdk": "^3.7.1",
+    "@web3-react/core": "^6.0.9",
     "ajv": "^6.12.3",
     "cids": "^1.0.0",
     "immer": "^9.0.6",
     "jotai": "^1.3.7",
+    "jsbi": "^3.1.4",
     "make-plural": "^7.0.0",
     "multicodec": "^3.0.1",
     "multihashes": "^4.0.2",
@@ -192,6 +192,7 @@
     "react-dom": "^17.0.1",
     "react-feather": "^2.0.8",
     "react-popper": "^2.2.3",
+    "react-redux": "^7.2.2",
     "react-virtualized-auto-sizer": "^1.0.2",
     "react-window": "^1.8.5",
     "rebass": "^4.0.7",

src/hooks/Tokens.ts

@@ -4,13 +4,13 @@ import { Currency, Token } from '@uniswap/sdk-core'
 import { CHAIN_INFO } from 'constants/chainInfo'
 import { L2_CHAIN_IDS, SupportedChainId, SupportedL2ChainId } from 'constants/chains'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { NEVER_RELOAD, useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
 import { createTokenFilterFunction } from '../components/SearchModal/filtering'
 import { nativeOnChain } from '../constants/tokens'
 import { useAllLists, useCombinedActiveList, useInactiveListUrls } from '../state/lists/hooks'
 import { WrappedTokenInfo } from '../state/lists/wrappedTokenInfo'
-import { NEVER_RELOAD, useSingleCallResult } from '../state/multicall/hooks'
 import { useUserAddedTokens } from '../state/user/hooks'
 import { isAddress } from '../utils'
 import { TokenAddressMap, useUnsupportedTokenList } from './../state/lists/hooks'

src/hooks/useClientSideV3Trade.ts

@@ -3,10 +3,10 @@ import { Route, SwapQuoter } from '@uniswap/v3-sdk'
 import { SupportedChainId } from 'constants/chains'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import JSBI from 'jsbi'
+import { useSingleContractWithCallData } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 import { InterfaceTrade, TradeState } from 'state/routing/types'
 
-import { useSingleContractWithCallData } from '../state/multicall/hooks'
 import { useAllV3Routes } from './useAllV3Routes'
 import { useV3Quoter } from './useContract'
 

src/hooks/useContract.ts

@@ -38,7 +38,8 @@ import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import { useMemo } from 'react'
 import { NonfungiblePositionManager, Quoter, UniswapInterfaceMulticall } from 'types/v3'
 import { V3Migrator } from 'types/v3/V3Migrator'
-import { getContract } from 'utils'
+
+import { getContract } from '../utils'
 
 // returns null on errors
 export function useContract<T extends Contract = Contract>(

src/hooks/useCurrentBlockTimestamp.ts

 import { BigNumber } from '@ethersproject/bignumber'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { useInterfaceMulticall } from './useContract'
 
 // gets the current timestamp from the blockchain

src/hooks/useENSAddress.ts

+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 import { safeNamehash } from 'utils/safeNamehash'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import isZero from '../utils/isZero'
 import { useENSRegistrarContract, useENSResolverContract } from './useContract'
 import useDebounce from './useDebounce'

src/hooks/useENSAvatar.ts

@@ -2,11 +2,11 @@ import { BigNumber } from '@ethersproject/bignumber'
 import { hexZeroPad } from '@ethersproject/bytes'
 import { namehash } from '@ethersproject/hash'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import uriToHttp from 'lib/utils/uriToHttp'
 import { useEffect, useMemo, useState } from 'react'
 import { safeNamehash } from 'utils/safeNamehash'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { isAddress } from '../utils'
 import isZero from '../utils/isZero'
 import { useENSRegistrarContract, useENSResolverContract, useERC721Contract, useERC1155Contract } from './useContract'

src/hooks/useENSContentHash.ts

+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 import { safeNamehash } from 'utils/safeNamehash'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import isZero from '../utils/isZero'
 import { useENSRegistrarContract, useENSResolverContract } from './useContract'
 

src/hooks/useENSName.ts

 import { namehash } from '@ethersproject/hash'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { isAddress } from '../utils'
 import isZero from '../utils/isZero'
 import { useENSRegistrarContract, useENSResolverContract } from './useContract'

src/hooks/useERC20Permit.ts

@@ -5,11 +5,11 @@ import { Trade as V2Trade } from '@uniswap/v2-sdk'
 import { Trade as V3Trade } from '@uniswap/v3-sdk'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import JSBI from 'jsbi'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo, useState } from 'react'
 
 import { SWAP_ROUTER_ADDRESSES, V3_ROUTER_ADDRESS } from '../constants/addresses'
 import { DAI, UNI, USDC } from '../constants/tokens'
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { useEIP2612Contract } from './useContract'
 import useIsArgentWallet from './useIsArgentWallet'
 import useTransactionDeadline from './useTransactionDeadline'

src/hooks/useGasPrice.ts

 import JSBI from 'jsbi'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { useContract } from './useContract'
 import useENSAddress from './useENSAddress'
 

src/hooks/useIsArgentWallet.ts

 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { NEVER_RELOAD, useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
-import { NEVER_RELOAD, useSingleCallResult } from '../state/multicall/hooks'
 import { useArgentWalletDetectorContract } from './useContract'
 
 export default function useIsArgentWallet(): boolean {

src/hooks/usePools.ts

@@ -4,10 +4,10 @@ import { abi as IUniswapV3PoolStateABI } from '@uniswap/v3-core/artifacts/contra
 import { computePoolAddress } from '@uniswap/v3-sdk'
 import { FeeAmount, Pool } from '@uniswap/v3-sdk'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { useMultipleContractSingleData } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
 import { V3_CORE_FACTORY_ADDRESSES } from '../constants/addresses'
-import { useMultipleContractSingleData } from '../state/multicall/hooks'
 import { IUniswapV3PoolStateInterface } from '../types/v3/IUniswapV3PoolState'
 
 const POOL_STATE_INTERFACE = new Interface(IUniswapV3PoolStateABI) as IUniswapV3PoolStateInterface

src/hooks/usePositionTokenURI.ts

 import { BigNumber } from '@ethersproject/bignumber'
 import JSBI from 'jsbi'
+import { NEVER_RELOAD, useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
-import { NEVER_RELOAD, useSingleCallResult } from '../state/multicall/hooks'
 import { useV3NFTPositionManagerContract } from './useContract'
 
 type TokenId = number | JSBI | BigNumber

src/hooks/useTokenAllowance.ts

 import { CurrencyAmount, Token } from '@uniswap/sdk-core'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { useTokenContract } from './useContract'
 
 export function useTokenAllowance(token?: Token, owner?: string, spender?: string): CurrencyAmount<Token> | undefined {

src/hooks/useTotalSupply.ts

 import { BigNumber } from '@ethersproject/bignumber'
 import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 
-import { useSingleCallResult } from '../state/multicall/hooks'
 import { useTokenContract } from './useContract'
 
 // returns undefined if input token is undefined, or fails to get token contract,

src/hooks/useV2Pairs.ts

@@ -2,10 +2,10 @@ import { Interface } from '@ethersproject/abi'
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'
 import { abi as IUniswapV2PairABI } from '@uniswap/v2-core/build/IUniswapV2Pair.json'
 import { computePairAddress, Pair } from '@uniswap/v2-sdk'
+import { useMultipleContractSingleData } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
 import { V2_FACTORY_ADDRESSES } from '../constants/addresses'
-import { useMultipleContractSingleData } from '../state/multicall/hooks'
 
 const PAIR_INTERFACE = new Interface(IUniswapV2PairABI)
 

src/hooks/useV3PositionFees.ts

 import { BigNumber } from '@ethersproject/bignumber'
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'
 import { Pool } from '@uniswap/v3-sdk'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import useBlockNumber from 'lib/hooks/useBlockNumber'
 import { useEffect, useState } from 'react'
-import { useSingleCallResult } from 'state/multicall/hooks'
 import { unwrappedToken } from 'utils/unwrappedToken'
 
 import { useV3NFTPositionManagerContract } from './useContract'

src/hooks/useV3Positions.ts

 import { BigNumber } from '@ethersproject/bignumber'
+import { CallStateResult, useSingleCallResult, useSingleContractMultipleData } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
-import { CallStateResult, useSingleCallResult, useSingleContractMultipleData } from 'state/multicall/hooks'
 import { PositionDetails } from 'types/position'
 
 import { useV3NFTPositionManagerContract } from './useContract'

src/index.tsx

@@ -5,6 +5,7 @@ import 'components/analytics'
 
 import { createWeb3ReactRoot, Web3ReactProvider } from '@web3-react/core'
 import { BlockUpdater } from 'lib/hooks/useBlockNumber'
+import { MulticallUpdater } from 'lib/state/multicall'
 import { StrictMode } from 'react'
 import ReactDOM from 'react-dom'
 import { Provider } from 'react-redux'
@@ -19,7 +20,6 @@ import store from './state'
 import ApplicationUpdater from './state/application/updater'
 import ListsUpdater from './state/lists/updater'
 import LogsUpdater from './state/logs/updater'
-import MulticallUpdater from './state/multicall/updater'
 import TransactionUpdater from './state/transactions/updater'
 import UserUpdater from './state/user/updater'
 import ThemeProvider, { ThemedGlobalStyle } from './theme'

src/lib/components/Widget.tsx

 import { DEFAULT_LOCALE, SupportedLocale } from 'constants/locales'
 import { Provider as AtomProvider } from 'jotai'
+import { BlockUpdater } from 'lib/hooks/useBlockNumber'
 import { UNMOUNTING } from 'lib/hooks/useUnmount'
 import { Provider as I18nProvider } from 'lib/i18n'
+import { MulticallUpdater, store as multicallStore } from 'lib/state/multicall'
 import styled, { keyframes, Theme, ThemeProvider } from 'lib/theme'
 import { ComponentProps, JSXElementConstructor, PropsWithChildren, StrictMode, useRef } from 'react'
+import { Provider as ReduxProvider } from 'react-redux'
 import { Provider as EthProvider } from 'widgets-web3-react/types'
 
 import { Provider as DialogProvider } from './Dialog'
@@ -64,6 +67,15 @@ const WidgetWrapper = styled.div<{ width?: number | string }>`
   }
 `
 
+function Updaters() {
+  return (
+    <>
+      <BlockUpdater />
+      <MulticallUpdater />
+    </>
+  )
+}
+
 export type WidgetProps<T extends JSXElementConstructor<any> | undefined = undefined> = {
   theme?: Theme
   locale?: SupportedLocale
@@ -98,11 +110,14 @@ export default function Widget({
           <WidgetWrapper width={width} className={className} ref={wrapper}>
             <DialogProvider value={dialog || wrapper.current}>
               <ErrorBoundary onError={onError}>
+                <ReduxProvider store={multicallStore}>
                   <AtomProvider>
                     <Web3Provider provider={provider} jsonRpcEndpoint={jsonRpcEndpoint}>
+                      <Updaters />
                       {children}
                     </Web3Provider>
                   </AtomProvider>
+                </ReduxProvider>
               </ErrorBoundary>
             </DialogProvider>
           </WidgetWrapper>

src/lib/hooks/multicall.ts

-import { multicall } from 'lib/state/web3'
-
-export const {
-  useMultipleContractSingleData,
-  useSingleContractMultipleData,
-  useSingleContractWithCallData,
-  useSingleCallResult,
-} = multicall.hooks
+import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import useBlockNumber from 'lib/hooks/useBlockNumber'
+import multicall from 'lib/state/multicall'
+import { SkipFirst } from 'types/tuple'
+
+export type { CallStateResult } from '@uniswap/redux-multicall' // re-export for convenience
+export { NEVER_RELOAD } from '@uniswap/redux-multicall' // re-export for convenience
+
+// Create wrappers for hooks so consumers don't need to get latest block themselves
+
+type SkipFirstTwoParams<T extends (...args: any) => any> = SkipFirst<Parameters<T>, 2>
+
+export function useMultipleContractSingleData(
+  ...args: SkipFirstTwoParams<typeof multicall.hooks.useMultipleContractSingleData>
+) {
+  const { chainId, latestBlock } = useCallContext()
+  return multicall.hooks.useMultipleContractSingleData(chainId, latestBlock, ...args)
+}
+
+export function useSingleCallResult(...args: SkipFirstTwoParams<typeof multicall.hooks.useSingleCallResult>) {
+  const { chainId, latestBlock } = useCallContext()
+  return multicall.hooks.useSingleCallResult(chainId, latestBlock, ...args)
+}
+
+export function useSingleContractMultipleData(
+  ...args: SkipFirstTwoParams<typeof multicall.hooks.useSingleContractMultipleData>
+) {
+  const { chainId, latestBlock } = useCallContext()
+  return multicall.hooks.useSingleContractMultipleData(chainId, latestBlock, ...args)
+}
+
+export function useSingleContractWithCallData(
+  ...args: SkipFirstTwoParams<typeof multicall.hooks.useSingleContractWithCallData>
+) {
+  const { chainId, latestBlock } = useCallContext()
+  return multicall.hooks.useSingleContractWithCallData(chainId, latestBlock, ...args)
+}
+
+function useCallContext() {
+  const { chainId } = useActiveWeb3React()
+  const latestBlock = useBlockNumber()
+  return { chainId, latestBlock }
+}

src/state/multicall/updater.tsx → src/lib/state/multicall.tsx

+import { createMulticall } from '@uniswap/redux-multicall'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { useInterfaceMulticall } from 'hooks/useContract'
 import useBlockNumber from 'lib/hooks/useBlockNumber'
+import { combineReducers, createStore } from 'redux'
 
-import { useInterfaceMulticall } from '../../hooks/useContract'
-import { multicall } from './instance'
+const multicall = createMulticall()
+const reducer = combineReducers({ [multicall.reducerPath]: multicall.reducer })
+export const store = createStore(reducer)
 
-// Create Updater wrappers that pull needed info from store
-export default function Updater() {
+export default multicall
+
+export function MulticallUpdater() {
   const latestBlockNumber = useBlockNumber()
   const { chainId } = useActiveWeb3React()
-  const multicall2Contract = useInterfaceMulticall()
-  return <multicall.Updater chainId={chainId} latestBlockNumber={latestBlockNumber} contract={multicall2Contract} />
+  const contract = useInterfaceMulticall()
+  return <multicall.Updater chainId={chainId} latestBlockNumber={latestBlockNumber} contract={contract} />
 }

src/lib/state/web3.ts

-import { createMulticall } from '@uniswap/redux-multicall'
-import { atomWithStore } from 'jotai/redux'
 import { atomWithDefault } from 'jotai/utils'
-import { createStore } from 'redux'
 import { initializeConnector, Web3ReactHooks } from 'widgets-web3-react/core'
 import { EMPTY } from 'widgets-web3-react/empty'
 import { Connector } from 'widgets-web3-react/types'
@@ -12,7 +9,3 @@ export type Web3ReactState = [Connector, Web3ReactHooks]
 
 export const urlAtom = atomWithDefault<Web3ReactState>(() => EMPTY_CONNECTOR)
 export const injectedAtom = atomWithDefault<Web3ReactState>(() => EMPTY_CONNECTOR)
-
-export const multicall = createMulticall()
-const multicallStore = createStore(multicall.reducer)
-export const multicallStoreAtom = atomWithStore(multicallStore)

src/pages/MigrateV2/MigrateV2Pair.tsx

@@ -19,6 +19,7 @@ import { PoolState, usePool } from 'hooks/usePools'
 import useTheme from 'hooks/useTheme'
 import useTransactionDeadline from 'hooks/useTransactionDeadline'
 import JSBI from 'jsbi'
+import { NEVER_RELOAD, useSingleCallResult } from 'lib/hooks/multicall'
 import { ReactNode, useCallback, useEffect, useMemo, useState } from 'react'
 import { AlertCircle, AlertTriangle, ArrowDown } from 'react-feather'
 import ReactGA from 'react-ga'
@@ -43,7 +44,6 @@ import { usePairContract, useV2MigratorContract } from '../../hooks/useContract'
 import { useV2LiquidityTokenPermit } from '../../hooks/useERC20Permit'
 import useIsArgentWallet from '../../hooks/useIsArgentWallet'
 import { useTotalSupply } from '../../hooks/useTotalSupply'
-import { NEVER_RELOAD, useSingleCallResult } from '../../state/multicall/hooks'
 import { TransactionType } from '../../state/transactions/actions'
 import { useTokenBalance } from '../../state/wallet/hooks'
 import { BackArrow, ExternalLink, ThemedText } from '../../theme'

src/pages/Pool/PositionPage.tsx

@@ -22,11 +22,11 @@ import { PoolState, usePool } from 'hooks/usePools'
 import useUSDCPrice from 'hooks/useUSDCPrice'
 import { useV3PositionFees } from 'hooks/useV3PositionFees'
 import { useV3PositionFromTokenId } from 'hooks/useV3Positions'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useCallback, useMemo, useRef, useState } from 'react'
 import ReactGA from 'react-ga'
 import { Link, RouteComponentProps } from 'react-router-dom'
 import { Bound } from 'state/mint/v3/actions'
-import { useSingleCallResult } from 'state/multicall/hooks'
 import { useIsTransactionPending, useTransactionAdder } from 'state/transactions/hooks'
 import styled from 'styled-components/macro'
 import { ExternalLink, HideExtraSmall, ThemedText } from 'theme'

src/state/claim/hooks.ts

@@ -2,13 +2,13 @@ import { TransactionResponse } from '@ethersproject/providers'
 import { CurrencyAmount, Token } from '@uniswap/sdk-core'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import JSBI from 'jsbi'
+import { useSingleCallResult } from 'lib/hooks/multicall'
 import { useEffect, useState } from 'react'
 
 import { UNI } from '../../constants/tokens'
 import { useMerkleDistributorContract } from '../../hooks/useContract'
 import { isAddress } from '../../utils'
 import { calculateGasMargin } from '../../utils/calculateGasMargin'
-import { useSingleCallResult } from '../multicall/hooks'
 import { TransactionType } from '../transactions/actions'
 import { useTransactionAdder } from '../transactions/hooks'
 

src/state/governance/hooks.ts

@@ -18,6 +18,7 @@ import {
   useLatestGovernanceContract,
   useUniContract,
 } from 'hooks/useContract'
+import { useSingleCallResult, useSingleContractMultipleData } from 'lib/hooks/multicall'
 import { useCallback, useMemo } from 'react'
 import { calculateGasMargin } from 'utils/calculateGasMargin'
 
@@ -30,7 +31,6 @@ import {
 } from '../../constants/proposals'
 import { UNI } from '../../constants/tokens'
 import { useLogs } from '../logs/hooks'
-import { useSingleCallResult, useSingleContractMultipleData } from '../multicall/hooks'
 import { TransactionType } from '../transactions/actions'
 import { useTransactionAdder } from '../transactions/hooks'
 import { VoteOption } from './types'

src/state/index.ts

 import { configureStore } from '@reduxjs/toolkit'
 import { setupListeners } from '@reduxjs/toolkit/query/react'
+import multicall from 'lib/state/multicall'
 import { load, save } from 'redux-localstorage-simple'
 
 import application from './application/reducer'
@@ -11,7 +12,6 @@ import lists from './lists/reducer'
 import logs from './logs/slice'
 import mint from './mint/reducer'
 import mintV3 from './mint/v3/reducer'
-import { multicall } from './multicall/instance'
 import { routingApi } from './routing/slice'
 import swap from './swap/reducer'
 import transactions from './transactions/reducer'

src/state/multicall/hooks.ts

-import useActiveWeb3React from 'hooks/useActiveWeb3React'
-import useBlockNumber from 'lib/hooks/useBlockNumber'
-
-import { SkipFirst } from '../../types/tuple'
-import { multicall } from './instance'
-export type { CallStateResult } from '@uniswap/redux-multicall' // re-export for convenience
-export { NEVER_RELOAD } from '@uniswap/redux-multicall' // re-export for convenience
-
-const {
-  useMultipleContractSingleData: _useMultipleContractSingleData,
-  useSingleCallResult: _useSingleCallResult,
-  useSingleContractMultipleData: _useSingleContractMultipleData,
-  useSingleContractWithCallData: _useSingleContractWithCallData,
-} = multicall.hooks
-
-// Create wrappers for hooks so consumers don't need to get latest block themselves
-
-type SkipFirstTwoParams<T extends (...args: any) => any> = SkipFirst<Parameters<T>, 2>
-
-export function useMultipleContractSingleData(...args: SkipFirstTwoParams<typeof _useMultipleContractSingleData>) {
-  const { chainId, latestBlock } = useCallContext()
-  return _useMultipleContractSingleData(chainId, latestBlock, ...args)
-}
-
-export function useSingleCallResult(...args: SkipFirstTwoParams<typeof _useSingleCallResult>) {
-  const { chainId, latestBlock } = useCallContext()
-  return _useSingleCallResult(chainId, latestBlock, ...args)
-}
-
-export function useSingleContractMultipleData(...args: SkipFirstTwoParams<typeof _useSingleContractMultipleData>) {
-  const { chainId, latestBlock } = useCallContext()
-  return _useSingleContractMultipleData(chainId, latestBlock, ...args)
-}
-
-export function useSingleContractWithCallData(...args: SkipFirstTwoParams<typeof _useSingleContractWithCallData>) {
-  const { chainId, latestBlock } = useCallContext()
-  return _useSingleContractWithCallData(chainId, latestBlock, ...args)
-}
-
-function useCallContext() {
-  const { chainId } = useActiveWeb3React()
-  const latestBlock = useBlockNumber()
-  return { chainId, latestBlock }
-}

src/state/multicall/instance.ts

-import { createMulticall } from '@uniswap/redux-multicall'
-
-// Create a multicall instance with default settings
-export const multicall = createMulticall()

src/state/stake/hooks.tsx

@@ -6,10 +6,10 @@ import { Pair } from '@uniswap/v2-sdk'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import useCurrentBlockTimestamp from 'hooks/useCurrentBlockTimestamp'
 import JSBI from 'jsbi'
+import { NEVER_RELOAD, useMultipleContractSingleData } from 'lib/hooks/multicall'
 import { ReactNode, useMemo } from 'react'
 
 import { DAI, UNI, USDC, USDT, WBTC, WRAPPED_NATIVE_CURRENCY } from '../../constants/tokens'
-import { NEVER_RELOAD, useMultipleContractSingleData } from '../multicall/hooks'
 import { tryParseAmount } from '../swap/hooks'
 
 const STAKING_REWARDS_INTERFACE = new Interface(STAKING_REWARDS_ABI)

src/state/wallet/hooks.ts

@@ -4,6 +4,7 @@ import ERC20ABI from 'abis/erc20.json'
 import { Erc20Interface } from 'abis/types/Erc20'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import JSBI from 'jsbi'
+import { useMultipleContractSingleData, useSingleContractMultipleData } from 'lib/hooks/multicall'
 import { useMemo } from 'react'
 
 import { nativeOnChain, UNI } from '../../constants/tokens'
@@ -11,7 +12,6 @@ import { useAllTokens } from '../../hooks/Tokens'
 import { useInterfaceMulticall } from '../../hooks/useContract'
 import { isAddress } from '../../utils'
 import { useUserUnclaimedAmount } from '../claim/hooks'
-import { useMultipleContractSingleData, useSingleContractMultipleData } from '../multicall/hooks'
 import { useTotalUniEarned } from '../stake/hooks'
 /**
  * Returns a map of the given addresses to their eventually consistent ETH balances.

src/utils/index.ts

@@ -4,8 +4,7 @@ import { Contract } from '@ethersproject/contracts'
 import { JsonRpcSigner, Web3Provider } from '@ethersproject/providers'
 import { Token } from '@uniswap/sdk-core'
 import { FeeAmount } from '@uniswap/v3-sdk'
-
-import { TokenAddressMap } from '../state/lists/hooks'
+import { ChainTokenMap } from 'lib/hooks/useTokenList/utils'
 
 // returns the checksummed address if the address is valid, otherwise returns false
 export function isAddress(value: any): string | false {
@@ -48,8 +47,8 @@ export function escapeRegExp(string: string): string {
   return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') // $& means the whole matched string
 }
 
-export function isTokenOnList(tokenAddressMap: TokenAddressMap, token?: Token): boolean {
-  return Boolean(token?.isToken && tokenAddressMap[token.chainId]?.[token.address])
+export function isTokenOnList(chainTokenMap: ChainTokenMap, token?: Token): boolean {
+  return Boolean(token?.isToken && chainTokenMap[token.chainId]?.[token.address])
 }
 
 export function formattedFeeAmount(feeAmount: FeeAmount): number {

tsconfig.lib.json

@@ -5,9 +5,11 @@
     "baseUrl": "src/lib",
     "paths": {
       "lib/*": ["./*"],
+      "abis/*": ["../abis/*"],
       "constants/*": ["../constants/*"],
       "hooks/*": ["../hooks/*"],
       "state/*": ["../state/*"],
+      "types/*": ["../types/*"]
     },
   },
   "exclude": ["node_modules", "src/lib/**/*.test.*"],