Skip to content

useAvailableWallets

Available wallets this device can connect — not the connected list. Requires WalletsProvider.

This is the catalog (AvailableWallet[]). After the user connects, use useWalletConnections. How to open a wallet: Connect wallet.

Example

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

function WalletList({
  onSelect,
}: {
  onSelect: (provider: AvailableWallet['provider']) => void
}) {
  const { wallets, isLoading, error, refetch } = useAvailableWallets()

  if (isLoading) return <p>Loading…</p>
  if (error) return <p>{error.message}</p>

  return (
    <ul>
      {wallets.map(wallet => (
        <li key={wallet.provider}>
          <button type="button" onClick={() => onSelect(wallet.provider)}>
            {wallet.name}
            {wallet.isInstalled ? ' (installed)' : ''}
          </button>
        </li>
      ))}
    </ul>
  )
}

Returns

FieldMeaning
walletsAvailableWallet[]
isLoadingPayment methods still loading
errorPayment-methods fetch error
refetchRefetch payment methods (availability recomputes)

AvailableWallet fields: provider, name, icon, isInstalled, injectedNamespaces, supportsWalletConnect, transports, isPopupConnection, isDeepLinkConnection, qrScanTarget. Details: Availability (Core).