diff --git a/README.md b/README.md index 75b395d3b..75de11f28 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@

maker logo

-

Waving Hand Maker Governance Portal

+

Maker Governance Portal

An open source interface for Dai Credit System governance diff --git a/cypress/support/commons/token.helpers.ts b/cypress/support/commons/token.helpers.ts deleted file mode 100644 index 22c1c6f43..000000000 --- a/cypress/support/commons/token.helpers.ts +++ /dev/null @@ -1,32 +0,0 @@ -import ERC20_ABI from '../../fixtures/erc20_abi.json'; -import { ethers } from 'ethers'; -import { TEST_ACCOUNTS } from '../constants/testaccounts'; -import ethSDKConfig from 'modules/contracts/eth-sdk.config'; -import { getDefaultProvider } from 'modules/web3/helpers/getDefaultProvider'; - -export async function sendMKR(accountTo: string, amount: number) { - const _url = 'http://localhost:8545'; - const provider = getDefaultProvider(_url); - - // @ts-ignore - const signer = new ethers.Wallet(TEST_ACCOUNTS.normal.key, provider); - - const token = new ethers.Contract(ethSDKConfig?.contracts?.goerli?.mkr as string, ERC20_ABI, signer); - await token.transfer(accountTo, ethers.utils.parseEther(amount.toString())); -} - -export async function sendETH(accountTo: string, amount: number) { - const _url = 'http://localhost:8545'; - const provider = getDefaultProvider(_url); - - // Increase nonce - const accountNonce = - '0x' + ((await provider.getTransactionCount(TEST_ACCOUNTS.normal.address)) + 1).toString(16); - // @ts-ignore - const signer = new ethers.Wallet(TEST_ACCOUNTS.normal.key, provider); - await signer.sendTransaction({ - to: accountTo, - value: ethers.utils.parseEther(amount.toString()), - nonce: accountNonce - }); -} diff --git a/lib/davatar/Image.tsx b/lib/davatar/Image.tsx index 4e3446ba6..44635a7ab 100644 --- a/lib/davatar/Image.tsx +++ b/lib/davatar/Image.tsx @@ -24,13 +24,11 @@ export interface Props { address?: string | null; style?: CSSProperties; className?: string; - // deprecated - graphApiKey?: string; provider?: BaseProvider | null; defaultComponent?: ReactChild | ReactChild[]; } -export const getCachedUrl = (key: string) => { +export const getCachedUrl = (key: string): string | null => { const normalizedKey = key.toLowerCase(); const cachedItem = window.localStorage.getItem(`davatar/${normalizedKey}`); @@ -82,7 +80,15 @@ export const getGatewayUrl = (uri: string, tokenId?: string): string => { return tokenId ? url.replaceAll('{id}', tokenId) : url; }; -export default function Avatar({ uri, style, className, size, address, provider, defaultComponent }: Props) { +export default function Avatar({ + uri, + style, + className, + size, + address, + provider, + defaultComponent +}: Props): JSX.Element { const [url, setUrl] = useState(null); const [loaded, setLoaded] = useState(false); diff --git a/lib/davatar/index.tsx b/lib/davatar/index.tsx index f7599babd..e10b0606a 100644 --- a/lib/davatar/index.tsx +++ b/lib/davatar/index.tsx @@ -1,5 +1,5 @@ -import { Web3Provider, getDefaultProvider, BaseProvider } from '@ethersproject/providers'; import { SupportedChainId } from 'modules/web3/constants/chainID'; +import { useActiveWeb3React } from 'modules/web3/hooks/useActiveWeb3React'; import { useEffect, useState, ReactChild, CSSProperties } from 'react'; import Image from './Image'; @@ -9,48 +9,20 @@ export { default as Image } from './Image'; export interface DavatarProps { size: number; address: string; - // eslint-disable-next-line @typescript-eslint/no-explicit-any - provider?: any; - // deprecated - graphApiKey?: string; defaultComponent?: ReactChild | ReactChild[]; style?: CSSProperties; } -export default function Davatar({ - size, - address, - provider, - graphApiKey, - defaultComponent, - style -}: DavatarProps) { +export default function Davatar({ size, address, defaultComponent, style }: DavatarProps): JSX.Element { + const { chainId, library } = useActiveWeb3React(); const [avatarUri, setAvatarUri] = useState(null); - const [ethersProvider, setEthersProvider] = useState(null); useEffect(() => { - let eth = getDefaultProvider(); - let chainId; - let isEthers = false; - - if (provider) { - if (provider.currentProvider?.chainId) { - chainId = parseInt(provider.currentProvider.chainId); - } else if (provider.network?.chainId) { - isEthers = true; - chainId = provider.network.chainId; - } - - if ([1, 3, 4, 5].includes(chainId)) { - eth = isEthers ? (provider as BaseProvider) : new Web3Provider(provider.currentProvider); - } - - setEthersProvider(eth); - + if (library) { if (chainId !== SupportedChainId.GOERLIFORK) { - eth.lookupAddress(address).then(ensName => { + library.lookupAddress(address).then(ensName => { if (ensName) { - eth.getResolver(ensName).then(resolver => { + library.getResolver(ensName).then(resolver => { resolver && resolver.getText('avatar').then(avatar => { if (avatar && avatar.length > 0) { @@ -62,15 +34,14 @@ export default function Davatar({ }); } } - }, [address, provider]); + }, [address, library]); return ( diff --git a/modules/address/components/Address.tsx b/modules/address/components/Address.tsx index 7cf6f5a74..0570d7267 100644 --- a/modules/address/components/Address.tsx +++ b/modules/address/components/Address.tsx @@ -1,23 +1,31 @@ import { limitString } from 'lib/string'; import { formatAddress } from 'lib/utils'; import { getENS } from 'modules/web3/helpers/ens'; +import { useActiveWeb3React } from 'modules/web3/hooks/useActiveWeb3React'; import React, { useEffect, useState } from 'react'; -export function Address({ address, maxLength }: { address: string; maxLength?: number }): React.ReactElement { +export const Address = React.memo(function Address({ + address, + maxLength +}: { + address: string; + maxLength?: number; +}): React.ReactElement { + const { library } = useActiveWeb3React(); const [addressFormated, setAddressFormatted] = useState(formatAddress(address || '').toLowerCase()); - async function fetchENSName(address: string) { - if (!address) { + async function fetchENSName() { + if (!address || !library) { return; } - const ens = await getENS(address); + const ens = await getENS({ address, library }); ens ? setAddressFormatted(ens) : setAddressFormatted(formatAddress(address).toLowerCase()); } useEffect(() => { if (address) { - fetchENSName(address); + fetchENSName(); } }, [address]); @@ -26,4 +34,4 @@ export function Address({ address, maxLength }: { address: string; maxLength?: n {maxLength ? limitString(addressFormated, maxLength, '...') : addressFormated} ); -} +}); diff --git a/modules/address/components/AddressIcon.tsx b/modules/address/components/AddressIcon.tsx index 26af379c2..78bb76e44 100644 --- a/modules/address/components/AddressIcon.tsx +++ b/modules/address/components/AddressIcon.tsx @@ -2,7 +2,6 @@ import { Box } from 'theme-ui'; import Davatar from 'lib/davatar'; import { useDelegateAddressMap } from 'modules/delegates/hooks/useDelegateAddressMap'; import { DelegatePicture } from 'modules/delegates/components'; -import { useActiveWeb3React } from 'modules/web3/hooks/useActiveWeb3React'; export default function AddressIcon({ address, @@ -12,14 +11,13 @@ export default function AddressIcon({ width?: number; }): React.ReactElement { const { data: delegateAddresses } = useDelegateAddressMap(); - const { library } = useActiveWeb3React(); return ( {delegateAddresses[address] ? ( ) : ( - + )} ); diff --git a/modules/app/components/layout/Header.tsx b/modules/app/components/layout/Header.tsx index 9d70054ea..15aaf1be5 100644 --- a/modules/app/components/layout/Header.tsx +++ b/modules/app/components/layout/Header.tsx @@ -132,8 +132,8 @@ const Header = (): JSX.Element => { const [showMobileMenu, setShowMobileMenu] = useState(false); const bpi = useBreakpointIndex(); const { account } = useAccount(); - const { data: gas } = useGasPrice(); const { network } = useActiveWeb3React(); + const { data: gas } = useGasPrice({ network }); const { cache } = useSWRConfig(); const [mode, setMode] = useColorMode(); diff --git a/modules/delegates/components/DelegateAvatarName.tsx b/modules/delegates/components/DelegateAvatarName.tsx index 14d707ed4..156034a8d 100644 --- a/modules/delegates/components/DelegateAvatarName.tsx +++ b/modules/delegates/components/DelegateAvatarName.tsx @@ -38,7 +38,7 @@ export default function DelegateAvatarName({ delegate }: { delegate: Delegate }) )} -
+ {delegate.voteDelegateAddress &&
} ); diff --git a/modules/delegates/components/DelegatePicture.tsx b/modules/delegates/components/DelegatePicture.tsx index 53792b45c..d034006d0 100644 --- a/modules/delegates/components/DelegatePicture.tsx +++ b/modules/delegates/components/DelegatePicture.tsx @@ -4,7 +4,6 @@ import { Icon } from '@makerdao/dai-ui-icons'; import { Delegate } from 'modules/delegates/types'; import { DelegateStatusEnum } from 'modules/delegates/delegates.constants'; import Tooltip from 'modules/app/components/Tooltip'; -import { useActiveWeb3React } from 'modules/web3/hooks/useActiveWeb3React'; import { Address } from 'modules/address/components/Address'; import { InternalLink } from 'modules/app/components/InternalLink'; @@ -15,8 +14,6 @@ export function DelegatePicture({ delegate: Delegate; width?: number; }): React.ReactElement { - const { library } = useActiveWeb3React(); - const tooltipAvatarWidth = 68; const delegateMetrics = ( @@ -42,7 +39,7 @@ export function DelegatePicture({ /> ) : ( - + )} {delegate.status === DelegateStatusEnum.recognized && ( @@ -149,7 +146,7 @@ export function DelegatePicture({ /> ) : ( - + )} diff --git a/modules/web3/helpers/ens.ts b/modules/web3/helpers/ens.ts index edadf57c5..cb670d78c 100644 --- a/modules/web3/helpers/ens.ts +++ b/modules/web3/helpers/ens.ts @@ -1,11 +1,16 @@ import { SupportedNetworks } from '../constants/networks'; import { getDefaultProvider } from './getDefaultProvider'; +import { Web3Provider } from '@ethersproject/providers'; -export async function getENS(address: string): Promise { - const provider = getDefaultProvider(SupportedNetworks.MAINNET); - +export async function getENS({ + address, + library +}: { + address: string; + library: Web3Provider; +}): Promise { try { - const name = await provider.lookupAddress(address); + const name = await library.lookupAddress(address); return name; } catch (err) { console.log(err); diff --git a/modules/web3/hooks/useGasPrice.ts b/modules/web3/hooks/useGasPrice.ts index 4f9d686f4..4845e3e2a 100644 --- a/modules/web3/hooks/useGasPrice.ts +++ b/modules/web3/hooks/useGasPrice.ts @@ -1,4 +1,5 @@ import useSWR from 'swr'; +import { SupportedNetworks } from '../constants/networks'; import { fetchGasPrice } from '../helpers/fetchGasPrice'; type GasResponse = { @@ -7,8 +8,12 @@ type GasResponse = { error?: Error; }; -export const useGasPrice = (): GasResponse => { - const { data, error } = useSWR('fetch-gas', () => fetchGasPrice('fast'), { refreshInterval: 15000 }); +export const useGasPrice = ({ network }: { network: SupportedNetworks }): GasResponse => { + const { data, error } = useSWR( + network && network === SupportedNetworks.MAINNET ? 'fetch-gas' : null, + () => fetchGasPrice('fast'), + { refreshInterval: 15000 } + ); return { data,