Upgrade to useDApps/core 1.2.11

package.json

@@ -29,8 +29,8 @@
     "typescript": "^4.3.2"
   },
   "resolutions": {
-    "**/ethers": "5.6.8",
-    "@usedapp/core/ethers": "5.6.8",
+    "**/ethers": "5.6.9",
+    "@usedapp/core/ethers": "5.6.9",
     "**/@ethersproject/contracts": "5.6.2"
   },
   "workspaces": [

packages/nouns-api/package.json

@@ -29,7 +29,7 @@
   "dependencies": {
     "@nouns/contracts": "^0.3.0",
     "dotenv": "^8.2.0",
-    "ethers": "^5.6.8",
+    "ethers": "5.6.9",
     "express": "^4.17.1",
     "express-validator": "^6.12.0",
     "ioredis": "^4.27.6",

packages/nouns-bots/package.json

@@ -28,9 +28,9 @@
   },
   "dependencies": {
     "@nouns/contracts": "^0.3.0",
-    "dotenv": "^8.2.0",
     "discord.js": "^12.5.3",
-    "ethers": "^5.6.8",
+    "dotenv": "^8.2.0",
+    "ethers": "5.6.9",
     "graphql": "^15.3.0",
     "graphql-request": "^3.1.0",
     "ioredis": "^4.27.6",

packages/nouns-contracts/package.json

@@ -55,6 +55,6 @@
     "typechain": "^8.0.0"
   },
   "dependencies": {
-    "ethers": "^5.6.8"
+    "ethers": "5.6.9"
   }
 }

packages/nouns-sdk/package.json

@@ -19,7 +19,7 @@
   },
   "dependencies": {
     "@nouns/contracts": "^0.3.0",
-    "ethers": "^5.6.8"
+    "ethers": "5.6.9"
   },
   "devDependencies": {
     "@types/pngjs": "^6.0.1",

packages/nouns-webapp/package.json

@@ -21,8 +21,8 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
-    "@usedapp/coingecko": "0.5.1",
-    "@usedapp/core": "0.9.1",
+    "@usedapp/coingecko": "1.1.17",
+    "@usedapp/core": "1.2.11",
     "@web3-react/core": "^6.1.9",
     "@web3-react/fortmatic-connector": "^6.1.6",
     "@web3-react/injected-connector": "^6.0.7",
@@ -39,7 +39,7 @@
     "connected-react-router": "^6.9.1",
     "dayjs": "^1.10.7",
     "eslint-config-react-app": "^6.0.0",
-    "ethers": "^5.6.8",
+    "ethers": "5.6.9",
     "framer-motion": "^6.5.1",
     "graphql": "^15.5.1",
     "pngjs": "^6.0.0",
@@ -59,8 +59,7 @@
     "redux": "^4.1.0",
     "redux-devtools-extension": "^2.13.9",
     "remark-breaks": "^3.0.1",
-    "web-vitals": "^1.0.1",
-    "react-transition-group": "^4.4.5"
+    "web-vitals": "^1.0.1"
   },
   "devDependencies": {
     "@types/bad-words": "^3.0.1",

packages/nouns-webapp/src/App.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { ChainId, useEthers } from '@usedapp/core';
 import { useAppDispatch, useAppSelector } from './hooks';
 import { setActiveAccount } from './state/slices/account';
@@ -24,7 +24,8 @@ import dayjs from 'dayjs';
 import DelegatePage from './pages/DelegatePage';
 
 function App() {
-  const { account, chainId, library } = useEthers();
+  const { account, chainId, library, isLoading } = useEthers();
+  const [cachedChainId, setCachedChainId] = useState(chainId);
   const dispatch = useAppDispatch();
   dayjs.extend(relativeTime);
 
@@ -33,11 +34,17 @@ function App() {
     dispatch(setActiveAccount(account));
   }, [account, dispatch]);
 
+  useEffect(() => {
+    if (!isLoading) {
+      setCachedChainId(chainId);
+    }
+  }, [chainId, isLoading]);
+
   const alertModal = useAppSelector(state => state.application.alertModal);
 
   return (
     <div className={`${classes.wrapper}`}>
-      {Number(CHAIN_ID) !== chainId && <NetworkAlert />}
+      {Number(CHAIN_ID) !== cachedChainId && <NetworkAlert />}
       {alertModal.show && (
         <AlertModal
           title={alertModal.title}

packages/nouns-webapp/src/components/Bid/index.tsx

@@ -126,11 +126,15 @@ const Bid: React.FC<{
     }
 
     const value = utils.parseEther(bidInputRef.current.value.toString());
-    const contract = connectContractToSigner(nounsAuctionHouseContract, undefined, library);
+    const contract = connectContractToSigner(
+      nounsAuctionHouseContract,
+      undefined,
+      library && 'getSigner' in library ? library.getSigner() : undefined,
+    );
     const gasLimit = await contract.estimateGas.createBid(auction.nounId, {
       value,
     });
-    placeBid(auction.nounId, {
+    await placeBid(auction.nounId, {
       value,
       gasLimit: gasLimit.add(10_000), // A 10,000 gas pad is used to avoid 'Out of gas' errors
     });

packages/nouns-webapp/src/components/Identicon/index.tsx

@@ -1,16 +1,16 @@
 import Davatar, { Image } from '@davatar/react';
-import { Web3Provider } from '@ethersproject/providers';
+import { BaseProvider } from '@ethersproject/providers';
 import { Component } from 'react';
 
 interface IdenticonInnerProps {
   address: string;
-  provider: Web3Provider;
+  provider: BaseProvider;
   size: number;
 }
 
 interface IdenticonOutterProps {
   address: string;
-  provider?: Web3Provider;
+  provider?: BaseProvider;
   size?: number;
 }
 
@@ -26,7 +26,7 @@ class IdenticonInner extends Component<IdenticonInnerProps> {
     console.log(error, errorInfo);
   }
 
-  renderDavatar(address: string, provider: Web3Provider, size: number) {
+  renderDavatar(address: string, provider: BaseProvider, size: number) {
     return <Davatar address={address} size={size} provider={provider} />;
   }
 

packages/nouns-webapp/src/hooks/useReadonlyProvider.ts

@@ -13,6 +13,6 @@ export function useReadonlyProvider(): providers.JsonRpcProvider | undefined {
     if (!rpcURL) {
       return;
     }
-    return new providers.JsonRpcProvider(rpcURL);
+    return new providers.StaticJsonRpcProvider(rpcURL);
   }, [rpcURL]);
 }

packages/nouns-webapp/src/utils/lookupNNSOrENS.ts

@@ -1,4 +1,4 @@
-import { Web3Provider } from '@ethersproject/providers';
+import { BaseProvider } from '@ethersproject/providers';
 import { BigNumber as EthersBN, utils } from 'ethers';
 
 /**
@@ -8,7 +8,7 @@ import { BigNumber as EthersBN, utils } from 'ethers';
  * @returns  NNS or ENS or null (if neither resolve)
  */
 export async function lookupNNSOrENS(
-  library: Web3Provider,
+  library: BaseProvider,
   address: string,
 ): Promise<string | null> {
   try {

packages/nouns-webapp/src/wrappers/nounsAuction.ts

@@ -1,9 +1,5 @@
-import {
-  connectContractToSigner,
-  useContractCall,
-  useEthers,
-  useContractFunction,
-} from '@usedapp/core';
+import { useContractCall, useEthers, useContractFunction } from '@usedapp/core';
+import { connectContractToSigner } from '@usedapp/core/dist/cjs/src/hooks';
 import { BigNumber as EthersBN, utils } from 'ethers';
 import { NounsAuctionHouseABI, NounsAuctionHouseFactory } from '@nouns/sdk';
 import config from '../config';
@@ -94,9 +90,13 @@ export const useSettleCurrentAndCreateNewAuction = () => {
 
   return {
     send: async (...args: any[]): Promise<void> => {
-      const contract = connectContractToSigner(nounsAuctionHouseContract, undefined, library);
+      const contract = connectContractToSigner(
+        nounsAuctionHouseContract,
+        undefined,
+        library && 'getSigner' in library ? library.getSigner() : undefined,
+      );
       const gasLimit = await contract.estimateGas.settleCurrentAndCreateNewAuction(...args);
-      settleAuction(...args, {
+      await settleAuction(...args, {
         gasLimit: gasLimit.add(45_000), // A 45,000 gas pad is used to avoid 'Out of gas' errors
       });
     },

packages/nouns-webapp/src/wrappers/nounsDao.ts

@@ -1,13 +1,13 @@
 import { NounsDAOV2ABI, NounsDaoLogicV2Factory } from '@nouns/sdk';
 import {
   ChainId,
-  connectContractToSigner,
   useBlockNumber,
   useContractCall,
   useContractCalls,
   useContractFunction,
   useEthers,
 } from '@usedapp/core';
+import { connectContractToSigner } from '@usedapp/core/dist/cjs/src/hooks';
 import { utils, BigNumber as EthersBN } from 'ethers';
 import { defaultAbiCoder, Result } from 'ethers/lib/utils';
 import { useMemo } from 'react';
@@ -109,7 +109,9 @@ export interface PartialProposalSubgraphEntity {
   quorumVotes: string;
 }
 
-export interface ProposalSubgraphEntity extends ProposalTransactionDetails, PartialProposalSubgraphEntity {
+export interface ProposalSubgraphEntity
+  extends ProposalTransactionDetails,
+    PartialProposalSubgraphEntity {
   description: string;
   createdBlock: string;
   createdTransactionHash: string;
@@ -532,10 +534,14 @@ export const useCastRefundableVote = () => {
   );
 
   return {
-    castRefundableVote: async (...args: any[]): Promise<void> => {
-      const contract = connectContractToSigner(nounsDaoContract, undefined, library);
-      const gasLimit = await contract.estimateGas.castRefundableVote(...args);
-      return castRefundableVote(...args, {
+    castRefundableVote: async (proposalId: any, support: any): Promise<void> => {
+      const contract = connectContractToSigner(
+        nounsDaoContract,
+        undefined,
+        library && 'getSigner' in library ? library.getSigner() : undefined,
+      );
+      const gasLimit = await contract.estimateGas.castRefundableVote(proposalId, support);
+      await castRefundableVote(proposalId, support, {
         gasLimit: gasLimit.add(20_000), // A 20,000 gas pad is used to avoid 'Out of gas' errors
       });
     },
@@ -552,10 +558,22 @@ export const useCastRefundableVoteWithReason = () => {
   );
 
   return {
-    castRefundableVoteWithReason: async (...args: any[]): Promise<void> => {
-      const contract = connectContractToSigner(nounsDaoContract, undefined, library);
-      const gasLimit = await contract.estimateGas.castRefundableVoteWithReason(...args);
-      return castRefundableVoteWithReason(...args, {
+    castRefundableVoteWithReason: async (
+      proposalId: any,
+      support: any,
+      reason: any,
+    ): Promise<void> => {
+      const contract = connectContractToSigner(
+        nounsDaoContract,
+        undefined,
+        library && 'getSigner' in library ? library.getSigner() : undefined,
+      );
+      const gasLimit = await contract.estimateGas.castRefundableVoteWithReason(
+        proposalId,
+        support,
+        reason,
+      );
+      await castRefundableVoteWithReason(proposalId, support, reason, {
         gasLimit: gasLimit.add(20_000), // A 20,000 gas pad is used to avoid 'Out of gas' errors
       });
     },