Batching transactions

Batching transactions allows sending multiple transactions in a single user operation. This can be useful to save on fees, reduce number of user confimations or to ensure that multiple transactions are executed atomically.

A typical example is to do an approval and a transfer in a single userOperation. This way, the transfer will only happen if the approval is successful.

import {
useActiveAccount,
useSendBatchTransaction,
} from "thirdweb/react";
import { approve, transferFrom } from "thirdweb/extensions/erc20";
const smartAccount = useActiveAccount();
const { mutate: sendBatchTransaction } = useSendBatchTransaction();
const approveAndTransfer = async () => {
const transactions = [
approve({
contract,
spender: "0x...",
value: 100,
}),
transferFrom({
contract,
from: "0x...",
to: "0x...",
amount: 100,
}),
];
await sendBatchTransaction(transactions);
};