Appearance
useWalletBalances
Token balances for one connected wallet (walletId from a connection). Requires WalletsProvider.
isLoading stays true until balances and exchange rates are ready.
For every connected wallet at once, use useAllWalletBalances.
Example
tsx
import {
useActiveWallet,
useWalletBalances,
} from '@swapped/connect-sdk/react'
function WalletTokens() {
const { activeWalletId } = useActiveWallet()
const { balances, isLoading, isRefetching, refetch } =
useWalletBalances(activeWalletId, { sort: 'balanceDesc' })
return (
<div>
{isLoading ? <p>Loading…</p> : null}
<button type="button" onClick={() => void refetch()}>
{isRefetching ? 'Refreshing…' : 'Refresh'}
</button>
</div>
)
}Options
| Option | Meaning |
|---|---|
walletId | Connected instance, or null |
sort? | 'balanceDesc' — eligible first, then higher fiatValue |
enabled? | Skip fetching when false. Default true |
Returns
| Field | Meaning |
|---|---|
balances | WalletBalance[] |
isLoading | Initial load until rates are ready (also true while restoring if enabled) |
isRefetching | refetch() in flight; previous rated balances stay on screen |
isFetchingRates | Fiat quotes in flight for the latest fetch |
error | Last fetch error |
refetch | Refresh this wallet |
WalletBalance
displayBalance, formatted.balance, formatted.fiatValue, exchangeRate, fiatValue. Eligibility: Balances (Core).
Decide in this order: supported → has balance → meets min → eligible. ineligibleReason is 'unsupported' / 'zero_balance' / 'below_min'. Still list ineligible rows.
sortWalletTokens(tokens, 'balanceDesc') is exported from @swapped/connect-sdk/react for merging lists yourself.
The demo uses ineligibleReason for row hints (“Not supported”, “Zero balance”, “Not enough balance”).