From 5d2d039264dfc1a44f7728570734f0c10452d2a5 Mon Sep 17 00:00:00 2001
From: alcercu <333aleix333@gmail.com>
Date: Tue, 9 Jan 2024 16:14:14 +0100
Subject: [PATCH] fix(web): don't show popup if the user cancels the tx

---
 .../CaseDetails/Voting/Classic/Commit.tsx     |  4 ++--
 .../CaseDetails/Voting/Classic/Reveal.tsx     |  9 ++++----
 .../Cases/CaseDetails/Voting/Classic/Vote.tsx |  2 +-
 web/src/utils/wrapWithToast.ts                | 21 ++++++++++++-------
 4 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/Commit.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/Commit.tsx
index 1aa129a67..c1ee3e178 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/Commit.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/Commit.tsx
@@ -57,8 +57,8 @@ const Commit: React.FC<ICommit> = ({ arbitrable, voteIDs, setIsOpen }) => {
         args: [parsedDisputeID, parsedVoteIDs, commit],
       });
       if (walletClient) {
-        wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then(() => {
-          setIsOpen(true);
+        await wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then((result) => {
+          setIsOpen(result);
         });
       }
     },
diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
index f19b32792..3402ddc06 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
@@ -74,6 +74,7 @@ const Reveal: React.FC<IReveal> = ({ arbitrable, voteIDs, setIsOpen, commit }) =
   const [storedSaltAndChoice, _] = useLocalStorage<string>(saltKey);
 
   const handleReveal = useCallback(async () => {
+    setIsSending(true);
     const { salt, choice } = isUndefined(storedSaltAndChoice)
       ? await getSaltAndChoice(signingAccount, generateSigningAccount, saltKey, disputeTemplate.answers, commit)
       : JSON.parse(storedSaltAndChoice);
@@ -82,11 +83,12 @@ const Reveal: React.FC<IReveal> = ({ arbitrable, voteIDs, setIsOpen, commit }) =
       functionName: "castVote",
       args: [parsedDisputeID, parsedVoteIDs, BigInt(choice), BigInt(salt), justification],
     });
-    if (walletClient) {
-      wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then(() => {
-        setIsOpen(true);
+    if (request && walletClient) {
+      await wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then((result) => {
+        setIsOpen(result);
       });
     }
+    setIsSending(false);
   }, [
     commit,
     disputeTemplate?.answers,
@@ -112,7 +114,6 @@ const Reveal: React.FC<IReveal> = ({ arbitrable, voteIDs, setIsOpen, commit }) =
         disabled={isSending}
         isLoading={isSending}
         onClick={async () => {
-          setIsSending(true);
           handleReveal();
         }}
       />
diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/Vote.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/Vote.tsx
index 44fb35757..0adc7d087 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/Vote.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/Vote.tsx
@@ -40,7 +40,7 @@ const Vote: React.FC<IVote> = ({ arbitrable, voteIDs, setIsOpen }) => {
         ],
       });
       if (walletClient) {
-        wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then(() => {
+        await wrapWithToast(async () => await walletClient.writeContract(request), publicClient).then(() => {
           setIsOpen(true);
         });
       }
diff --git a/web/src/utils/wrapWithToast.ts b/web/src/utils/wrapWithToast.ts
index 4ee577ed0..34001f580 100644
--- a/web/src/utils/wrapWithToast.ts
+++ b/web/src/utils/wrapWithToast.ts
@@ -13,13 +13,20 @@ export const OPTIONS = {
 
 export async function wrapWithToast(contractWrite: () => Promise<`0x${string}`>, publicClient: any) {
   toast.info("Transaction initiated", OPTIONS);
-  const hash = await contractWrite();
-  await publicClient
-    .waitForTransactionReceipt({ hash, confirmations: 2 })
-    .then(() => {
-      toast.success("Transaction mined!", OPTIONS);
-    })
+  return await contractWrite()
+    .then(
+      async (hash) =>
+        await publicClient.waitForTransactionReceipt({ hash, confirmations: 2 }).then(() => {
+          toast.success("Transaction mined!", OPTIONS);
+          return true;
+        })
+    )
     .catch((error) => {
-      toast.error(error.message, OPTIONS);
+      toast.error(error.shortMessage ?? error.message, OPTIONS);
+      return false;
     });
 }
+
+export async function catchShortMessage(promise: Promise<any>) {
+  return await promise.catch((error) => toast.error(error.shortMessage ?? error.message, OPTIONS));
+}