> **Key takeaway:**  ☞   The renaming of "Ledger Live" to "Ledger Wallet" and\
>      "wallet" (in the hardware sense) to "signer" is still in progress.\
>      This page may contain legacy references that will be updated.

# Using the `useSignAndBroadcastTransaction` Hook

The `useSignAndBroadcastTransaction` hook is part of the  API Client for React. It allows the user to sign a transaction and immediately broadcast it to the network using the connected wallet. This documentation provides a detailed explanation of how to use this hook in your application.

### Introduction

`useSignAndBroadcastTransaction` returns an object with a function to sign and broadcast transactions, along with the state of the process. This is useful when you want to both sign a transaction and send it to the network in a single step.

### Usage

1. Import the required dependencies and hooks from the  API Client.

2. Use the `useSignAndBroadcastTransaction` hook in your component.

3. Call the `signAndBroadcastTransaction` function with the appropriate parameters.

### Example

Below is an example demonstrating how to use the `useSignAndBroadcastTransaction` hook to sign and broadcast an Ethereum transaction.

[**Required permission**:](https://developers.ledger.com/docs/ledger-live/discover/guides/wallet-api/appendix/manifest#permissions)
`transaction.signAndBroadcast`

```jsx
import React, { useEffect, useState, useCallback } from "react";
import {
  useSignAndBroadcastTransaction,
  useRequestAccount,
} from "@ledgerhq/wallet-api-client-react";
import BigNumber from "bignumber.js";

function App() {
  const { requestAccount, account } = useRequestAccount();
  const { signAndBroadcastTransaction, pending, transactionHash, error } =
    useSignAndBroadcastTransaction();

  useEffect(() => {
    requestAccount();
  }, [requestAccount]);

  const handleSignAndBroadcastTransaction = useCallback(async () => {
    if (!account) return;

    const ethereumTransaction = {
      family: "ethereum",
      amount: new BigNumber(1000000000000000), // 0.001 ETH in wei
      recipient: "0xRecipientAddressHere",
      gasPrice: new BigNumber(20000000000), // 20 Gwei
      gasLimit: new BigNumber(21000),
      nonce: 0, // Replace with the correct nonce
    };

    try {
      await signAndBroadcastTransaction(account.id, ethereumTransaction);
    } catch (e) {
      console.error(e);
    }
  }, [account, signAndBroadcastTransaction]);

  return (
    <>
      <h1>Test Live App - Wallet API</h1>
      <div className="card">
        <button onClick={handleSignAndBroadcastTransaction} disabled={pending}>
          Sign and Broadcast Ethereum Transaction
        </button>

        {pending && <p>Broadcasting...</p>}
        {error && <p>Error: {error.toString()}</p>}
        {transactionHash && (
          <p>Transaction broadcasted successfully: {transactionHash}</p>
        )}
      </div>
    </>
  );
}

export default App;
```

### Parameters

The `signAndBroadcastTransaction` function takes three parameters:

- `accountId`: The ID of the account you want to sign the transaction with.
- `transaction`: The transaction object in the currency family-specific format.
- `options` (optional): Extra parameters that may be required by certain blockchain implementations.

In the example above, `accountId` is obtained through the `useRequestAccount` hook, and `transaction` is an object representing an Ethereum transaction.

### Return Value

The `useSignAndBroadcastTransaction` hook returns an object with the following properties:

- `signAndBroadcastTransaction`: Function to call for signing and broadcasting a transaction.
- `pending`: Boolean indicating if the process is ongoing.
- `transactionHash`: The hash of the transaction once it's successfully broadcasted.
- `error`: An error object if the process failed.

### Error Handling

If an error occurs during the signing and broadcasting process, the \`