Skip to content

useAllWalletBalances

Token balances for every connected wallet, grouped by walletId. Requires WalletsProvider.

isLoading stays true until balances and exchange rates are ready.

For one wallet, use useWalletBalances.

Example

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

function AllBalances() {
  const {
    balances,
    isLoading,
    isRefetching,
    isFetchingRates,
    error,
    refetch,
    refetchForWallet,
  } = useAllWalletBalances({
    sort: 'balanceDesc',
    enabled: true,
  })

  return (
    <div>
      {isLoading ? <p>Loading balances with rates…</p> : null}
      {balances.map(group => (
        <section key={group.walletId}>
          {group.balances.map(token => (
            <p key={`${token.symbol}-${token.network}-${token.tokenAddress}`}>
              {token.formatted.balance} {token.symbol}
              {token.formatted.fiatValue
                ? ` · $${token.formatted.fiatValue}`
                : ''}
            </p>
          ))}
        </section>
      ))}
      <button type="button" onClick={() => void refetch()}>
        Refresh all
      </button>
    </div>
  )
}

Options

FieldMeaning
sort?'balanceDesc' — eligible first, then higher fiatValue
enabled?Skip fetching when false. Default true

Returns

FieldMeaning
balancesWalletBalancesForWallet[]
isLoadingInitial load until rates are ready (also true while restoring if enabled)
isRefetchingrefetch() in flight; previous rated balances stay on screen
isFetchingRatesFiat quotes in flight for the latest fetch
errorLast fetch error
refetchRefresh every connected wallet
refetchForWallet(walletId)Refresh one instance

WalletBalance fields: useWalletBalances and Balances (Core).