feat: update balances after a mutation

gnosis · Sep 30, 2023 · 5a87c62 · 5a87c62
1 parent f2db873
commit 5a87c62
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 50 deletions.
diff --git a/src/components/ActionButton/ActionButton.tsx b/src/components/ActionButton/ActionButton.tsx
@@ -1,57 +1,34 @@
-import React, { useContext, useState, useEffect, useRef, KeyboardEvent } from "react";
-import ethers from "ethers";
-import { formatWei, VaultState, FormState } from "../../utils/utils";
-import { chains } from "../../constants";
-import {
-  usePrepareContractWrite,
-  useContractWrite,
-  useBalance,
-  useContractRead,
-  useWaitForTransaction,
-  useAccount,
-} from "wagmi";
-
-// ABIS
-import ERC20Abi from "../../abis/MyVaultTokenERC20.json";
-import ERC4626Abi from "../../abis/MyVaultTokenERC4626.json";
-import AdapterAbi from "../../abis/VaultAdapter.json";
-import ReceiverAbi from "../../abis/BridgeReceiver.json";
+import React from "react";
+import { TransactionReceipt } from "viem";
+import { useWaitForTransaction } from "wagmi";
 
 interface IActionButtonProps {
-    method:string;
-    mutationTrigger:(() => void) | undefined;
-    mutationData:any;
-}
+  method: string;
+  mutationData: any;
+  mutationTrigger?: () => void;
 
-const ADAPTER: `0x${string}` = "0x0EA5928162b0F74BAEf31c00A04A4cEC5Fe9f4b2";
-const RCV: `0x${string}` = "0x071bf5695afeda65c405794c6574ae63ca8b73c3";
-const WXDAI: `0x${string}` = "0x18c8a7ec7897177E4529065a7E7B0878358B3BfF";
-const VAULT: `0x${string}` = "0x20e5eB701E8d711D419D444814308f8c2243461F";
+  // TODO: Import this type? Define it dynamically somehow?
+  onSettled?: (data: TransactionReceipt | undefined, error: Error | null) => void;
+}
 
 const ActionButton: React.FC<IActionButtonProps> = ({
   method,
   mutationTrigger,
   mutationData,
+  onSettled,
 }) => {
-  const { address } = useAccount();
-
-
-  const waitForTransaction = useWaitForTransaction({
+  useWaitForTransaction({
     confirmations: 1,
     hash: mutationData?.hash,
+    onSettled,
   });
 
   return (
-   // <div className="full-width">
-      <div
-        className="page-component__main__input__action-btn"
-        onClick={() => {
-            mutationTrigger?.();
-        }}
-      >
-        {method}
-      </div>
-  //  </div>
+    // <div className="full-width">
+    <div className="page-component__main__input__action-btn" onClick={() => mutationTrigger?.()}>
+      {method}
+    </div>
+    //  </div>
   );
 };
 

diff --git a/src/components/Form/Form.tsx b/src/components/Form/Form.tsx
@@ -4,7 +4,7 @@ import Input from "../../components/Input/Input";
 import ActionButton from "../../components/ActionButton/ActionButton";
 import "../../constants";
 import { formatWei } from "../../utils/utils";
-import { usePrepareContractWrite, useContractWrite,useContractRead, erc20ABI, useBalance, useAccount, erc4626ABI } from "wagmi";
+import { usePrepareContractWrite, useContractWrite, erc20ABI, useBalance, useAccount } from "wagmi";
 
 import sDaiLogo from "../../assets/Savings-xDAI.svg";
 import wxdaiLogo from "../../assets/xdai.png";
@@ -19,7 +19,12 @@ import {
 import { VaultAdapter } from "../../abis/VaultAdapter";
 
 // Hooks
-import { useTokenAllowance,useUserReservesBalance } from "../../hooks/useData";
+import {
+  useReceiverData,
+  useTokenAllowance,
+  useTotalSupply,
+  useUserReservesBalance,
+} from "../../hooks/useData";
 
 // Constants
 const GAS_PRICE_OFFSET = BigInt("10000000000000000");
@@ -115,7 +120,7 @@ const Form: React.FC = () => {
       name: "Redeem xDAI",
       action: Actions.RedeemXDAI,
     };*/
-  }, [isDeposit, isNative, depositAllowance.data, withdrawAllowance.data]);
+  }, [isDeposit, isNative, depositAllowance.data, withdrawAllowance.data, amount]);
 
   const approveWXDAI = useContractWrite(
     usePrepareContractWrite({
@@ -188,6 +193,19 @@ const Form: React.FC = () => {
     }).config,
   );
 
+  // Store update
+  // TODO: Move this up
+  const totalShares = useTotalSupply();
+  const { dripRate, lastClaimTimestamp } = useReceiverData();
+
+  const refetch = () => {
+    totalShares.refetch();
+    dripRate.refetch();
+    lastClaimTimestamp.refetch();
+    sharesBalance.refetch();
+    reservesBalance.refetch();
+  };
+
   if (depositAllowance.isFetching || withdrawAllowance.isFetching || nativeBalance.isFetching) {
     return <p>Loading...</p>;
   }
@@ -256,13 +274,13 @@ const Form: React.FC = () => {
             <div
               className="page-component__main__input__max-btn"
               onClick={() => {
-                if(isDeposit)
-                if (!isNative) {
-                  assetBalance.data && setAmount(assetBalance.data.value);
-                } else {
-                  nativeBalance.data && setAmount(nativeBalance.data.value - GAS_PRICE_OFFSET);
-                }
-                else{
+                if (isDeposit)
+                  if (!isNative) {
+                    assetBalance.data && setAmount(assetBalance.data.value);
+                  } else {
+                    nativeBalance.data && setAmount(nativeBalance.data.value - GAS_PRICE_OFFSET);
+                  }
+                else {
                   reservesBalance.data && setAmount(reservesBalance.data);
                 }
               }}
@@ -307,6 +325,18 @@ const Form: React.FC = () => {
           method={action.name}
           mutationTrigger={method.write}
           mutationData={method.data}
+          onSettled={(data, error) => {
+            if (!data) {
+              return;
+            }
+
+            // TODO: Handle this in the UI
+            if (error) {
+              throw error;
+            }
+
+            refetch();
+          }}
         />
       </div>
     </div>