Skip to content

Event hooks

Use state hooks for UI. Use event hooks for side effects (navigate, toast, analytics).

The dedicated wallets event hook is useOnWalletTransferStatus. Other wallets:* events are available through useClientEvent or client.on — see Events (Core).

Connection UI (list, restore, pairing URI) should read useWalletConnections / useConnectWallet / useWallet instead of these events.

Transfer status

tsx
import { useOnWalletTransferStatus } from '@swapped/connect-sdk/react'

function TransferListener() {
  useOnWalletTransferStatus(event => {
    event.status
    event.hash
    event.clientTxId
  })
  return null
}

Same payload as onStatus on submit / retry. Status values: Submit.

Other wallet events

tsx
import { useClientEvent } from '@swapped/connect-sdk/react'

function WalletListeners() {
  useClientEvent('wallets:connected', ({ connection }) => {
    connection.walletId
  })
  useClientEvent('wallets:disconnected', ({ walletId, reason }) => {
    /* … */
  })
  useClientEvent('wallets:pairingUri', ({ uri, deeplinkUrl }) => {
    /* … */
  })
  useClientEvent('wallets:balancesUpdated', ({ balances }) => {
    /* … */
  })
  return null
}