diff --git a/frontend/components/Home/UserGrants/RedeemTokens.js b/frontend/components/Home/UserGrants/RedeemTokens.js index c468801..f607889 100644 --- a/frontend/components/Home/UserGrants/RedeemTokens.js +++ b/frontend/components/Home/UserGrants/RedeemTokens.js @@ -17,10 +17,11 @@ import { useState } from "react"; import { BsCash } from "react-icons/bs"; import { useRecoilState } from "recoil"; import { getGrant, redeemGrant } from "../../../lib/store/grants"; +import { useWalletClient } from "wagmi"; export default function RedeemTokens({ tokenId }) { const [[grant], setGrant] = useRecoilState(getGrant(tokenId)); - + const { data: walletClient } = useWalletClient(); const [exchangeMode, setExchangeMode] = useState(false); const [exchangeTokenAmount, setExchangeTokenAmount] = useState(0); const [exchangeTokenAddress, setExchangeTokenAddress] = useState(""); @@ -37,6 +38,7 @@ export default function RedeemTokens({ tokenId }) { const redeem = () => { setLoadingRedemption(true); redeemGrant( + walletClient, grant.tokenId, exchangeMode && exchangeTokenAmount, exchangeMode && exchangeTokenAddress, diff --git a/frontend/lib/store/grants.js b/frontend/lib/store/grants.js index 3f3958b..444613c 100644 --- a/frontend/lib/store/grants.js +++ b/frontend/lib/store/grants.js @@ -7,7 +7,7 @@ import { parseErrorMessage } from "../../lib/utils/helpers"; import { createStandaloneToast } from "@chakra-ui/react"; import theme from "../../styles/theme"; -const toast = createStandaloneToast({ theme }); +const { toast } = createStandaloneToast({ theme }); /**** STATE ****/ @@ -192,12 +192,13 @@ export const fetchGrantsByUser = async (owner) => { }; export const redeemGrant = async ( + walletClient, tokenId, exchangeTokenAmount, exchangeTokenAddress, setGrant ) => { - const provider = new ethers.providers.Web3Provider(window?.ethereum); + const provider = new ethers.providers.Web3Provider(walletClient); const vesterContract = new ethers.Contract( process.env.NEXT_PUBLIC_VESTER_CONTRACT_ADDRESS, @@ -229,25 +230,22 @@ export const redeemGrant = async ( provider.once("block", () => { // Unsure about this wrapping? Originally added to prevent redemptions from old blocks rendering. - vesterContract.once( - "Redemption", - async (redeemedTokenId, address, amount) => { - if (tokenId.toNumber() == redeemedTokenId.toNumber()) { - toast({ - title: "Redemption Successful", - description: `You have redeemed ${( - amount / - 10 ** 18 - ).toLocaleString()} tokens.`, - status: "success", - position: "top", - duration: 10000, - isClosable: true, - }); - } - await fetchGrant(setGrant, tokenId, provider.network.chainId); + vesterContract.once("Redemption", async (redeemedTokenId, amount) => { + if (tokenId.toNumber() == redeemedTokenId.toNumber()) { + toast({ + title: "Redemption Successful", + description: `You have redeemed ${( + amount / + 10 ** 18 + ).toLocaleString()} tokens.`, + status: "success", + position: "top", + duration: 10000, + isClosable: true, + }); } - ); + await fetchGrant(setGrant, tokenId, provider.network.chainId); + }); }); if (exchangeTokenAmount) {