Advanced Usage with wagmi

The Raydius SDK integrates seamlessly with wagmi, a collection of React hooks for Ethereum. Wagmi provides hooks for connecting to wallets, managing accounts, and interacting with contracts. Using wagmi simplifies the process of signing messages and transactions in your Raydius integration.

To ensure compatibility, we are using wagmi version 1.4.12. For detailed documentation, please refer to the wagmi documentation.

Example: Signing a Message

Here is an example of how to sign a message using wagmi with Raydius:

import React from 'react'
import { useRaydius } from '@raydius/react'
import { useSignMessage } from 'wagmi'

export default function SignMessageComponent() {
  const { userAccount } = useRaydius()
  const { signMessage } = useSignMessage({
    message: 'Hello, world!',
  })

  const handleSignMessage = async () => {
    const { data, error } = await signMessage()
    if (error) {
      console.error('Error signing message:', error)
    } else {
      console.log('Signature:', data)
    }
  }

  return (
    <div>
      <button onClick={handleSignMessage}>Sign Message</button>
    </div>
  )
}

Example: Sending a Transaction

Here is an example of how to send a transaction using wagmi with Raydius:

import React from 'react'
import { useRaydius } from '@raydius/react'
import { useSendTransaction } from 'wagmi'
import { parseEther } from 'ethers/lib/utils'

export default function SendTransactionComponent() {
  const { userAccount } = useRaydius()
  const { sendTransaction } = useSendTransaction()

  const handleSendTransaction = async () => {
    const { data, error } = await sendTransaction({
      request: {
        to: '0xRecipientAddress',
        value: parseEther('0.1'),
      },
    })
    if (error) {
      console.error('Error sending transaction:', error)
    } else {
      console.log('Transaction:', data)
    }
  }

  return (
    <div>
      <button onClick={handleSendTransaction}>Send Transaction</button>
    </div>
  )
}