0xtrails 0.13.2 → 0.14.0

package/src/widget/providers/TrailsModalProvider.tsx

@@ -1,238 +0,0 @@
-import { createContext, useContext, useState, useCallback, useRef } from "react"
-import { AnimatePresence } from "motion/react"
-import { logger } from "../../logger.js"
-import type { PrepareSendQuote } from "../../prepareSend.js"
-import type { TransactionState } from "../../transactions.js"
-import { TrailsHookModal } from "../components/TrailsHookModal.js"
-
-export interface ModalSelectionParams {
-  fromTokenAddress: string
-  fromChainId: number
-  fromAmount?: string
-}
-
-export type HostTransactionStatus =
-  | "idle"
-  | "awaiting-origin"
-  | "awaiting-amount"
-  | "confirmation"
-  | "pending"
-  | "success"
-  | "error"
-
-export interface HostTransactionDetails {
-  to?: string
-  tokenAddress?: string
-  tokenAmount?: string
-  toChainId?: number
-  data?: string
-}
-
-export interface HostTransactionResultLinks {
-  originTxHash?: string
-  originExplorerUrl?: string
-  destinationTxHash?: string
-  destinationExplorerUrl?: string
-}
-
-export interface HostTransactionState {
-  status: HostTransactionStatus
-  details?: HostTransactionDetails
-  error?: string
-  result?: HostTransactionResultLinks
-  retryEnabled?: boolean
-}
-
-export interface LastOriginSelection {
-  tokenAddress: string
-  chainId: number
-  amount?: string
-}
-
-export interface TrailsModalContextType {
-  isModalOpen: boolean
-  openModal: () => void
-  closeModal: () => void
-  getHandleCloseModal: () => (() => void) | null
-  setHandleCloseModal: (handler: (() => void) | null) => void
-  pendingSelection?: {
-    resolve: (selection: ModalSelectionParams) => void
-    reject: (error: Error) => void
-    requireAmountInput?: boolean
-  }
-  setPendingSelection: (
-    pending:
-      | {
-          resolve: (selection: ModalSelectionParams) => void
-          reject: (error: Error) => void
-          requireAmountInput?: boolean
-        }
-      | undefined,
-  ) => void
-  hostTransactionState: HostTransactionState
-  setHostTransactionState: (
-    next:
-      | HostTransactionState
-      | ((prev: HostTransactionState) => HostTransactionState),
-  ) => void
-  resetHostTransactionState: () => void
-  resetForNewTransaction: () => void
-  hostTransactionQuote: PrepareSendQuote | null
-  setHostTransactionQuote: (
-    quote:
-      | PrepareSendQuote
-      | null
-      | ((prev: PrepareSendQuote | null) => PrepareSendQuote | null),
-  ) => void
-  hostTransactionStates: TransactionState[]
-  setHostTransactionStates: (
-    states:
-      | TransactionState[]
-      | ((prev: TransactionState[]) => TransactionState[]),
-  ) => void
-  hostTransactionTimestamp: number | null
-  setHostTransactionTimestamp: (
-    value: number | null | ((prev: number | null) => number | null),
-  ) => void
-  receiptActionButtonText: string | null
-  setReceiptActionButtonText: (text: string | null) => void
-  onReceiptAction: (() => void) | null
-  setOnReceiptAction: (callback: (() => void) | null) => void
-  retryTransactionRef: { current: (() => void) | null }
-  repeatTransactionRef: { current: (() => void) | null }
-  lastOriginSelection: LastOriginSelection | null
-  setLastOriginSelection: (selection: LastOriginSelection | null) => void
-}
-
-const TrailsModalContext = createContext<TrailsModalContextType | null>(null)
-
-export interface TrailsModalProviderProps {
-  children: React.ReactNode
-}
-
-export const TrailsModalProvider = ({ children }: TrailsModalProviderProps) => {
-  // Modal state management for useTrailsSendTransaction hook
-  const [isModalOpen, setIsModalOpen] = useState(false)
-  const [pendingSelection, setPendingSelection] = useState<
-    | {
-        resolve: (selection: ModalSelectionParams) => void
-        reject: (error: Error) => void
-        requireAmountInput?: boolean
-      }
-    | undefined
-  >(undefined)
-  const [hostTransactionState, setHostTransactionState] =
-    useState<HostTransactionState>({ status: "idle" })
-  const [hostTransactionQuote, setHostTransactionQuote] =
-    useState<PrepareSendQuote | null>(null)
-  const [hostTransactionStates, setHostTransactionStates] = useState<
-    TransactionState[]
-  >([])
-  const [hostTransactionTimestamp, setHostTransactionTimestamp] = useState<
-    number | null
-  >(null)
-  const [receiptActionButtonText, setReceiptActionButtonText] = useState<
-    string | null
-  >(null)
-  const [onReceiptAction, setOnReceiptAction] = useState<(() => void) | null>(
-    null,
-  )
-  const retryTransactionRef = useRef<(() => void) | null>(null)
-  const repeatTransactionRef = useRef<(() => void) | null>(null)
-  const handleCloseModalRef = useRef<(() => void) | null>(null)
-  const [lastOriginSelection, setLastOriginSelection] =
-    useState<LastOriginSelection | null>(null)
-
-  const openModal = useCallback(() => {
-    logger.console.log("[trails-sdk] [TrailsModalProvider] openModal called")
-    setIsModalOpen(true)
-  }, [])
-
-  const closeModal = useCallback(() => {
-    setIsModalOpen(false)
-    // Reject any pending selection if modal is closed
-    if (pendingSelection) {
-      pendingSelection.reject(
-        new Error("Modal was closed before selection completed"),
-      )
-      setPendingSelection(undefined)
-    }
-  }, [pendingSelection])
-
-  const resetHostTransactionState = useCallback(() => {
-    setHostTransactionState({ status: "idle" })
-    setHostTransactionQuote(null)
-    setHostTransactionStates([])
-    setHostTransactionTimestamp(null)
-    setReceiptActionButtonText(null)
-    setOnReceiptAction(null)
-    retryTransactionRef.current = null
-  }, [])
-
-  // Reset state for a new transaction without closing the modal (used by "Swap Again" button)
-  const resetForNewTransaction = useCallback(() => {
-    logger.console.log(
-      "[trails-sdk] [TrailsModalProvider] resetForNewTransaction called",
-    )
-    setHostTransactionState({ status: "awaiting-origin" })
-    setHostTransactionQuote(null)
-    setHostTransactionStates([])
-    setHostTransactionTimestamp(null)
-    // Keep receiptActionButtonText and onReceiptAction for next transaction
-    retryTransactionRef.current = null
-  }, [])
-
-  const setHandleCloseModal = useCallback((handler: (() => void) | null) => {
-    handleCloseModalRef.current = handler
-  }, [])
-
-  const getHandleCloseModal = useCallback(() => {
-    return handleCloseModalRef.current
-  }, [])
-
-  const value: TrailsModalContextType = {
-    isModalOpen,
-    openModal,
-    closeModal,
-    getHandleCloseModal,
-    setHandleCloseModal,
-    pendingSelection,
-    setPendingSelection,
-    hostTransactionState,
-    setHostTransactionState,
-    resetHostTransactionState,
-    resetForNewTransaction,
-    hostTransactionQuote,
-    setHostTransactionQuote,
-    hostTransactionStates,
-    setHostTransactionStates,
-    hostTransactionTimestamp,
-    setHostTransactionTimestamp,
-    receiptActionButtonText,
-    setReceiptActionButtonText,
-    onReceiptAction,
-    setOnReceiptAction,
-    retryTransactionRef,
-    repeatTransactionRef,
-    lastOriginSelection,
-    setLastOriginSelection,
-  }
-
-  return (
-    <TrailsModalContext.Provider value={value}>
-      {children}
-      {/* Render TrailsHookModal with AnimatePresence for proper exit animations */}
-      <AnimatePresence>{isModalOpen && <TrailsHookModal />}</AnimatePresence>
-    </TrailsModalContext.Provider>
-  )
-}
-
-export function useTrailsModal(): TrailsModalContextType {
-  const context = useContext(TrailsModalContext)
-
-  if (!context) {
-    throw new Error("useTrailsModal must be used within a TrailsModalProvider")
-  }
-
-  return context
-}

package/src/widget/providers/TrailsProvider.tsx

@@ -1,155 +0,0 @@
-import {
-  createContext,
-  useContext,
-  useMemo,
-  useEffect,
-  type ComponentProps,
-} from "react"
-import { SequenceHooksProvider } from "@0xsequence/hooks"
-import { TrailsModalProvider } from "./TrailsModalProvider.js"
-import { UserActivityProvider } from "./UserActivityProvider.js"
-import {
-  DEFAULT_SLIPPAGE_TOLERANCE,
-  DEFAULT_WALLETCONNECT_PROJECT_ID,
-  PROD_SEQUENCE_INDEXER_URL,
-  PROD_SEQUENCE_NODE_GATEWAY_URL,
-  PROD_SEQUENCE_METADATA_URL,
-  PROD_TRAILS_API_URL,
-  PROD_TRAILS_APP_URL,
-  PROD_SEQUENCE_API_URL,
-  PROD_KEYMACHINE_URL,
-} from "../../constants.js"
-import { declareCommitHash, updateGlobalConfig } from "../../config.js"
-import { updateProjectAccessKey } from "../../analytics.js"
-import { useSyncLoggerDebug } from "../../logger/useSyncLoggerDebug.js"
-import { getQueryParam } from "../../queryParams.js"
-
-export type SequenceEnv = "prod" | "dev" | "local" | "cors-anywhere"
-
-export interface TrailsConfig {
-  trailsApiKey: string
-  trailsApiUrl: string
-  trailsAppUrl: string
-  sequenceIndexerUrl: string
-  sequenceNodeGatewayUrl: string
-  sequenceMetadataUrl: string
-  sequenceApiUrl: string
-  keyMachineUrl: string
-  walletConnectProjectId: string
-  slippageTolerance: string | number
-  debug: boolean
-  commitHash: string | undefined
-}
-
-export interface TrailsProviderProps {
-  children: React.ReactNode
-  config: {
-    trailsApiKey: string
-    trailsApiUrl?: string
-    trailsAppUrl?: string
-    sequenceIndexerUrl?: string
-    sequenceNodeGatewayUrl?: string
-    sequenceMetadataUrl?: string
-    sequenceApiUrl?: string
-    keyMachineUrl?: string
-    walletConnectProjectId?: string
-    slippageTolerance?: string | number
-    debug?: boolean
-  }
-}
-
-export const TrailsContext = createContext<TrailsConfig | null>(null)
-
-export const TrailsProvider = ({ children, config }: TrailsProviderProps) => {
-  const resolvedDebug =
-    (config.debug ?? false) || getQueryParam("debug") === "true"
-
-  useSyncLoggerDebug(resolvedDebug)
-
-  // Populate the trails config with default values if not provided
-  const trailsConfig: TrailsConfig = useMemo(() => {
-    return {
-      trailsApiKey: config.trailsApiKey,
-      trailsApiUrl: config.trailsApiUrl || PROD_TRAILS_API_URL,
-      trailsAppUrl: config.trailsAppUrl || PROD_TRAILS_APP_URL,
-      sequenceIndexerUrl:
-        config.sequenceIndexerUrl || PROD_SEQUENCE_INDEXER_URL,
-      sequenceNodeGatewayUrl:
-        config.sequenceNodeGatewayUrl || PROD_SEQUENCE_NODE_GATEWAY_URL,
-      sequenceMetadataUrl:
-        config.sequenceMetadataUrl || PROD_SEQUENCE_METADATA_URL,
-      sequenceApiUrl: config.sequenceApiUrl || PROD_SEQUENCE_API_URL,
-      keyMachineUrl: config.keyMachineUrl || PROD_KEYMACHINE_URL,
-      walletConnectProjectId:
-        config.walletConnectProjectId || DEFAULT_WALLETCONNECT_PROJECT_ID,
-      slippageTolerance: config.slippageTolerance ?? DEFAULT_SLIPPAGE_TOLERANCE,
-      debug: resolvedDebug,
-      commitHash: declareCommitHash(),
-      // Onramp feature flags with defaults
-    } satisfies TrailsConfig
-  }, [
-    config.trailsApiKey,
-    config.trailsApiUrl,
-    config.trailsAppUrl,
-    config.sequenceIndexerUrl,
-    config.sequenceMetadataUrl,
-    config.sequenceNodeGatewayUrl,
-    config.sequenceApiUrl,
-    config.keyMachineUrl,
-    config.walletConnectProjectId,
-    config.slippageTolerance,
-    resolvedDebug,
-  ])
-
-  // Update global config when trails config changes (temporary solution)
-  useEffect(() => {
-    updateGlobalConfig({
-      trailsApiKey: trailsConfig.trailsApiKey,
-      trailsApiUrl: trailsConfig.trailsApiUrl,
-      sequenceNodeGatewayUrl: trailsConfig.sequenceNodeGatewayUrl,
-    })
-  }, [
-    trailsConfig.trailsApiKey,
-    trailsConfig.trailsApiUrl,
-    trailsConfig.sequenceNodeGatewayUrl,
-  ])
-
-  // Update analytics project access key for hooks-only usage (without widget)
-  useEffect(() => {
-    if (trailsConfig.trailsApiKey) {
-      updateProjectAccessKey(trailsConfig.trailsApiKey)
-    }
-  }, [trailsConfig.trailsApiKey])
-
-  const sequenceHooksConfig = useMemo(() => {
-    return {
-      projectAccessKey: trailsConfig.trailsApiKey || "",
-      env: {
-        apiUrl: trailsConfig.sequenceApiUrl,
-        metadataUrl: trailsConfig.sequenceMetadataUrl,
-        indexerUrl: trailsConfig.sequenceIndexerUrl,
-        indexerGatewayUrl: trailsConfig.sequenceIndexerUrl,
-      },
-    } satisfies ComponentProps<typeof SequenceHooksProvider>["config"]
-  }, [trailsConfig])
-
-  return (
-    <TrailsContext.Provider value={trailsConfig}>
-      <UserActivityProvider>
-        <SequenceHooksProvider config={sequenceHooksConfig}>
-          <TrailsModalProvider>{children}</TrailsModalProvider>
-        </SequenceHooksProvider>
-      </UserActivityProvider>
-    </TrailsContext.Provider>
-  )
-}
-
-export function useTrails(): Readonly<TrailsConfig> {
-  const context = useContext(TrailsContext)
-
-  if (!context) {
-    throw new Error("useTrails must be used within a TrailsProvider")
-  }
-
-  return context
-}

package/src/widget/providers/UserActivityProvider.tsx

@@ -1,78 +0,0 @@
-import { createContext, useContext, useEffect, useRef, useState } from "react"
-import { MINUTE_MS, SECOND_MS } from "../../utils/time.js"
-
-const INACTIVITY_TIMEOUT_MS = 2 * MINUTE_MS // 2 minutes
-const THROTTLE_MS = SECOND_MS // 1 second throttle for event handlers
-
-interface UserActivityContextValue {
-  isUserActive: boolean
-}
-
-const UserActivityContext = createContext<UserActivityContextValue>({
-  isUserActive: true,
-})
-
-/**
- * Provider that tracks user activity on the page.
- * Provides isUserActive: true when user has interacted within the last 2 minutes.
- * Used to pause background data fetching when user is inactive.
- */
-export function UserActivityProvider({
-  children,
-}: {
-  children: React.ReactNode
-}) {
-  const [isUserActive, setIsUserActive] = useState(true)
-  const timeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(
-    undefined,
-  )
-  const lastCallRef = useRef<number>(0)
-
-  useEffect(() => {
-    const resetTimer = () => {
-      setIsUserActive(true)
-      if (timeoutRef.current) clearTimeout(timeoutRef.current)
-      timeoutRef.current = setTimeout(
-        () => setIsUserActive(false),
-        INACTIVITY_TIMEOUT_MS,
-      )
-    }
-
-    // Throttled version to avoid excessive calls from high-frequency events like mousemove
-    const throttledResetTimer = () => {
-      const now = Date.now()
-      if (now - lastCallRef.current >= THROTTLE_MS) {
-        lastCallRef.current = now
-        resetTimer()
-      }
-    }
-
-    const events = ["mousemove", "keydown", "click", "scroll", "touchstart"]
-    events.forEach((event) => {
-      window.addEventListener(event, throttledResetTimer, { passive: true })
-    })
-
-    resetTimer() // Start timer on mount (unthrottled)
-
-    return () => {
-      events.forEach((event) => {
-        window.removeEventListener(event, throttledResetTimer)
-      })
-      if (timeoutRef.current) clearTimeout(timeoutRef.current)
-    }
-  }, [])
-
-  return (
-    <UserActivityContext.Provider value={{ isUserActive }}>
-      {children}
-    </UserActivityContext.Provider>
-  )
-}
-
-/**
- * Hook to get the current user activity state.
- * Returns isUserActive: true when user has interacted within the last 2 minutes.
- */
-export function useUserActivityContext() {
-  return useContext(UserActivityContext)
-}

package/src/widget/providers/WidgetProviderTree.tsx

@@ -1,90 +0,0 @@
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
-import React, { useContext } from "react"
-import type { createConfig } from "wagmi"
-import { WagmiContext, WagmiProvider } from "wagmi"
-import { queryClient, defaultQueryOptions } from "../../query/client.js"
-import { TrailsContext, TrailsProvider } from "./TrailsProvider.js"
-import type { TrailsProviderProps } from "./TrailsProvider.js"
-
-export interface ProviderTreeProps {
-  widgetContent: React.ReactNode
-  wagmiConfig: ReturnType<typeof createConfig>
-  trailsConfig: TrailsProviderProps["config"]
-}
-
-/**
- * Provider wrapper for isolated (decoupled) widget embedding.
- * Always creates its own WagmiProvider + QueryClient for full cache isolation.
- * Wraps with TrailsProvider only if no parent TrailsProvider exists.
- */
-export const IsolatedProviders: React.FC<ProviderTreeProps> = ({
-  widgetContent,
-  wagmiConfig,
-  trailsConfig,
-}) => {
-  const trailsContext = useContext(TrailsContext)
-
-  const decoupledQueryClient = React.useMemo(
-    () =>
-      new QueryClient({
-        defaultOptions: {
-          queries: {
-            ...defaultQueryOptions.queries,
-            // Override: widget embedded in host app needs background updates
-            refetchIntervalInBackground: true,
-          },
-        },
-      }),
-    [],
-  )
-
-  const content = (
-    // IMPORTANT: reconnectOnMount={false} prevents infinite loop on reload with connected wallet
-    <WagmiProvider config={wagmiConfig} reconnectOnMount={false}>
-      <QueryClientProvider client={decoupledQueryClient}>
-        {widgetContent}
-      </QueryClientProvider>
-    </WagmiProvider>
-  )
-
-  return trailsContext ? (
-    content
-  ) : (
-    <TrailsProvider config={trailsConfig}>{content}</TrailsProvider>
-  )
-}
-
-/**
- * Provider wrapper for the default (non-decoupled) widget path.
- * Wraps with WagmiProvider only if no parent WagmiProvider exists.
- * Wraps with TrailsProvider only if no parent TrailsProvider exists.
- * Uses the singleton QueryClient.
- */
-export const DefaultProviders: React.FC<ProviderTreeProps> = ({
-  widgetContent,
-  wagmiConfig,
-  trailsConfig,
-}) => {
-  const wagmiContext = useContext(WagmiContext)
-  const trailsContext = useContext(TrailsContext)
-
-  const wagmiWrappedContent = wagmiContext ? (
-    widgetContent
-  ) : (
-    <WagmiProvider config={wagmiConfig}>{widgetContent}</WagmiProvider>
-  )
-
-  const queryClientWrappedContent = (
-    <QueryClientProvider client={queryClient}>
-      {wagmiWrappedContent}
-    </QueryClientProvider>
-  )
-
-  return trailsContext ? (
-    queryClientWrappedContent
-  ) : (
-    <TrailsProvider config={trailsConfig}>
-      {queryClientWrappedContent}
-    </TrailsProvider>
-  )
-}