Appearance
useCoinbaseBalances
Load enriched Coinbase balances for the connected account.
When to use
After connection, inside CoinbaseProvider. Drive the currency picker together with useCoinbaseToken.
Example
tsx
import {
CoinbaseProvider,
useCoinbaseBalances,
useCoinbaseToken,
} from '@swapped/connect-sdk/react'
function BalancePicker() {
const { balances, allBalances, eligibleBalances, isLoading, error, refetch } =
useCoinbaseBalances()
const { selectToken, isTokenSelected } = useCoinbaseToken()
if (isLoading) return <p>Loading balances…</p>
if (error) return <p>{error.message}</p>
return (
<ul>
{allBalances.map(item => (
<li key={item.id}>
<button
type="button"
disabled={!item.eligible}
aria-pressed={isTokenSelected(item.currency)}
onClick={() => selectToken(item.currency)}
>
{item.currency} {item.formatted.balance} (~$
{item.formatted.valueFiat})
{!item.eligible && item.ineligibleReason
? ` — ${item.ineligibleReason}`
: ''}
</button>
</li>
))}
<button type="button" onClick={() => void refetch()}>
Refresh
</button>
<p>
Showing {balances.length} filtered / {eligibleBalances.length} eligible
</p>
</ul>
)
}
function App() {
return (
<CoinbaseProvider onlySupported>
<BalancePicker />
</CoinbaseProvider>
)
}ineligibleReason: unsupported | zero_balance | below_min | below_fee_reserve.
Provider props (filters)
Configure filters on CoinbaseProvider:
| Prop | Default | Purpose |
|---|---|---|
enabled | true | Skip fetch when false |
onlySupported | false | Omit unsupported tokens from balances |
onlyAboveMin | false | Omit balances that fail min / fee checks from balances |
allBalances is always the full enriched list. eligibleBalances is every balance with eligible: true.
Returns
balances, allBalances, eligibleBalances, isLoading, isRefetching, error, refetch.
Errors
| Code | When | What to do |
|---|---|---|
REACT_COINBASE_PROVIDER_REQUIRED | Outside provider | Wrap with CoinbaseProvider |
COINBASE_NOT_CONNECTED | Not connected | Connect first |
COINBASE_SESSION_EXPIRED | Token invalid | Reconnect |
API_ERROR | Network / server failure | Retry via refetch |
See Errors.