fix: throw error if amount and gas is more than balance

Author: gregfromstl

packages/thirdweb/src/react/core/hooks/wallets/useSendToken.ts

@@ -3,14 +3,16 @@ import type { ThirdwebClient } from "../../../../client/client.js";
 import { getContract } from "../../../../contract/contract.js";
 import { resolveAddress } from "../../../../extensions/ens/resolve-address.js";
 import { transfer } from "../../../../extensions/erc20/write/transfer.js";
-import { sendTransaction } from "../../../../transaction/actions/send-transaction.js";
 import { waitForReceipt } from "../../../../transaction/actions/wait-for-tx-receipt.js";
 import { prepareTransaction } from "../../../../transaction/prepare-transaction.js";
 import { isAddress } from "../../../../utils/address.js";
 import { isValidENSName } from "../../../../utils/ens/isValidENSName.js";
 import { toWei } from "../../../../utils/units.js";
 import { invalidateWalletBalance } from "../../providers/invalidateWalletBalance.js";
 import { useActiveWallet } from "./useActiveWallet.js";
+import { sendTransaction } from "../../../../transaction/actions/send-transaction.js";
+import { estimateGas } from "../../../../transaction/actions/estimate-gas.js";
+import { getWalletBalance } from "../../../../wallets/utils/getWalletBalance.js";
 
 /**
  * Send Native or ERC20 tokens from active wallet to given address.
@@ -85,13 +87,24 @@ export function useSendToken(client: ThirdwebClient) {
           to,
           value: toWei(amount),
         });
+        const gasEstimate = await estimateGas({
+          transaction: sendNativeTokenTx,
+          account,
+        });
+        const balance = await getWalletBalance({
+          address: account.address,
+          chain: activeChain,
+          client,
+        });
+        if (toWei(amount) + gasEstimate > balance.value) {
+          throw new Error("Insufficient balance for transfer amount and gas");
+        }
 
-        return sendTransaction({
+        return await sendTransaction({
           transaction: sendNativeTokenTx,
           account,
         });
       }
-
       // erc20 token transfer
       else {
         const contract = getContract({
@@ -106,7 +119,7 @@ export function useSendToken(client: ThirdwebClient) {
           to,
         });
 
-        return sendTransaction({
+        return await sendTransaction({
           transaction: tx,
           account,
         });
@@ -121,6 +134,7 @@ export function useSendToken(client: ThirdwebClient) {
           transactionHash: data.transactionHash,
           client,
           chain: data.chain,
+          maxBlocksWaitTime: 10_000,
         });
       }
       invalidateWalletBalance(queryClient);

packages/thirdweb/src/wallets/utils/getWalletBalance.ts

@@ -22,8 +22,6 @@ export type GetWalletBalanceOptions = {
   tokenAddress?: string;
 };
 
-export type GetWalletBalanceResult = GetBalanceResult;
-
 /**
  * Retrieves the balance of a token or native currency for a given wallet.
  * @param options - The options for retrieving the token balance.
@@ -41,7 +39,7 @@ export type GetWalletBalanceResult = GetBalanceResult;
  */
 export async function getWalletBalance(
   options: GetWalletBalanceOptions,
-): Promise<GetWalletBalanceResult> {
+): Promise<GetBalanceResult> {
   const { address, client, chain, tokenAddress } = options;
   // erc20 case
   if (tokenAddress) {