Added generic async wrapper

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 (

dapp/src/components/Modals/Staking/SignMessage.tsx

@@ -3,16 +3,15 @@ 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() {
   const { goNext } = useModalFlowContext()
   const { signMessage } = useSignMessage(goNext)
 
   const handleClick = () => {
-    signMessage().catch((error) => {
-      throw error
-    })
+    asyncWrapper(signMessage())
   }
 
   return (

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 (

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 (

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
+    })
+  }
+}

dapp/src/utils/index.ts

@@ -2,3 +2,4 @@ export * from "./numbers"
 export * from "./address"
 export * from "./forms"
 export * from "./currency"
+export * from "./async"