From e5ae9c88eabd4e85ce2c793bb4d0a17aff366258 Mon Sep 17 00:00:00 2001
From: ioay <ayioerthi@gmail.com>
Date: Sun, 21 Jan 2024 20:54:53 +0100
Subject: [PATCH] Added generic async wrapper

---
 dapp/src/components/Header/ConnectWallet.tsx              | 6 ++----
 dapp/src/components/Modals/Staking/SignMessage.tsx        | 5 ++---
 dapp/src/components/Modals/Support/MissingAccount.tsx     | 6 ++----
 dapp/src/components/shared/Form/FormTokenBalanceInput.tsx | 5 ++---
 dapp/src/utils/async.ts                                   | 8 ++++++++
 dapp/src/utils/index.ts                                   | 1 +
 6 files changed, 17 insertions(+), 14 deletions(-)
 create mode 100644 dapp/src/utils/async.ts

diff --git a/dapp/src/components/Header/ConnectWallet.tsx b/dapp/src/components/Header/ConnectWallet.tsx
index 41be77ac0..767b68833 100644
--- a/dapp/src/components/Header/ConnectWallet.tsx
+++ b/dapp/src/components/Header/ConnectWallet.tsx
@@ -9,7 +9,7 @@ import {
 import { CurrencyBalance } from "#/components/shared/CurrencyBalance"
 import { TextMd } from "#/components/shared/Typography"
 import { Bitcoin, Ethereum } from "#/static/icons"
-import { truncateAddress } from "#/utils"
+import { truncateAddress, asyncWrapper } from "#/utils"
 
 export type ConnectButtonsProps = {
   leftIcon: typeof Icon
@@ -25,9 +25,7 @@ function ConnectButton({
   const colorScheme = !account ? "error" : undefined
 
   const handleClick = () => {
-    requestAccount().catch((error) => {
-      throw error
-    })
+    asyncWrapper(requestAccount())
   }
 
   return (
diff --git a/dapp/src/components/Modals/Staking/SignMessage.tsx b/dapp/src/components/Modals/Staking/SignMessage.tsx
index 4bc8f7554..d653ba781 100644
--- a/dapp/src/components/Modals/Staking/SignMessage.tsx
+++ b/dapp/src/components/Modals/Staking/SignMessage.tsx
@@ -3,6 +3,7 @@ import { Highlight } from "@chakra-ui/react"
 import { useModalFlowContext, useSignMessage } from "#/hooks"
 import Alert from "#/components/shared/Alert"
 import { TextMd } from "#/components/shared/Typography"
+import { asyncWrapper } from "#/utils"
 import StakingSteps from "./components/StakingSteps"
 
 export default function SignMessage() {
@@ -10,9 +11,7 @@ export default function SignMessage() {
   const { signMessage } = useSignMessage(goNext)
 
   const handleClick = () => {
-    signMessage().catch((error) => {
-      throw error
-    })
+    asyncWrapper(signMessage())
   }
 
   return (
diff --git a/dapp/src/components/Modals/Support/MissingAccount.tsx b/dapp/src/components/Modals/Support/MissingAccount.tsx
index b859f3cc8..861cb7c63 100644
--- a/dapp/src/components/Modals/Support/MissingAccount.tsx
+++ b/dapp/src/components/Modals/Support/MissingAccount.tsx
@@ -9,7 +9,7 @@ import {
 } from "@chakra-ui/react"
 import { TextMd } from "#/components/shared/Typography"
 import Alert from "#/components/shared/Alert"
-import { getCurrencyByType } from "#/utils"
+import { asyncWrapper, getCurrencyByType } from "#/utils"
 import { CurrencyType, RequestAccountParams } from "#/types"
 
 type MissingAccountProps = {
@@ -26,9 +26,7 @@ export default function MissingAccount({
   const { name, symbol } = getCurrencyByType(currency)
 
   const handleClick = () => {
-    requestAccount().catch((error) => {
-      throw error
-    })
+    asyncWrapper(requestAccount())
   }
 
   return (
diff --git a/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx b/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx
index 817f840d0..5eefb5933 100644
--- a/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx
+++ b/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx
@@ -1,5 +1,6 @@
 import React from "react"
 import { useField } from "formik"
+import { asyncWrapper } from "#/utils"
 import TokenBalanceInput, { TokenBalanceInputProps } from "../TokenBalanceInput"
 
 export type FormTokenBalanceInputProps = {
@@ -12,9 +13,7 @@ export function FormTokenBalanceInput({
   const [field, meta, helpers] = useField(name)
 
   const setAmount = (value?: bigint) => {
-    helpers.setValue(value).catch((error) => {
-      throw error
-    })
+    asyncWrapper(helpers.setValue(value))
   }
 
   return (
diff --git a/dapp/src/utils/async.ts b/dapp/src/utils/async.ts
new file mode 100644
index 000000000..df3657065
--- /dev/null
+++ b/dapp/src/utils/async.ts
@@ -0,0 +1,8 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function asyncWrapper(func: Promise<any>) {
+  return () => {
+    func.catch((error) => {
+      throw error
+    })
+  }
+}
diff --git a/dapp/src/utils/index.ts b/dapp/src/utils/index.ts
index 02eaa61b8..5d4c83a8c 100644
--- a/dapp/src/utils/index.ts
+++ b/dapp/src/utils/index.ts
@@ -2,3 +2,4 @@ export * from "./numbers"
 export * from "./address"
 export * from "./forms"
 export * from "./currency"
+export * from "./async"