Merge pull request #25 from fluencelabs/claim_flt_page

fix: error handling
fluencelabs · Apr 28, 2024 · 18f2d13 · 18f2d13
2 parents c0f5d5b + cb8e8bf
commit 18f2d13
Showing 1 changed file with 19 additions and 13 deletions.
diff --git a/web/src/pages/claim-flt-page/claim-flt-page.js b/web/src/pages/claim-flt-page/claim-flt-page.js
@@ -63,20 +63,25 @@ export const ClaimFltPage = memo(() => {
   const [waitForSigning, setWaitForSigning] = useState(false);
   const [waitForReceipt, setWaitForReceipt] = useState(false);
   const [confirmedTxHash, setConfirmedTxHash] = useState(null);
+  const [error, setError] = useState(null);
 
   const handleClaim = async () => {
-    const contract = new ethers.Contract(
-      governanceContracts[network.name].devRewardDistributor,
-      abis.DevRewardDistributor.abi,
-      provider.getSigner(),
-    );
-    setWaitForSigning(true);
-    const response = await contract.functions.transfer(address, amountAndDate.amount, { from: address });
-    setWaitForSigning(false);
-    setWaitForReceipt(true);
-    const receipt = await response.wait();
-    setWaitForReceipt(false);
-    setConfirmedTxHash(receipt.transactionHash);
+    try {
+      const contract = new ethers.Contract(
+        governanceContracts[network.name].devRewardDistributor,
+        abis.DevRewardDistributor.abi,
+        provider.getSigner(),
+      );
+      setWaitForSigning(true);
+      const response = await contract.functions.transfer(address, amountAndDate.amount, { from: address });
+      setWaitForSigning(false);
+      setWaitForReceipt(true);
+      const receipt = await response.wait();
+      setWaitForReceipt(false);
+      setConfirmedTxHash(receipt.transactionHash);
+    } catch (e) {
+      setError(e.message);
+    }
   }
 
   const dateInFuture = amountAndDate?.unlockTime > new Date();
@@ -140,8 +145,9 @@ export const ClaimFltPage = memo(() => {
                   {!dateInFuture && Boolean(amountAndDate?.amount) && <div className={styles.dashboard__button}>
                     {waitForSigning && "Please sign tx in your wallet"}
                     {waitForReceipt && "Confirming..."}
+                    {Boolean(error) && (error || "Error")}
                     {confirmedTxHash && <a href={supportedChains[0].explorer_url + "/tx/" + confirmedTxHash} target="_blank" rel="noreferrer">Transaction confirmed</a>}
-                    {!waitForSigning && !waitForReceipt && !confirmedTxHash && <Button callback={handleClaim} text={`Claim FLT`} />}
+                    {!waitForSigning && !waitForReceipt && !confirmedTxHash && !error && <Button callback={handleClaim} text={`Convert FLT-DROP to FLT`} />}
                   </div>}
                 </div>
               </Dashboard>