0xtrails 0.13.2 → 0.14.0

package/src/widget/hooks/useOnRampTransactionStatus.ts

@@ -1,196 +0,0 @@
-import { useQuery } from "@tanstack/react-query"
-import { SECOND_MS } from "../../utils/time.js"
-import { logger } from "../../logger.js"
-import type { TrailsOnramp } from "../../onrampClient.js"
-import { useOnrampClient } from "../../onrampClient.js"
-
-export interface MeldTransactionStatusOptions {
-  trailsClient?: TrailsOnramp | null
-  transactionId: string | null
-  enabled?: boolean
-}
-
-export type MeldTransactionStatus =
-  | "PENDING"
-  | "PROCESSING"
-  | "COMPLETED"
-  | "FAILED"
-  | "CANCELLED"
-
-export interface MeldTransaction {
-  transactionID: string
-  status: MeldTransactionStatus
-  sourceAmount?: string
-  sourceCurrencyCode?: string
-  destinationAmount?: string
-  destinationCurrencyCode?: string
-  walletAddress?: string
-  createdAt?: string
-  updatedAt?: string
-}
-
-export interface UseOnRampTransactionStatusResult {
-  /**
-   * The current transaction data
-   */
-  transaction: MeldTransaction | null
-  /**
-   * Whether the transaction status is currently being fetched
-   */
-  isLoading: boolean
-  /**
-   * Error object if the request failed, null otherwise
-   */
-  error: Error | null
-  /**
-   * Whether the transaction is complete (success or failure)
-   */
-  isComplete: boolean
-  /**
-   * Whether the transaction succeeded
-   */
-  isSuccess: boolean
-  /**
-   * Whether the transaction failed
-   */
-  isFailed: boolean
-  /**
-   * Refetch the transaction status manually
-   */
-  refetch: () => Promise<void>
-}
-
-/**
- * Hook to poll the status of a Meld onramp transaction.
- *
- * Polls the GetMeldTransaction API endpoint to check transaction progress.
- * Automatically stops polling when transaction reaches a terminal state (COMPLETED, FAILED, CANCELLED).
- *
- * @example
- * ```tsx
- * const { transaction, isComplete, isSuccess } = useOnRampTransactionStatus({
- *   apiKey: "your-api-key",
- *   transactionId: "123",
- *   enabled: true
- * })
- *
- * if (isComplete) {
- *   if (isSuccess) {
- *     console.log("Transaction completed successfully!")
- *   } else {
- *     console.log("Transaction failed")
- *   }
- * }
- * ```
- */
-export function useOnRampTransactionStatus(
-  options: MeldTransactionStatusOptions,
-): UseOnRampTransactionStatusResult {
-  const { trailsClient, transactionId, enabled = true } = options
-
-  const defaultOnrampClient = useOnrampClient()
-
-  const { data, refetch, isLoading, error } = useQuery({
-    queryKey: ["onramp-transaction-status", transactionId, "onrampClient"],
-    queryFn: async (): Promise<MeldTransaction> => {
-      if (!transactionId) {
-        throw new Error("Transaction ID is required")
-      }
-
-      logger.console.log(
-        "[useOnRampTransactionStatus] Fetching transaction status",
-        { transactionId },
-      )
-
-      try {
-        const client = trailsClient || defaultOnrampClient
-        const data = await client.getMeldTransaction({
-          transactionId: transactionId,
-        })
-
-        // Parse the transaction JSON string
-        const transactionData = JSON.parse(
-          data.transaction as unknown as string,
-        )
-        const transaction =
-          transactionData.Transaction ||
-          transactionData.transaction ||
-          transactionData
-
-        if (!transaction) {
-          throw new Error("Invalid response: Transaction not found in response")
-        }
-
-        logger.console.log(
-          "[useOnRampTransactionStatus] Transaction status fetched",
-          {
-            transactionId,
-            status: transaction.status,
-          },
-        )
-
-        return transaction
-      } catch (error: any) {
-        // Handle 404 errors or similar "not found" scenarios
-        if (
-          error.message?.includes("404") ||
-          error.message?.includes("not found")
-        ) {
-          throw new Error("Transaction not registered yet")
-        }
-        throw error
-      }
-    },
-    enabled:
-      enabled &&
-      !!transactionId &&
-      (trailsClient !== undefined ? !!trailsClient : true),
-    refetchInterval: (query) => {
-      // Stop polling when transaction reaches a terminal state
-      const status = query.state.data?.status
-      if (
-        status === "COMPLETED" ||
-        status === "FAILED" ||
-        status === "CANCELLED"
-      ) {
-        return false
-      }
-      // Poll every 3 seconds while transaction is in progress
-      return 3000
-    },
-    retry: (failureCount, error) => {
-      // Don't retry 404 errors - they just mean transaction not registered yet
-      if (error.message === "Transaction not registered yet") {
-        return false
-      }
-      // Retry other errors up to 3 times
-      return failureCount < 3
-    },
-    retryDelay: SECOND_MS,
-  })
-
-  const transaction = data || null
-  const status = transaction?.status
-
-  const isComplete =
-    status === "COMPLETED" || status === "FAILED" || status === "CANCELLED"
-  const isSuccess = status === "COMPLETED"
-  const isFailed = status === "FAILED" || status === "CANCELLED"
-
-  // Don't expose 404 errors as actual errors since they're expected
-  const actualError = error as Error | null
-  const shouldShowError =
-    actualError && actualError.message !== "Transaction not registered yet"
-
-  return {
-    transaction,
-    isLoading,
-    error: shouldShowError ? actualError : null,
-    isComplete,
-    isSuccess,
-    isFailed,
-    refetch: async () => {
-      await refetch()
-    },
-  }
-}

package/src/widget/hooks/useOriginSelectedToken.tsx

@@ -1,253 +0,0 @@
-import React, {
-  createContext,
-  useCallback,
-  useContext,
-  useState,
-  useEffect,
-  useRef,
-  type ReactNode,
-} from "react"
-
-// Define the Token interface (matching the existing one in widget.tsx)
-import type { Token } from "../../tokens.js"
-import { useWidgetProps } from "./useWidgetProps.js"
-import { useSupportedTokens } from "../../tokens.js"
-import { isAddress } from "viem"
-import { logger } from "../../index.js"
-
-interface OriginSelectedTokenContextType {
-  selectedToken: Token | null
-  setSelectedToken: (token: Token | null) => void
-  clearSelectedToken: () => void
-  hasManualSelection: boolean
-  setHasManualSelection: (value: boolean) => void
-}
-
-const OriginSelectedTokenContext = createContext<
-  OriginSelectedTokenContextType | undefined
->(undefined)
-
-interface OriginSelectedTokenProviderProps {
-  children: ReactNode
-  initialToken?: Token | null
-}
-
-export const OriginSelectedTokenProvider: React.FC<
-  OriginSelectedTokenProviderProps
-> = ({ children, initialToken = null }) => {
-  const { fromToken, fromChainId } = useWidgetProps()
-  const { supportedTokens } = useSupportedTokens({
-    disabled: !fromToken || !fromChainId,
-  })
-
-  // Initialize state from localStorage if available, otherwise use initialToken
-  const [selectedToken, setSelectedTokenState] = useState<Token | null>(() => {
-    // Don't load from localStorage if fromToken prop is provided
-    // This allows the prop to take precedence over saved state
-    if (fromToken && fromChainId) {
-      return null // Will be set by useEffect
-    }
-
-    if (typeof window !== "undefined") {
-      try {
-        const savedToken = localStorage.getItem("trails_origin_selected_token")
-        if (savedToken) {
-          return JSON.parse(savedToken)
-        }
-      } catch (error) {
-        console.warn("Failed to parse saved origin token:", error)
-      }
-    }
-    return initialToken
-  })
-
-  // Initialize hasManualSelection based on whether we found a saved token
-  // But not if fromToken prop is provided (prop should take precedence)
-  const [hasManualSelection, setHasManualSelection] = useState(() => {
-    // If fromToken prop is provided, we're not manually selecting
-    if (fromToken && fromChainId) {
-      return false
-    }
-
-    if (typeof window !== "undefined") {
-      return !!localStorage.getItem("trails_origin_selected_token")
-    }
-    return false
-  })
-
-  // Track previous prop values to detect changes
-  const prevFromTokenRef = useRef(fromToken)
-  const prevFromChainIdRef = useRef(fromChainId)
-
-  // Reset manual selection when props change
-  useEffect(() => {
-    if (
-      fromToken !== prevFromTokenRef.current ||
-      fromChainId !== prevFromChainIdRef.current
-    ) {
-      logger.console.log(
-        "[useOriginSelectedToken] Props changed, resetting manual selection",
-      )
-      setHasManualSelection(false)
-      prevFromTokenRef.current = fromToken
-      prevFromChainIdRef.current = fromChainId
-    }
-  }, [fromToken, fromChainId])
-
-  // Handle fromToken/fromChainId prop preselection
-  useEffect(() => {
-    logger.console.log("[useOriginSelectedToken] Checking preselection:", {
-      fromToken,
-      fromChainId,
-      hasManualSelection,
-      hasSelectedToken: !!selectedToken,
-      selectedTokenSymbol: selectedToken?.symbol,
-    })
-
-    // Attempt to preselect if:
-    // 1. Both fromToken and fromChainId are provided
-    // 2. User hasn't manually selected a token yet OR the props have changed
-    if (fromToken && fromChainId && !hasManualSelection) {
-      const chainId =
-        typeof fromChainId === "string" ? Number(fromChainId) : fromChainId
-
-      logger.console.log(
-        "[useOriginSelectedToken] Attempting to preselect token:",
-        {
-          fromToken,
-          chainId,
-        },
-      )
-
-      // Filter tokens for the specified chain
-      const tokensOnChain = supportedTokens.filter(
-        (t: Token) => t.chainId === chainId,
-      )
-
-      // Find matching token
-      let matchingToken: Token | null = null
-
-      // Check if fromToken is an address or symbol
-      if (isAddress(fromToken)) {
-        // Search by contract address
-        matchingToken =
-          tokensOnChain.find(
-            (t: Token) =>
-              t.contractAddress?.toLowerCase() === fromToken.toLowerCase(),
-          ) || null
-      } else {
-        // Search by symbol (case-insensitive)
-        matchingToken =
-          tokensOnChain.find(
-            (t: Token) => t.symbol?.toLowerCase() === fromToken.toLowerCase(),
-          ) || null
-      }
-
-      // Check if we need to update the selection
-      const needsUpdate =
-        !selectedToken ||
-        selectedToken.chainId !== chainId ||
-        (matchingToken &&
-          (selectedToken.contractAddress?.toLowerCase() !==
-            matchingToken.contractAddress?.toLowerCase() ||
-            selectedToken.symbol?.toLowerCase() !==
-              matchingToken.symbol?.toLowerCase()))
-
-      // If token found and needs update, preselect it
-      if (matchingToken && needsUpdate) {
-        logger.console.log(
-          "[useOriginSelectedToken] Found matching token, updating selection:",
-          matchingToken,
-        )
-        setSelectedTokenState(matchingToken)
-        // Don't set hasManualSelection to keep selector enabled
-      } else if (!matchingToken) {
-        logger.console.log(
-          "[useOriginSelectedToken] No matching token found for:",
-          {
-            fromToken,
-            chainId,
-            tokensOnChainCount: tokensOnChain.length,
-          },
-        )
-      }
-    } else if (!fromToken || !fromChainId) {
-      // If props are cleared, clear the selection unless user has manually selected
-      if (!hasManualSelection) {
-        logger.console.log(
-          "[useOriginSelectedToken] Props cleared, clearing selection",
-        )
-        setSelectedTokenState(null)
-      }
-    }
-  }, [
-    fromToken,
-    fromChainId,
-    supportedTokens,
-    hasManualSelection,
-    selectedToken,
-  ])
-
-  const setSelectedToken = useCallback((token: Token | null) => {
-    setSelectedTokenState(token)
-    if (typeof window !== "undefined") {
-      if (token) {
-        // Strip balance data before storing to avoid stale balances
-        const tokenMetadata = {
-          symbol: token.symbol,
-          name: token.name,
-          decimals: token.decimals,
-          contractAddress: token.contractAddress,
-          tokenId: token.tokenId,
-          chainId: token.chainId,
-          chainName: token.chainName,
-          imageUrl: token.imageUrl,
-          isCustomToken: token.isCustomToken,
-          isNativeToken: token.isNativeToken,
-          // Intentionally exclude: balance, balanceFormatted, balanceUsd, etc.
-        }
-        localStorage.setItem(
-          "trails_origin_selected_token",
-          JSON.stringify(tokenMetadata),
-        )
-        setHasManualSelection(true) // Mark as manually selected when user sets a token
-      } else {
-        localStorage.removeItem("trails_origin_selected_token")
-      }
-    }
-  }, [])
-
-  const clearSelectedToken = useCallback(() => {
-    setSelectedTokenState(null)
-    if (typeof window !== "undefined") {
-      localStorage.removeItem("trails_origin_selected_token")
-    }
-    setHasManualSelection(false)
-  }, [])
-
-  const value: OriginSelectedTokenContextType = {
-    selectedToken,
-    setSelectedToken,
-    clearSelectedToken,
-    hasManualSelection,
-    setHasManualSelection,
-  }
-
-  return (
-    <OriginSelectedTokenContext.Provider value={value}>
-      {children}
-    </OriginSelectedTokenContext.Provider>
-  )
-}
-
-export function useOriginSelectedToken(): OriginSelectedTokenContextType {
-  const context = useContext(OriginSelectedTokenContext)
-
-  if (context === undefined) {
-    throw new Error(
-      "useOriginSelectedToken must be used within a OriginSelectedTokenProvider",
-    )
-  }
-
-  return context
-}