diff --git a/client/components/Web3Button.tsx b/client/components/Web3Button.tsx index 915a3124..8b8b5851 100644 --- a/client/components/Web3Button.tsx +++ b/client/components/Web3Button.tsx @@ -1,3 +1,4 @@ +import Link from "next/link"; import { ConnectButton as RainbowKitConnect } from "@rainbow-me/rainbowkit"; import useShowDelegationModalOption from "utils/useShowDelegationModalOption"; import classnames from "classnames"; @@ -69,14 +70,23 @@ const ConnectButton = ({ inPage = false, needToShowDelegation = false }) => { } return ( - +
+ + {needToShowDelegation && ( + + + + )} +
); })()} @@ -86,17 +96,6 @@ const ConnectButton = ({ inPage = false, needToShowDelegation = false }) => { ); }; -/* -{needToShowDelegation && ( - - Vote register - - )} - */ - interface Web3ButtonProps { inPage?: boolean; } diff --git a/client/components/vote-escrow/LockupForm.tsx b/client/components/vote-escrow/LockupForm.tsx index 12022a9c..77bedc93 100644 --- a/client/components/vote-escrow/LockupForm.tsx +++ b/client/components/vote-escrow/LockupForm.tsx @@ -24,6 +24,7 @@ import numeral from "numeraljs"; import { decimal18Bn } from "utils"; import useStakingAPY from "utils/useStakingAPY"; import classnames from "classnames"; +import { useSigner } from "wagmi"; interface LockupFormProps { existingLockup?: Object; @@ -126,6 +127,7 @@ const LockupForm: FunctionComponent = ({ existingLockup }) => { blockTimestamp, } = useStore(); const router = useRouter(); + const { data: signer } = useSigner(); const [lockupAmount, setLockupAmount] = useState( existingLockup @@ -219,11 +221,11 @@ const LockupForm: FunctionComponent = ({ existingLockup }) => { let transaction; try { - transaction = await contracts.OriginDollarGovernance.approve( - contracts.OgvStaking.address, - ethers.constants.MaxUint256, - { gasLimit: 144300 } - ); + transaction = await contracts.OriginDollarGovernance.connect( + signer + ).approve(contracts.OgvStaking.address, ethers.constants.MaxUint256, { + gasLimit: 144300, + }); } catch (e) { setTransactionError("Error approving!"); setApprovalStatus("ready"); @@ -273,6 +275,7 @@ const LockupForm: FunctionComponent = ({ existingLockup }) => { // If lockup amount === 100% of the user's OGV balance then use the actual balance BigNumber let amountToStake = ethers.utils.parseUnits(lockupAmount); + if (lockupAmount === formattedOgvBalance) { amountToStake = balances.ogv; // Prevents rounding } @@ -282,15 +285,15 @@ const LockupForm: FunctionComponent = ({ existingLockup }) => { // When the user has delegation set already, it'll be ~200k. const maxGasNeeded = 350000 * 1.2; // Adds a buffer - const gasEstimate = await contracts.OgvStaking.estimateGas[ - "stake(uint256,uint256)" - ](amountToStake, duration); + const gasEstimate = await contracts.OgvStaking.connect( + signer + ).estimateGas["stake(uint256,uint256)"](amountToStake, duration); - transaction = await contracts.OgvStaking["stake(uint256,uint256)"]( - amountToStake, - duration, - { gasLimit: Math.max(Math.ceil(gasEstimate * 1.25), maxGasNeeded) } - ); + transaction = await contracts.OgvStaking.connect(signer)[ + "stake(uint256,uint256)" + ](amountToStake, duration, { + gasLimit: Math.max(Math.ceil(gasEstimate * 1.25), maxGasNeeded), + }); } catch (e) { setTransactionError("Error locking up!"); setLockupStatus("ready"); @@ -348,15 +351,18 @@ const LockupForm: FunctionComponent = ({ existingLockup }) => { // When the user has delegation set already, it'll be ~200k. const maxGasNeeded = 300000 * 1.2; // Adds a buffer - const gasEstimate = await contracts.OgvStaking.estimateGas[ - "extend(uint256,uint256)" - ](existingLockup.lockupId, duration); - - transaction = await contracts.OgvStaking["extend(uint256,uint256)"]( + const gasEstimate = await contracts.OgvStaking.connect( + signer + ).estimateGas["extend(uint256,uint256)"]( existingLockup.lockupId, - duration, - { gasLimit: Math.max(Math.ceil(gasEstimate * 1.25), maxGasNeeded) } + duration ); + + transaction = await contracts.OgvStaking.connect(signer)[ + "extend(uint256,uint256)" + ](existingLockup.lockupId, duration, { + gasLimit: Math.max(Math.ceil(gasEstimate * 1.25), maxGasNeeded), + }); } catch (e) { setTransactionError("Error extending lockup!"); setLockupStatus("ready"); diff --git a/client/components/vote-escrow/LockupsTable.tsx b/client/components/vote-escrow/LockupsTable.tsx index 52bef769..38d84ede 100644 --- a/client/components/vote-escrow/LockupsTable.tsx +++ b/client/components/vote-escrow/LockupsTable.tsx @@ -15,8 +15,11 @@ import { truncateEthAddress } from "utils"; import EtherscanIcon from "components/EtherscanIcon"; import ExternalLinkIcon from "../ExternalLinkIcon"; import classnames from "classnames"; +import { useSigner } from "wagmi"; const LockupsTable: FunctionComponent = () => { + const { data: signer } = useSigner(); + const { lockups, pendingTransactions, contracts, blockTimestamp, chainId } = useStore(); @@ -36,10 +39,13 @@ const LockupsTable: FunctionComponent = () => { } const handleUnlock = async (lockupId) => { - const transaction = await contracts.OgvStaking["unstake(uint256)"]( - lockupId, - { gasLimit: 210000 } - ); + const gasLimit = await contracts.OgvStaking.connect(signer).estimateGas[ + "unstake(uint256)" + ](lockupId); + + const transaction = await contracts.OgvStaking.connect(signer)[ + "unstake(uint256)" + ](lockupId, { gasLimit }); useStore.setState({ pendingTransactions: [ diff --git a/client/components/vote-escrow/YourLockups.tsx b/client/components/vote-escrow/YourLockups.tsx index 33248e72..568039f2 100644 --- a/client/components/vote-escrow/YourLockups.tsx +++ b/client/components/vote-escrow/YourLockups.tsx @@ -1,24 +1,34 @@ import { FunctionComponent, useState } from "react"; +import dynamic from "next/dynamic"; +import { toast } from "react-toastify"; +import Image from "next/image"; +import { useAccount, useSigner } from "wagmi"; import Card from "components/Card"; import Link from "components/Link"; import { SectionTitle } from "components/SectionTitle"; import { useStore } from "utils/store"; import { Loading } from "components/Loading"; -import { toast } from "react-toastify"; import useAccountBalances from "utils/useAccountBalances"; -import Image from "next/image"; -import DisabledButtonToolTip from "../DisabledButtonTooltip"; -import LockupsTable from "./LockupsTable"; import { Web3Button } from "components/Web3Button"; import useStakingAPY from "utils/useStakingAPY"; -import { useAccount, useSigner } from "wagmi"; +import DisabledButtonToolTip from "../DisabledButtonTooltip"; interface YourLockupsProps {} +const LockupsTable = dynamic(() => import("./LockupsTable"), { + ssr: false, +}); + const YourLockups: FunctionComponent = () => { const { isConnected } = useAccount(); - const { lockups, pendingTransactions, contracts, balances, totalBalances } = - useStore(); + const { + lockups, + pendingTransactions, + contracts, + balances, + totalBalances, + rpcProvider, + } = useStore(); const { data: signer } = useSigner(); const { ogv, accruedRewards } = balances; const { totalPercentageOfLockedUpOgv } = totalBalances; @@ -64,9 +74,7 @@ const YourLockups: FunctionComponent = () => { let receipt; try { - receipt = await contracts.rpcProvider.waitForTransaction( - transaction.hash - ); + receipt = await rpcProvider.waitForTransaction(transaction.hash); } catch (e) { setCollectRewardsStatus("ready"); throw e; diff --git a/client/pages/stake/index.tsx b/client/pages/stake/index.tsx index 3a192e3b..b27999b1 100644 --- a/client/pages/stake/index.tsx +++ b/client/pages/stake/index.tsx @@ -1,11 +1,24 @@ +import dynamic from "next/dynamic"; import { PageTitle } from "components/PageTitle"; import { SectionTitle } from "components/SectionTitle"; import CardGroup from "components/CardGroup"; import Wrapper from "components/Wrapper"; -import AccountBalances from "components/vote-escrow/AccountBalances"; -import YourLockups from "components/vote-escrow/YourLockups"; import Seo from "components/Seo"; +const AccountBalances = dynamic( + () => import("components/vote-escrow/AccountBalances"), + { + ssr: false, + } +); + +const YourLockups = dynamic( + () => import("components/vote-escrow/YourLockups"), + { + ssr: false, + } +); + export default function VoteEscrow() { return ( diff --git a/client/pages/stake/new.tsx b/client/pages/stake/new.tsx index 2b97647e..cbcd0ac6 100644 --- a/client/pages/stake/new.tsx +++ b/client/pages/stake/new.tsx @@ -1,4 +1,5 @@ import type { NextPage } from "next"; +import { useState, useEffect } from "react"; import { Disconnected } from "components/Disconnected"; import Wrapper from "components/Wrapper"; import { PageTitle } from "components/PageTitle"; @@ -11,8 +12,13 @@ import { useAccount } from "wagmi"; const LockupNew: NextPage = () => { const { isConnected } = useAccount(); + const [isMounted, setIsMounted] = useState(false); - if (!isConnected) { + useEffect(() => { + setIsMounted(true); + }, []); + + if (!isMounted || !isConnected) { return ( diff --git a/client/utils/useBlock.tsx b/client/utils/useBlock.tsx index 413df2f8..8410187f 100644 --- a/client/utils/useBlock.tsx +++ b/client/utils/useBlock.tsx @@ -2,15 +2,19 @@ import { useEffect, useState } from "react"; import { useStore } from "utils/store"; import { useNetworkInfo } from "utils/index"; import { useAccount } from "wagmi"; +import { ethers } from "ethers"; +import { RPC_URLS } from "@/constants/index"; const useBlock = () => { const networkInfo = useNetworkInfo(); const { isConnected } = useAccount(); - const { provider } = useStore(); const [refetchBlock, setRefetchBlock] = useState(0); useEffect(() => { const getBlockTimestamp = async () => { + const provider = new ethers.providers.JsonRpcProvider( + RPC_URLS[networkInfo.envNetwork] + ); const currentBlock = await provider?.getBlockNumber(); const block = await provider?.getBlock(currentBlock); return block?.timestamp; @@ -18,14 +22,16 @@ const useBlock = () => { let intervalId: ReturnType; - if (isConnected && networkInfo.correct) { - intervalId = setInterval(() => { - Promise.all([getBlockTimestamp()]).then(([blockTimestamp]) => { - useStore.setState({ - blockTimestamp, - }); + const pullTimestamp = () => { + Promise.all([getBlockTimestamp()]).then(([blockTimestamp]) => { + useStore.setState({ + blockTimestamp, }); - }, 4000); + }); + }; + + if (isConnected && networkInfo.correct) { + intervalId = setInterval(pullTimestamp, 4000); } return () => clearInterval(intervalId); diff --git a/client/utils/useContracts.tsx b/client/utils/useContracts.tsx index 78572faf..3dc8963b 100644 --- a/client/utils/useContracts.tsx +++ b/client/utils/useContracts.tsx @@ -1,7 +1,7 @@ import { useEffect } from "react"; import { ethers } from "ethers"; import OUSDContracts from "networks/network.mainnet.json"; -import { CHAIN_CONTRACTS, mainnetNetworkUrl, RPC_URLS } from "constants/index"; +import { CHAIN_CONTRACTS, RPC_URLS } from "constants/index"; import { useStore } from "utils/store"; import { useNetworkInfo } from "utils/index"; import { useAccount, useNetwork, useSigner } from "wagmi"; @@ -20,6 +20,7 @@ const useContracts = () => { const loadContracts = async () => { useStore.setState({ + provider, contracts: { loaded: false, },