import { BigNumber } from '@ethersproject/bignumber' ; import useContractReader from 'hooks/ContractReader' ; import { useErc20Contract } from 'hooks/Erc20Contract' ; import { CSSProperties } from 'react' ; import { formatWad } from 'utils/formatNumber' ; import FormattedAddress from './FormattedAddress' ; export default function ERC20TokenBalance ( { tokenAddress , wallet , style , precision , } ) { const contract = useErc20Contract ( tokenAddress ) ; const balance = useContractReader < BigNumber > ( { contract , functionName : 'balanceOf' , args : wallet ? [ wallet ] : null , } ) ; const symbol = useContractReader < string > ( { contract , functionName : 'symbol' , } ) ; const decimals = useContractReader < number > ( { contract , functionName : 'decimals' , } ) ; if ( balance === undefined ) return null ; return ( < div style = { style } > { formatWad ( balance , { precision : precision ?? 0 , decimals , } ) } { ' ' } < FormattedAddress label = { symbol } address = { tokenAddress } / > < /div>); }