React Hooks Reference
useSendTransaction

useSendTransaction

Executes a Safe transaction from the Safe connected to the SafeProvider or sends it to the Safe Transaction Service if it isn't executable.

Usage

  • If the threshold of the connected Safe is greater than 1, it creates the Safe transaction and submits it to the Safe Transaction Service to collect the signatures from the Safe owners.
  • If the threshold of the connected Safe is 1, it executes the Safe transaction.
  • If the connected Safe is not deployed, it deploys it using the funds from the connected signer to pay for the transaction fees, and executes the transaction or sends it to the Safe Transaction Service, depending on the threshold.

_28
import { useSendTransaction, SendTransactionVariables } from '@safe-global/safe-react-hooks'
_28
_28
function App() {
_28
const {
_28
sendTransaction,
_28
data,
_28
// ...
_28
} = useSendTransaction()
_28
_28
const sendTransactionParams: SendTransactionVariables = {
_28
transactions: [{
_28
to: '0x...',
_28
value: '123',
_28
data: '0x'
_28
}]
_28
}
_28
_28
return (
_28
<>
_28
<button onClick={() => sendTransaction(sendTransactionParams)}>
_28
Send Transaction
_28
</button>
_28
{data && JSON.stringify(data)}
_28
</>
_28
)
_28
}
_28
_28
export default App

Parameters

UseSendTransactionParams

Parameters to customize the hook behavior.


_10
import { UseSendTransactionParams } from '@safe-global/safe-react-hooks'

config (Optional)

  • Type: SafeConfigWithSigner

The configuration used instead of the one from the nearest SafeProvider.


_10
import { config } from './config.ts'
_10
_10
const result = useSendTransaction({
_10
config
_10
})

Returns

UseSendTransactionReturnType


_10
import { UseSendTransactionReturnType } from '@safe-global/safe-react-hooks'

TanStack Query mutation documentation (opens in a new tab).

sendTransaction

  • Type: UseMutateFunction<SafeClientResult, Error, SendTransactionVariables, unknown>

Function to send a transaction with the connected Safe.

Parameters

SendTransactionVariables


_10
import { SendTransactionVariables } from '@safe-global/safe-react-hooks'

Variables to send the transactions.

Returns

SafeClientResult (opens in a new tab)

The result of the transaction in the data property.

sendTransactionAsync

  • Type: UseMutateAsyncFunction<SafeClientResult, Error, SendTransactionVariables, unknown>

Asynchronous function to send a transaction with the connected Safe.

Parameters

SendTransactionVariables


_10
import { SendTransactionVariables } from '@safe-global/safe-react-hooks'

Variables to send the transactions.

Returns

SafeClientResult (opens in a new tab)

The result of the transaction in the data property.

data

The last successfully resolved data for the mutation.

error

  • Type: null | TError
  • Default: null

The error object for the mutation, if an error was encountered.

failureCount

  • Type: number

The failure count for the mutation.

Incremented every time the mutation fails.

Reset to 0 when the mutation succeeds.

failureReason

  • Type: null | TError

The failure reason for the mutation retry.

Reset to null when the mutation succeeds.

isError / isIdle / isPending / isSuccess

  • Type: boolean

The boolean variables derived from status.

isPaused

  • Type: boolean

Will be true if the mutation has been paused.

See Network Mode (opens in a new tab) for more information.

reset

  • Type: () => void

A function to clean the mutation internal state (for example, it resets the mutation to its initial state).

status

  • Type: 'idle' | 'pending' | 'error' | 'success'

'idle' initial status prior to the mutation function executing.

'pending' if the mutation is currently executing.

'error' if the last mutation attempt resulted in an error.

'success' if the last mutation attempt was successful.

submittedAt

  • Type: number
  • Default: 0

The timestamp for when the mutation was submitted.

variables

  • Type: SendTransactionVariables
  • Default: undefined

The variables object passed to the mutation function.

Was this page helpful?