refactor(web): update-wrap-with-toast-function

Author: tractorss

web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx

@@ -11,8 +11,9 @@ import { prepareArbitratorExtradata } from "utils/prepareArbitratorExtradata";
 import { usePublicClient } from "wagmi";
 import Popup, { PopupType } from "components/Popup";
 import DisputeIcon from "assets/svgs/icons/dispute.svg";
-import { DecodeEventLogParameters, decodeEventLog, parseAbi } from "viem";
+import { Log, decodeEventLog, parseAbi } from "viem";
 import { EnsureChain } from "components/EnsureChain";
+import { isUndefined } from "utils/index";
 
 const StyledButton = styled(Button)``;
 
@@ -56,14 +57,13 @@ const SubmitDisputeButton: React.FC = () => {
               setIsSubmittingCase(true);
               wrapWithToast(async () => await submitCase().then((response) => response.hash), publicClient)
                 .then((res) => {
-                  if (res.status === "success") {
-                    const id = retrieveDisputeId(res.logs[1]);
+                  if (res.status && !isUndefined(res.result)) {
+                    const id = retrieveDisputeId(res.result.logs[1]);
                     setDisputeId(Number(id));
                     setCourtId(disputeData.courtId ?? "1");
                     setIsPopupOpen(true);
+                    resetDisputeData();
                   }
-
-                  resetDisputeData();
                 })
                 .finally(() => {
                   setIsSubmittingCase(false);
@@ -96,7 +96,7 @@ const isTemplateValid = (disputeTemplate: IDisputeTemplate) => {
     areVotingOptionsFilled) as boolean;
 };
 
-const retrieveDisputeId = (eventLog: DecodeEventLogParameters) =>
+const retrieveDisputeId = (eventLog: Log) =>
   decodeEventLog({
     abi: parseAbi(["event DisputeCreation(uint256 indexed, address indexed)"]),
     data: eventLog.data,

web/src/utils/wrapWithToast.ts

@@ -12,16 +12,30 @@ export const OPTIONS = {
   theme: "colored" as Theme,
 };
 
-export async function wrapWithToast(contractWrite: () => Promise<`0x${string}`>, publicClient: any) {
+type WrapWithToastReturnType = {
+  status: boolean;
+  result?: TransactionReceipt;
+};
+
+export async function wrapWithToast(
+  contractWrite: () => Promise<`0x${string}`>,
+  publicClient: any
+): Promise<WrapWithToastReturnType> {
   toast.info("Transaction initiated", OPTIONS);
-  const hash = await contractWrite();
-  return await publicClient
-    .waitForTransactionReceipt({ hash, confirmations: 2 })
-    .then((response: TransactionReceipt) => {
-      toast.success("Transaction mined!", OPTIONS);
-      return response;
-    })
+  return await contractWrite()
+    .then(
+      async (hash) =>
+        await publicClient.waitForTransactionReceipt({ hash, confirmations: 2 }).then((res: TransactionReceipt) => {
+          const status = res.status === "success";
+
+          if (status) toast.success("Transaction mined!", OPTIONS);
+          else toast.error("Transaction reverted!", OPTIONS);
+
+          return { status, result: res };
+        })
+    )
     .catch((error) => {
-      toast.error(error.message, OPTIONS);
+      toast.error(error.shortMessage ?? error.message, OPTIONS);
+      return { status: false };
     });
 }