useSendTransactions

The useSendTransactions hook enables sending a set of transactions as a UserOperation on behalf of the user's Embedded Account.

WARNING

This requires your user to be logged in. See useAuthenticate for more details.

Import

import { useSendTransactions } from "@alchemy/aa-alchemy/react";

Usage

import {
  useSendTransactions,
  useSmartAccountClient,
} from "@alchemy/aa-alchemy/react";
import { toHex } from "viem";

export function ComponentWithSendTransactions() {
  /**
   * Assumes the app has context of a signer with an authenticated user
   * by using the `AlchemyAccountProvider` from `@alchemy/aa-alchemy/react`.
   */
  const { client } = useSmartAccountClient({
    type: "MultiOwnerModularAccount",
  });
  const { sendTransactions, isSendingTransactions } = useSendTransactions({
    client,
    onSuccess: (hash) => {
      // [optional] Do something with the hash
    },
    onError: (error) => {
      // [optional] Do something with the error
    },
    // [optional] ...additional mutationArgs
  });

  return (
    <div>
      <button
        onClick={() =>
          sendTransactions({
            requests: [
              {
                from: "0xACCOUNT_ADDRESS",
                to: "0xTARGET_ADDRESS",
                data: "0x",
                value: toHex(0n),
              },
            ],
            // ... other parameters (account, context, overrides)
          })
        }
        disabled={isSendingTransactions}
      >
        {isSendingTransactions ? "Sending..." : "Send Txns"}
      </button>
    </div>
  );
}

Params

client

AlchemySmartAccountClient | undefined A AlchemySmartAccountClient with methods to interact with an Alchemy smart account.

...mutationArgs

You can optionally specify any of the React Query useMutation parameters as parameters to this hook.

Return Type

import { type UseSendTransactions } from "@alchemy/aa-alchemy/react";

Returns an object containing the following state.

sendTransactions

UseMutateFunction A React query mutation function to send a Transactions as a UserOperation. It returns a SendTransactionsResult object.

SendTransactionsResult

import type { Address } from "abitype";
import type { Hash, Hex } from "viem";
import type { z } from "zod";
import type { UserOperationContext } from "../actions/smartAccount/types.js";
import type { EntryPointVersion } from "../entrypoint/types.js";
import type {
  ClientMiddleware,
  ClientMiddlewareFn,
} from "../middleware/types.js";
import type { UserOperationRequest } from "../types.js";
import type { ConnectionConfigSchema } from "./schema.js";

export type ConnectorData = {
  chainId?: Hex;
};

export type ConnectionConfig = z.input<typeof ConnectionConfigSchema>;

//#region SendUserOperationResult
export type SendUserOperationResult<
  TEntryPointVersion extends EntryPointVersion = EntryPointVersion
> = {
  hash: Hash;
  request: UserOperationRequest<TEntryPointVersion>;
};
//#endregion SendUserOperationResult

//#region UpgradeToData
export type UpgradeToData = {
  implAddress: Address;
  initializationData: Hex;
};
//#endregion UpgradeToData

//#region ClientMiddlewareConfig
export type ClientMiddlewareConfig<
  TContext extends UserOperationContext | undefined =
    | UserOperationContext
    | undefined
> = Omit<
  Partial<ClientMiddleware<TContext>>,
  "dummyPaymasterAndData" | "paymasterAndData"
> & {
  paymasterAndData?: {
    dummyPaymasterAndData: () =>
      | UserOperationRequest<"0.6.0">["paymasterAndData"]
      | Pick<UserOperationRequest<"0.7.0">, "paymaster" | "paymasterData">;
    paymasterAndData: ClientMiddlewareFn<TContext>;
  };
};
//#endregion ClientMiddlewareConfig

It takes in SendTransactionsParameters which has the following type:

SendTransactionsParameters

export type SendTransactionsParameters<
  TAccount extends SmartContractAccount | undefined,
  TContext extends UserOperationContext | undefined =
    | UserOperationContext
    | undefined,
  TEntryPointVersion extends GetEntryPointFromAccount<TAccount> = GetEntryPointFromAccount<TAccount>
> = {
  requests: RpcTransactionRequest[];
} & GetAccountParameter<TAccount> &
  GetContextParameter<TContext> &
  UserOperationOverridesParameter<TEntryPointVersion>;

sendTransactionsAsync

UseMutateAsyncFunction A React query async mutation function to send a Transactions as a UserOperation. Via an awaitable promise, it returns a SendTransactionsResult object shown above.

sendTransactionsResult

An transaction hash if the mutation has run successfully, undefined otherwise.

isSendingTransactions

boolean A flag that determines whether the mutation is still running or not.

error

Error | null A field that relays any errors from the mutation. It is null if there is no error.