useGetTokenBalancesSummary

Hook para obtener balances resumidos de tokens a través de múltiples cadenas

​

Importar

import { useGetTokenBalancesSummary } from '@0xsequence/hooks'

​

Uso

import React from 'react'
import { useGetTokenBalancesSummary } from '@0xsequence/hooks'
import { ContractVerificationStatus } from '@0xsequence/connect'
import { useAccount } from 'wagmi'
import { formatUnits } from 'viem'

function TokenBalancesList() {
  const { address } = useAccount()
  
  const {
    data: tokens,
    isLoading,
    isError
  } = useGetTokenBalancesSummary({
    chainIds: [1, 137], // Ethereum and Polygon
    filter: {
      accountAddresses: [address || ''],
      omitNativeBalances: false,
      contractStatus: ContractVerificationStatus.VERIFIED,
      // Optional: filter specific tokens
      contractWhitelist: [
        '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48', // USDC
        '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2'  // WETH
      ]
    }
  })

  if (isLoading) return <div>Loading balances...</div>
  if (isError) return <div>Error loading balances</div>

  return (
    <div className="token-list">
      {tokens?.map(token => (
        <div 
          key={`${token.chainId}-${token.contractAddress}`}
          className="token-item"
        >
          <div className="token-info">
            {token.contractInfo?.logoURI && (
              <img 
                src={token.contractInfo.logoURI}
                alt={token.contractInfo.symbol}
                width={32}
                height={32}
              />
            )}
            <div>
              <h4>{token.contractInfo?.symbol || 'Unknown'}</h4>
              <p>{token.contractInfo?.name}</p>
            </div>
          </div>
          
          <div className="token-balance">
            <span>
              {token.contractInfo?.decimals
                ? formatUnits(token.balance, token.contractInfo.decimals)
                : token.balance}
            </span>
            <span className="chain-badge">
              Chain: {token.chainId}
            </span>
          </div>
        </div>
      ))}
    </div>
  )
}

​

Tipo de retorno: UseQueryResult<TokenBalance[]>

El hook retorna todas las propiedades de UseQueryResult de React Query con los datos de balances de tokens. Esta es la estructura detallada:

interface TokenBalance {
  contractType: ContractType
  contractAddress: string
  accountAddress: string
  balance: string
  blockHash: string
  blockNumber: number
  chainId: number
  uniqueCollectibles: string
  isSummary: boolean
  contractInfo?: {
    name: string
    symbol: string
    decimals: number
    logoURI: string
  }
}

​

Propiedades

​

data

TokenBalance[] | undefined

Arreglo de objetos de balance de tokens que contienen:

• contractType: Tipo de contrato del token (NATIVE, ERC20, ERC721, ERC1155)
• contractAddress: Dirección del contrato del token
• accountAddress: Dirección de la cuenta que posee los tokens
• balance: Balance del token como string (en unidades base)
• chainId: Chain ID donde existe el token
• blockHash: Hash del bloque donde el balance fue actualizado por última vez
• blockNumber: Número de bloque donde el balance fue actualizado por última vez
• uniqueCollectibles: Cantidad de coleccionables únicos
• isSummary: Indica si el balance es un resumen
• contractInfo: Información básica del contrato del token, incluyendo nombre, símbolo, decimales y URL del logo

​

isLoading

boolean

Estado de carga para la obtención de datos.

​

isError

boolean

Estado de error que indica si la consulta falló.

​

error

Error | null

Cualquier error que ocurrió durante la obtención de datos.

​

Parámetros

El hook acepta dos parámetros:

​

args: GetTokenBalancesSummaryArgs

interface GetTokenBalancesSummaryArgs {
  chainIds: number[]
  filter: {
    accountAddresses: string[]
    contractWhitelist?: string[]
    contractBlacklist?: string[]
    omitNativeBalances?: boolean
    contractStatus?: ContractVerificationStatus
  }
}

Parámetro	Type	Description
chainIds	number[]	Array de IDs de cadena para obtener balances
filter.accountAddresses	string[]	Arreglo de direcciones de cuentas para obtener balances
filter.contractWhitelist	string[]	(Opcional) Arreglo de direcciones de contratos a incluir
filter.contractBlacklist	string[]	(Opcional) Arreglo de direcciones de contratos a excluir
filter.omitNativeBalances	boolean	(Opcional) Si es verdadero, excluye balances de tokens nativos
filter.contractStatus	ContractVerificationStatus	(Opcional) Filtro para el estado de verificación del contrato

​

options: BalanceHookOptions

interface BalanceHookOptions {
  disabled?: boolean
  retry?: boolean
  hideCollectibles?: boolean
}

Parámetro	Type	Description
disabled	boolean	(Opcional) Deshabilitar la consulta para que no se ejecute automáticamente
retry	boolean	(Opcional) Indica si se deben reintentar las consultas fallidas
hideCollectibles	boolean	(Opcional) Si es true, filtra tokens ERC721 y ERC1155