# useSignTransaction

> @web3auth/modal React Hook useSignTransaction | Embedded Wallets

Hook to sign a Solana transaction using the connected wallet from Embedded Wallets.

### Import

```tsx

```

### Usage

```tsx

function SignTransactionButton({ transaction }: { transaction: Transaction }) {
  const { signTransaction, loading, error, data } = useSignTransaction()

  const handleSign = async () => {
    try {
      const signedTx = await signTransaction(transaction)
      // Do something with signedTx
    } catch (e) {
      // Handle error
    }
  }

  return (
    
      <button onClick={handleSign} disabled={loading}>
        {loading ? 'Signing...' : 'Sign Transaction'}
      </button>
      {error && Error: {error.message}}
      {data && Signed Transaction: {data}}
    
  )
}
```

### Return type

```ts
export type IUseSignTransaction = {
  loading: boolean
  error: Web3AuthError | null
  data: string | null
  signTransaction: (transaction: TransactionOrVersionedTransaction) => Promise<string>
}
```

#### `loading`

`boolean`

Indicates if the transaction signing is in progress.

#### `error`

`Web3AuthError | null`

Error object if signing fails, otherwise null.

#### `data`

`string | null`

The signed transaction as a string, or null if not signed yet.

#### `signTransaction`

`(transaction: TransactionOrVersionedTransaction) => Promise<string>`

Function to sign a Solana transaction. Returns the signed transaction as a string.

## Examples

```tsx title="signTransaction.tsx"

export function SignTransaction() {
  const {
    data: signedTransaction,
    error,
    loading: isPending,
    signTransaction,
  } = useSignTransaction()
  const { accounts, connection } = useSolanaWallet()

  async function submit(e: FormEvent<HTMLFormElement>) {
    e.preventDefault()
    const formData = new FormData(e.target as HTMLFormElement)
    const to = formData.get('address') as string
    const value = formData.get('value') as string

    const block = await connection!.getLatestBlockhash()
    const TransactionInstruction = SystemProgram.transfer({
      fromPubkey: new PublicKey(accounts![0]),
      toPubkey: new PublicKey(to),
      lamports: Number(value) * LAMPORTS_PER_SOL,
    })

    const transaction = new Transaction({
      blockhash: block.blockhash,
      lastValidBlockHeight: block.lastValidBlockHeight,
      feePayer: new PublicKey(accounts![0]),
    }).add(TransactionInstruction)

    signTransaction(transaction)
  }

  return (
    
      Sign Transaction
      <form onSubmit={submit}>
        <input name="address" placeholder="Address" required />
        <input name="value" placeholder="Amount (SOL)" type="number" step="0.01" required />
        <button disabled={isPending} type="submit">
          {isPending ? 'Signing...' : 'Sign'}
        </button>
      </form>
      {signedTransaction && Signed Trasaction: {signedTransaction}}
      {error && Error: {error.message}}
    
  )
}
```
