0xtrails 0.2.5 → 0.3.0

package/src/tokenBalances.ts

@@ -7,20 +7,28 @@ import type {
   TokenBalance,
 } from "@0xsequence/indexer"
 import { ContractVerificationStatus } from "@0xsequence/indexer"
-import type { Page, Price, SequenceAPIClient } from "@0xsequence/api"
+import type { Page } from "@0xsequence/indexer"
+import type { TokenPrice as TrailsTokenPrice } from "@0xsequence/trails-api"
 import { QueryClient, useQuery } from "@tanstack/react-query"
 import type { Address } from "ox"
 import { useEffect, useState } from "react"
 import { formatUnits, parseUnits, zeroAddress } from "viem"
-import { useAPIClient } from "./apiClient.js"
 import { useIndexerGatewayClient } from "./indexerClient.js"
 import { getTokenPrices, useTokenPrices } from "./prices.js"
 import { logger } from "./logger.js"
 import { getChainInfo } from "./chains.js"
 import { getTokenImageUrl } from "./tokens.js"
+import type { TrailsClient } from "./trailsClient.js"
+import { useTrailsClient } from "./trailsClient.js"
+import { getFullErrorMessage } from "./error.js"
 
 export type { NativeTokenBalance, TokenBalance }
 
+export type Price = {
+  value: number
+  currency: string
+}
+
 const REFRESH_INTERVAL = 10000 // 10 seconds
 
 // Initialize query client for token balances
@@ -163,7 +171,7 @@ export interface GetTokenBalancesWithPrice {
 export function useTokenBalances(
   address: Address.Address,
   indexerGatewayClient?: SequenceIndexerGateway,
-  sequenceApiClient?: SequenceAPIClient,
+  sequenceApiClient?: TrailsClient,
 ): {
   tokenBalancesData: GetTokenBalancesSummaryReturn | undefined
   isLoadingBalances: boolean
@@ -174,11 +182,11 @@ export function useTokenBalances(
 } {
   // Always call hooks unconditionally to fix React rules violation
   const hookIndexerClient = useIndexerGatewayClient()
-  const hookApiClient = useAPIClient()
+  const hookTrailsClient = useTrailsClient()
 
   // Use passed parameters if available, otherwise use hook results
   const indexerClient = indexerGatewayClient ?? hookIndexerClient
-  const apiClient = sequenceApiClient ?? hookApiClient
+  const apiClient = sequenceApiClient ?? hookTrailsClient
 
   // Fetch token balances with improved query key structure
   const {
@@ -186,7 +194,7 @@ export function useTokenBalances(
     isLoading: isLoadingBalances,
     error: balanceError,
   } = useQuery<GetTokenBalancesWithPrice>({
-    queryKey: ["tokenBalances", "summary", address],
+    queryKey: ["getTokenBalancesWithPrices", "summary", address],
     queryFn: async (): Promise<GetTokenBalancesWithPrice> => {
       if (!address) {
         logger.console.warn("[trails-sdk] No account address or indexer client")
@@ -212,6 +220,33 @@ export function useTokenBalances(
           ).flatMap((b) => b.results),
         }
       } catch (error) {
+        const errorMessage = getFullErrorMessage(error)
+
+        // Check if this is a CORS error or network error
+        const isCorsError =
+          errorMessage.includes("Cross-Origin") ||
+          errorMessage.includes("CORS") ||
+          errorMessage.includes("Same Origin Policy")
+        const isNetworkError =
+          errorMessage.includes("fetch failed") ||
+          errorMessage.includes("network")
+
+        if (isCorsError || isNetworkError) {
+          logger.console.warn(
+            "[trails-sdk] Network or CORS error fetching token balances in hook, returning empty result:",
+            {
+              error: errorMessage,
+              address,
+            },
+          )
+          // Return empty balances instead of throwing to prevent error boundary
+          return {
+            page: defaultPage,
+            balances: [],
+            nativeBalances: [],
+          }
+        }
+
         logger.console.error(
           "[trails-sdk] Failed to fetch token balances:",
           error,
@@ -240,16 +275,16 @@ export function useTokenBalances(
     (tokenBalancesData?.balances ?? [])
       .map((b: any) => {
         return {
-          tokenId: b.contractInfo?.symbol,
-          contractAddress: b.contractAddress,
-          chainId: b.contractInfo?.chainId!,
+          tokenSymbol: b.contractInfo?.symbol,
+          tokenAddress: b.contractAddress,
+          chainId: b.contractInfo?.chainId,
         }
       })
       .concat(
         (tokenBalancesData?.nativeBalances ?? []).map((b) => {
           return {
-            tokenId: b.symbol,
-            contractAddress: zeroAddress,
+            tokenSymbol: b.symbol,
+            tokenAddress: zeroAddress,
             chainId: b.chainId,
           }
         }),
@@ -314,23 +349,25 @@ export function useTokenBalances(
         // First pass: add prices to all tokens
         const tokensWithPrices = balances.map((token) => {
           const isNative = isNativeToken(token)
-          const priceData = tokenPrices.find(
-            (p: { token: { contractAddress: string; chainId: number } }) =>
-              p.token.contractAddress ===
+          const priceData: TrailsTokenPrice | undefined = tokenPrices.find(
+            (p) =>
+              p.token.tokenAddress ===
                 (isNative ? zeroAddress : token.contractAddress) &&
               p.token.chainId ===
                 (isNative ? token.chainId : token.contractInfo?.chainId),
           )
 
-          if (priceData?.price) {
-            const tokenWithPrice = { ...token, price: priceData.price }
-            tokenWithPrice.balanceUsd = getTokenBalanceUsd(
-              token,
-              priceData.price,
-            )
+          if (priceData?.priceUsd !== undefined) {
+            // Create a Price object compatible with the indexer API
+            const price: Price = {
+              value: priceData.priceUsd,
+              currency: "USD",
+            }
+            const tokenWithPrice = { ...token, price }
+            tokenWithPrice.balanceUsd = getTokenBalanceUsd(token, price)
             tokenWithPrice.balanceUsdFormatted = getTokenBalanceUsdFormatted(
               token,
-              priceData.price,
+              price,
             )
             return tokenWithPrice
           }
@@ -519,6 +556,24 @@ export function formatUsdAmountDisplay(value: number | string = 0): string {
   const MAX_DISPLAY_VALUE = 100_000_000_000_000
   const cappedValue = Math.min(absValue, MAX_DISPLAY_VALUE)
 
+  // For very small amounts (less than $0.01), show 3 decimal places or <$0.01
+  if (cappedValue > 0 && cappedValue < 0.01) {
+    const displayValue = Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: "USD",
+      maximumFractionDigits: 3,
+      minimumFractionDigits: 3,
+    }).format(isNegative ? -cappedValue : cappedValue)
+
+    // If still rounds to $0.000, show <$0.01
+    if (displayValue === "$0.000") {
+      return `<$0.01`
+    }
+
+    return displayValue
+  }
+
+  // For amounts >= $0.01, use standard 2 decimal places
   const displayValue = Intl.NumberFormat("en-US", {
     style: "currency",
     currency: "USD",
@@ -526,10 +581,6 @@ export function formatUsdAmountDisplay(value: number | string = 0): string {
     minimumFractionDigits: 2,
   }).format(isNegative ? -cappedValue : cappedValue)
 
-  if (displayValue === "$0.00" && absValue > 0 && absValue < 0.01) {
-    return `<$0.01`
-  }
-
   return displayValue
 }
 
@@ -580,6 +631,32 @@ export async function fetchGetTokenBalancesSummary({
 
     return summaryFromGateway as unknown as GetTokenBalancesSummaryReturn
   } catch (error) {
+    const errorMessage = getFullErrorMessage(error)
+
+    // Check if this is a CORS error or network error
+    const isCorsError =
+      errorMessage.includes("Cross-Origin") ||
+      errorMessage.includes("CORS") ||
+      errorMessage.includes("Same Origin Policy")
+    const isNetworkError =
+      errorMessage.includes("fetch failed") || errorMessage.includes("network")
+
+    if (isCorsError || isNetworkError) {
+      logger.console.warn(
+        "[trails-sdk] Network or CORS error fetching token balances, returning empty result:",
+        {
+          error: errorMessage,
+          account,
+        },
+      )
+      // Return empty balances instead of throwing to prevent error boundary
+      return {
+        balances: [],
+        nativeBalances: [],
+        page: defaultPage,
+      }
+    }
+
     logger.console.error(
       "[trails-sdk] Failed to fetch token balances summary:",
       error,
@@ -593,7 +670,7 @@ export async function getTokenBalances({
   indexerGatewayClient,
 }: GetTokenBalancesParams): Promise<GetTokenBalancesSummaryReturn> {
   return tokenBalancesQueryClient.fetchQuery({
-    queryKey: ["tokenBalances", "summary", account],
+    queryKey: ["fetchGetTokenBalancesSummary", "summary", account],
     queryFn: () =>
       fetchGetTokenBalancesSummary({ account, indexerGatewayClient }),
     staleTime: REFRESH_INTERVAL, // 10 seconds - faster updates for balance changes
@@ -603,17 +680,23 @@ export async function getTokenBalances({
 
 // Cache invalidation utility function
 export function invalidateTokenBalancesCache(account?: string) {
+  // Invalidate all token balance queries that match the pattern
+  // This will match all queries starting with ["tokenBalances", ...]
+  // We invalidate all instead of filtering by account because queries have
+  // different structures: ["tokenBalances", "summary", address],
+  // ["tokenBalances", "sorted", address, ...], etc.
   if (account) {
-    // Invalidate specific account's token balances
-    tokenBalancesQueryClient.invalidateQueries({
-      queryKey: ["tokenBalances", account],
-    })
+    logger.console.log(
+      "[trails-sdk] Invalidating token balances cache for account:",
+      account,
+    )
   } else {
-    // Invalidate all token balance queries
-    tokenBalancesQueryClient.invalidateQueries({
-      queryKey: ["tokenBalances"],
-    })
+    logger.console.log("[trails-sdk] Invalidating all token balances cache")
   }
+
+  tokenBalancesQueryClient.invalidateQueries({
+    queryKey: ["getTokenBalancesWithPrices"],
+  })
 }
 
 export type GetTokenBalancesFlatArrayParams = {
@@ -684,7 +767,7 @@ export async function getTokenBalancesFlatArray({
 export type GetTokenBalancesWithPricesParams = {
   account: string
   indexerGatewayClient: SequenceIndexerGateway
-  apiClient: SequenceAPIClient
+  trailsClient: TrailsClient
 }
 
 export type GetTokenBalancesWithPriceReturn = {
@@ -694,32 +777,43 @@ export type GetTokenBalancesWithPriceReturn = {
 export async function getTokenBalancesWithPrices({
   account,
   indexerGatewayClient,
-  apiClient,
+  trailsClient,
 }: GetTokenBalancesWithPricesParams): Promise<GetTokenBalancesWithPriceReturn> {
   const tokens = await getTokenBalancesFlatArray({
     account,
     indexerGatewayClient,
   })
-  const tokenPrices = await getTokenPrices(apiClient, tokens)
+  const tokenPrices = await getTokenPrices(
+    trailsClient,
+    tokens.map((t) => ({
+      chainId: t.chainId,
+      tokenAddress: t.contractAddress || zeroAddress,
+      tokenSymbol: t.contractInfo?.symbol || "",
+    })),
+  )
   const balancesWithPrices = tokens.map((b) => {
-    const price = tokenPrices.find((p) => {
+    const priceData: TrailsTokenPrice | undefined = tokenPrices.find((p) => {
       const isSameChain = p.token.chainId === b.chainId
-      let isSameToken = p.token.contractAddress === b.contractAddress
+      let isSameToken = p.token.tokenAddress === b.contractAddress
       if (!b.contractAddress) {
         isSameToken =
-          p.token.contractAddress === zeroAddress || !p.token.contractAddress
+          p.token.tokenAddress === zeroAddress || !p.token.tokenAddress
       }
       return isSameChain && isSameToken
     })
 
+    // Convert TrailsTokenPrice to Price format for compatibility
+    const price: Price | undefined =
+      priceData?.priceUsd !== undefined
+        ? { value: priceData.priceUsd, currency: "USD" }
+        : undefined
+
     return {
       ...b,
-      price: price?.price,
-      balanceUsd: price?.price
-        ? getTokenBalanceUsd(b, price?.price)
-        : undefined,
-      balanceUsdFormatted: price?.price
-        ? getTokenBalanceUsdFormatted(b, price?.price)
+      price,
+      balanceUsd: price ? getTokenBalanceUsd(b, price) : undefined,
+      balanceUsdFormatted: price
+        ? getTokenBalanceUsdFormatted(b, price)
         : undefined,
     }
   })
@@ -734,7 +828,7 @@ export type UseAccountTokenBalanceParams = {
   token?: string | null
   chainId?: number | null
   indexerGatewayClient?: SequenceIndexerGateway | null
-  apiClient?: SequenceAPIClient | null
+  trailsClient?: TrailsClient | null
 }
 
 export function useAccountTokenBalance({
@@ -742,15 +836,15 @@ export function useAccountTokenBalance({
   token,
   chainId,
   indexerGatewayClient,
-  apiClient,
+  trailsClient,
 }: UseAccountTokenBalanceParams) {
   const { data: tokenBalance, isLoading: isLoadingTokenBalance } = useQuery({
-    queryKey: ["tokenBalances", "balances", account],
+    queryKey: ["getTokenBalancesWithPrices", "balances", account],
     queryFn: async () => {
       if (
         !account ||
         !indexerGatewayClient ||
-        !apiClient ||
+        !trailsClient ||
         !token ||
         !chainId
       ) {
@@ -759,7 +853,7 @@ export function useAccountTokenBalance({
       const { balances } = await getTokenBalancesWithPrices({
         account,
         indexerGatewayClient,
-        apiClient,
+        trailsClient,
       })
       const tokenBalance = balances.find(
         (b) =>
@@ -784,7 +878,7 @@ export type HasSufficientBalanceParams = {
   amount: string
   chainId: number
   indexerGatewayClient: SequenceIndexerGateway
-  apiClient: SequenceAPIClient
+  trailsClient: TrailsClient
 }
 
 export async function getHasSufficientBalanceToken({
@@ -793,12 +887,12 @@ export async function getHasSufficientBalanceToken({
   amount,
   chainId,
   indexerGatewayClient,
-  apiClient,
+  trailsClient,
 }: HasSufficientBalanceParams): Promise<boolean> {
   const { balances } = await getTokenBalancesWithPrices({
     account,
     indexerGatewayClient,
-    apiClient,
+    trailsClient,
   })
   const tokenBalance: TokenBalanceExtended | null | undefined = balances.find(
     (b) =>
@@ -829,13 +923,20 @@ export function useHasSufficientBalanceToken(
   isLoadingHasSufficientBalanceToken: boolean
 } {
   const indexerGatewayClient = useIndexerGatewayClient()
-  const apiClient = useAPIClient()
+  const trailsClient = useTrailsClient()
 
   const {
     data: hasSufficientBalanceToken,
     isLoading: isLoadingHasSufficientBalanceToken,
   } = useQuery({
-    queryKey: ["tokenBalances", "sufficient", account, token, amount, chainId],
+    queryKey: [
+      "getHasSufficientBalanceToken",
+      "sufficient",
+      account,
+      token,
+      amount,
+      chainId,
+    ],
     queryFn: () =>
       account
         ? getHasSufficientBalanceToken({
@@ -844,7 +945,7 @@ export function useHasSufficientBalanceToken(
             amount: amount,
             chainId: chainId,
             indexerGatewayClient: indexerGatewayClient,
-            apiClient: apiClient,
+            trailsClient: trailsClient,
           })
         : null,
     enabled: !!account && !!token && !!amount && !!chainId,
@@ -869,19 +970,19 @@ export type GetHasSufficientBalanceUsdParams = {
   account: string
   targetAmountUsd: number | string
   indexerGatewayClient: SequenceIndexerGateway
-  apiClient: SequenceAPIClient
+  trailsClient: TrailsClient
 }
 
 export async function getHasSufficientBalanceUsd({
   account,
   targetAmountUsd,
   indexerGatewayClient,
-  apiClient,
+  trailsClient,
 }: GetHasSufficientBalanceUsdParams): Promise<boolean> {
   const totalBalanceUsd = await getAccountTotalBalanceUsd({
     account,
     indexerGatewayClient,
-    apiClient,
+    trailsClient,
   })
   return totalBalanceUsd >= Number(targetAmountUsd)
 }
@@ -895,21 +996,26 @@ export function useHasSufficientBalanceUsd(
   hasSufficientBalanceUsdError: Error | null
 } {
   const indexerGatewayClient = useIndexerGatewayClient()
-  const apiClient = useAPIClient()
+  const trailsClient = useTrailsClient()
 
   const {
     data: hasSufficientBalanceUsd,
     isLoading: isLoadingHasSufficientBalanceUsd,
     error: hasSufficientBalanceUsdError,
   } = useQuery({
-    queryKey: ["tokenBalances", "sufficientUsd", account, targetAmountUsd],
+    queryKey: [
+      "getHasSufficientBalanceUsd",
+      "sufficientUsd",
+      account,
+      targetAmountUsd,
+    ],
     queryFn: () =>
       account && targetAmountUsd
         ? getHasSufficientBalanceUsd({
             account: account,
             targetAmountUsd: targetAmountUsd,
             indexerGatewayClient: indexerGatewayClient,
-            apiClient: apiClient,
+            trailsClient: trailsClient,
           })
         : false,
     enabled: !!account && !!targetAmountUsd,
@@ -935,18 +1041,18 @@ export function useHasSufficientBalanceUsd(
 export type GetAccountTotalBalanceUsdParams = {
   account: string
   indexerGatewayClient: SequenceIndexerGateway
-  apiClient: SequenceAPIClient
+  trailsClient: TrailsClient
 }
 
 export async function getAccountTotalBalanceUsd({
   account,
   indexerGatewayClient,
-  apiClient,
+  trailsClient,
 }: GetAccountTotalBalanceUsdParams): Promise<number> {
   const { balances } = await getTokenBalancesWithPrices({
     account,
     indexerGatewayClient,
-    apiClient,
+    trailsClient,
   })
 
   return balances.reduce((acc, b) => acc + (b.balanceUsd ?? 0), 0)
@@ -958,17 +1064,17 @@ export function useAccountTotalBalanceUsd(account: string): {
   totalBalanceUsdFormatted: string
 } {
   const indexerGatewayClient = useIndexerGatewayClient()
-  const apiClient = useAPIClient()
+  const trailsClient = useTrailsClient()
 
   const { data: totalBalanceUsd, isLoading: isLoadingTotalBalanceUsd } =
     useQuery({
-      queryKey: ["tokenBalances", "totalUsd", account],
+      queryKey: ["getAccountTotalBalanceUsd", "totalUsd", account],
       queryFn: () =>
         account
           ? getAccountTotalBalanceUsd({
               account: account,
               indexerGatewayClient: indexerGatewayClient,
-              apiClient: apiClient,
+              trailsClient: trailsClient,
             })
           : null,
       enabled: !!account,