@shapeshiftoss/swap-widget 0.0.2 → 0.2.0

package/src/hooks/useSwapHandlers.ts

@@ -1,119 +0,0 @@
-import { useCallback } from 'react'
-
-import { useSwapWallet } from '../contexts/SwapWalletContext'
-import { SwapMachineCtx } from '../machines/SwapMachineContext'
-import type { Asset, TradeRate } from '../types'
-import { parseAmount } from '../types'
-
-type UseSwapHandlersParams = {
-  onConnectWallet?: () => void
-  onAssetSelect?: (type: 'sell' | 'buy', asset: Asset) => void
-}
-
-export const useSwapHandlers = ({ onConnectWallet, onAssetSelect }: UseSwapHandlersParams) => {
-  const actorRef = SwapMachineCtx.useActorRef()
-  const { walletClient, bitcoin, solana } = useSwapWallet()
-
-  const handleSwapTokens = useCallback(() => {
-    const snap = actorRef.getSnapshot()
-    actorRef.send({ type: 'SET_SELL_ASSET', asset: snap.context.buyAsset })
-    actorRef.send({ type: 'SET_BUY_ASSET', asset: snap.context.sellAsset })
-    actorRef.send({ type: 'SET_SELL_AMOUNT', amount: '', amountBaseUnit: undefined })
-  }, [actorRef])
-
-  const handleSellAssetSelect = useCallback(
-    (asset: Asset) => {
-      actorRef.send({ type: 'SET_SELL_ASSET', asset })
-      onAssetSelect?.('sell', asset)
-    },
-    [actorRef, onAssetSelect],
-  )
-
-  const handleBuyAssetSelect = useCallback(
-    (asset: Asset) => {
-      actorRef.send({ type: 'SET_BUY_ASSET', asset })
-      onAssetSelect?.('buy', asset)
-    },
-    [actorRef, onAssetSelect],
-  )
-
-  const handleSellAmountChange = useCallback(
-    (value: string) => {
-      const snap = actorRef.getSnapshot()
-      const baseUnit = value ? parseAmount(value, snap.context.sellAsset.precision) : undefined
-      actorRef.send({ type: 'SET_SELL_AMOUNT', amount: value, amountBaseUnit: baseUnit })
-    },
-    [actorRef],
-  )
-
-  const handleSelectRate = useCallback(
-    (rate: TradeRate) => {
-      actorRef.send({ type: 'SELECT_RATE', rate })
-    },
-    [actorRef],
-  )
-
-  const handleSlippageChange = useCallback(
-    (value: string) => {
-      actorRef.send({ type: 'SET_SLIPPAGE', slippage: value })
-    },
-    [actorRef],
-  )
-
-  const redirectToShapeShift = useCallback(() => {
-    const snap = actorRef.getSnapshot()
-    const params = new URLSearchParams({
-      sellAssetId: snap.context.sellAsset.assetId,
-      buyAssetId: snap.context.buyAsset.assetId,
-      sellAmount: snap.context.sellAmount,
-    })
-    window.open(
-      `https://app.shapeshift.com/trade?${params.toString()}`,
-      '_blank',
-      'noopener,noreferrer',
-    )
-  }, [actorRef])
-
-  const handleButtonClick = useCallback(() => {
-    const snap = actorRef.getSnapshot()
-    if (snap.context.isSellAssetUtxo && !bitcoin.isConnected) {
-      return
-    }
-    if (snap.context.isSellAssetSolana && !solana.isConnected) {
-      return
-    }
-    if (!walletClient && snap.context.isSellAssetEvm && onConnectWallet) {
-      onConnectWallet()
-      return
-    }
-    if (
-      !snap.context.isSellAssetEvm &&
-      !snap.context.isSellAssetUtxo &&
-      !snap.context.isSellAssetSolana
-    ) {
-      const params = new URLSearchParams({
-        sellAssetId: snap.context.sellAsset.assetId,
-        buyAssetId: snap.context.buyAsset.assetId,
-        sellAmount: snap.context.sellAmount,
-      })
-      window.open(
-        `https://app.shapeshift.com/trade?${params.toString()}`,
-        '_blank',
-        'noopener,noreferrer',
-      )
-      return
-    }
-    actorRef.send({ type: 'FETCH_QUOTE' })
-  }, [actorRef, bitcoin.isConnected, solana.isConnected, walletClient, onConnectWallet])
-
-  return {
-    handleSwapTokens,
-    handleSellAssetSelect,
-    handleBuyAssetSelect,
-    handleSellAmountChange,
-    handleSelectRate,
-    handleSlippageChange,
-    redirectToShapeShift,
-    handleButtonClick,
-  }
-}

package/src/hooks/useSwapQuote.ts

@@ -1,71 +0,0 @@
-import { useQuery } from '@tanstack/react-query'
-
-import type { ApiClient } from '../api/client'
-import type { AssetId, QuoteResponse, SwapperName } from '../types'
-
-export type UseSwapQuoteParams = {
-  sellAssetId: AssetId | undefined
-  buyAssetId: AssetId | undefined
-  sellAmountCryptoBaseUnit: string | undefined
-  sendAddress: string | undefined
-  receiveAddress: string | undefined
-  swapperName: SwapperName | undefined
-  slippageTolerancePercentageDecimal?: string
-  enabled?: boolean
-}
-
-export const useSwapQuote = (apiClient: ApiClient, params: UseSwapQuoteParams) => {
-  const {
-    sellAssetId,
-    buyAssetId,
-    sellAmountCryptoBaseUnit,
-    sendAddress,
-    receiveAddress,
-    swapperName,
-    slippageTolerancePercentageDecimal,
-    enabled = true,
-  } = params
-
-  return useQuery({
-    queryKey: [
-      'swapQuote',
-      sellAssetId,
-      buyAssetId,
-      sellAmountCryptoBaseUnit,
-      sendAddress,
-      receiveAddress,
-      swapperName,
-      slippageTolerancePercentageDecimal,
-    ],
-    queryFn: (): Promise<QuoteResponse | null> => {
-      if (
-        !sellAssetId ||
-        !buyAssetId ||
-        !sellAmountCryptoBaseUnit ||
-        !sendAddress ||
-        !receiveAddress ||
-        !swapperName
-      ) {
-        return Promise.resolve(null)
-      }
-      return apiClient.getQuote({
-        sellAssetId,
-        buyAssetId,
-        sellAmountCryptoBaseUnit,
-        sendAddress,
-        receiveAddress,
-        swapperName,
-        slippageTolerancePercentageDecimal,
-      })
-    },
-    enabled:
-      enabled &&
-      !!sellAssetId &&
-      !!buyAssetId &&
-      !!sellAmountCryptoBaseUnit &&
-      !!sendAddress &&
-      !!receiveAddress &&
-      !!swapperName,
-    staleTime: 30_000,
-  })
-}

package/src/hooks/useSwapQuoting.ts

@@ -1,102 +0,0 @@
-import { useEffect, useRef } from 'react'
-
-import type { ApiClient } from '../api/client'
-import { useSwapWallet } from '../contexts/SwapWalletContext'
-import { SwapMachineCtx } from '../machines/SwapMachineContext'
-import type { TradeRate } from '../types'
-
-type BalanceData =
-  | {
-      balance: string
-      balanceFormatted: string
-    }
-  | undefined
-
-type UseSwapQuotingParams = {
-  apiClient: ApiClient
-  rates: TradeRate[] | undefined
-  sellAssetBalance: BalanceData
-}
-
-export const useSwapQuoting = ({ apiClient, rates, sellAssetBalance }: UseSwapQuotingParams) => {
-  const stateValue = SwapMachineCtx.useSelector(s => s.value)
-  const context = SwapMachineCtx.useSelector(s => s.context)
-  const actorRef = SwapMachineCtx.useActorRef()
-
-  const { walletAddress, effectiveReceiveAddress, bitcoin, solana } = useSwapWallet()
-  const bitcoinAddress = bitcoin.address
-  const solanaAddress = solana.address
-
-  const quotingRef = useRef(false)
-
-  useEffect(() => {
-    const snap = actorRef.getSnapshot()
-    if (!snap.matches('quoting') || quotingRef.current) return
-    quotingRef.current = true
-
-    const fetchQuote = async () => {
-      try {
-        if (sellAssetBalance?.balance && context.sellAmountBaseUnit) {
-          const balanceBigInt = BigInt(sellAssetBalance.balance)
-          const amountBigInt = BigInt(context.sellAmountBaseUnit)
-          if (amountBigInt > balanceBigInt) {
-            actorRef.send({ type: 'QUOTE_ERROR', error: 'Insufficient balance' })
-            return
-          }
-        }
-
-        const parsedSlippage = parseFloat(context.slippage)
-        if (isNaN(parsedSlippage) || parsedSlippage < 0) {
-          actorRef.send({ type: 'QUOTE_ERROR', error: 'Invalid slippage value' })
-          return
-        }
-        const slippageDecimal = (parsedSlippage / 100).toString()
-        const rateToUse = context.selectedRate ?? rates?.[0]
-        if (!rateToUse || !context.sellAmountBaseUnit) {
-          actorRef.send({ type: 'QUOTE_ERROR', error: 'No rate or amount available' })
-          return
-        }
-
-        const sendAddress = context.isSellAssetEvm
-          ? walletAddress
-          : context.isSellAssetUtxo
-          ? bitcoinAddress
-          : context.isSellAssetSolana
-          ? solanaAddress
-          : undefined
-
-        if (!sendAddress) {
-          actorRef.send({ type: 'QUOTE_ERROR', error: 'No wallet address available' })
-          return
-        }
-
-        const receiveAddr = effectiveReceiveAddress || sendAddress
-
-        if (!receiveAddr) {
-          actorRef.send({ type: 'QUOTE_ERROR', error: 'No receive address available' })
-          return
-        }
-
-        const response = await apiClient.getQuote({
-          sellAssetId: context.sellAsset.assetId,
-          buyAssetId: context.buyAsset.assetId,
-          sellAmountCryptoBaseUnit: context.sellAmountBaseUnit,
-          sendAddress,
-          receiveAddress: receiveAddr,
-          swapperName: rateToUse.swapperName,
-          slippageTolerancePercentageDecimal: slippageDecimal,
-        })
-
-        actorRef.send({ type: 'QUOTE_SUCCESS', quote: response })
-      } catch (error) {
-        const errorMessage = error instanceof Error ? error.message : 'Failed to get quote'
-        actorRef.send({ type: 'QUOTE_ERROR', error: errorMessage })
-      } finally {
-        quotingRef.current = false
-      }
-    }
-
-    fetchQuote()
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- stateValue is the sole trigger; other deps are stable refs read from snapshot
-  }, [stateValue])
-}

package/src/hooks/useSwapRates.ts

@@ -1,61 +0,0 @@
-import { bnOrZero } from '@shapeshiftoss/utils'
-import { useQuery } from '@tanstack/react-query'
-
-import type { ApiClient } from '../api/client'
-import type { AssetId, SwapperName, TradeRate } from '../types'
-
-export type UseSwapRatesParams = {
-  sellAssetId: AssetId | undefined
-  buyAssetId: AssetId | undefined
-  sellAmountCryptoBaseUnit: string | undefined
-  enabled?: boolean
-  allowedSwapperNames?: SwapperName[]
-  refetchInterval?: number
-}
-
-export const useSwapRates = (apiClient: ApiClient, params: UseSwapRatesParams) => {
-  const {
-    sellAssetId,
-    buyAssetId,
-    sellAmountCryptoBaseUnit,
-    enabled = true,
-    allowedSwapperNames,
-    refetchInterval = 15_000,
-  } = params
-
-  return useQuery({
-    queryKey: ['swapRates', sellAssetId, buyAssetId, sellAmountCryptoBaseUnit, allowedSwapperNames],
-    queryFn: async (): Promise<TradeRate[]> => {
-      if (!sellAssetId || !buyAssetId || !sellAmountCryptoBaseUnit) {
-        return []
-      }
-      const response = await apiClient.getRates({
-        sellAssetId,
-        buyAssetId,
-        sellAmountCryptoBaseUnit,
-      })
-
-      let filteredRates = response.rates.filter(
-        rate => !rate.error && rate.buyAmountCryptoBaseUnit !== '0',
-      )
-
-      if (allowedSwapperNames?.length) {
-        filteredRates = filteredRates.filter(rate => allowedSwapperNames.includes(rate.swapperName))
-      }
-
-      return filteredRates
-        .map((rate, index) => ({
-          ...rate,
-          id: rate.id ?? `${rate.swapperName}-${index}`,
-        }))
-        .sort((a, b) => {
-          const aAmount = bnOrZero(a.buyAmountCryptoBaseUnit)
-          const bAmount = bnOrZero(b.buyAmountCryptoBaseUnit)
-          return bAmount.minus(aAmount).toNumber()
-        })
-    },
-    enabled: enabled && !!sellAssetId && !!buyAssetId && !!sellAmountCryptoBaseUnit,
-    staleTime: 10_000,
-    refetchInterval,
-  })
-}

package/src/index.ts

@@ -1,43 +0,0 @@
-export { SwapWidget } from './components/SwapWidget'
-
-export type {
-  Asset,
-  AssetId,
-  ChainId,
-  Chain,
-  TradeRate,
-  TradeQuote,
-  SwapWidgetProps,
-  ThemeMode,
-  ThemeConfig,
-} from './types'
-
-export {
-  SwapperName,
-  isEvmChainId,
-  getEvmNetworkId,
-  getChainType,
-  formatAmount,
-  parseAmount,
-  truncateAddress,
-  EVM_CHAIN_IDS,
-  UTXO_CHAIN_IDS,
-  COSMOS_CHAIN_IDS,
-  OTHER_CHAIN_IDS,
-} from './types'
-
-export {
-  getBaseAsset,
-  getChainName,
-  getChainIcon,
-  getChainColor,
-  getExplorerTxLink,
-} from './constants/chains'
-
-export {
-  useAssets,
-  useAssetById,
-  useChains,
-  useAssetsByChainId,
-  useAssetSearch,
-} from './hooks/useAssets'

package/src/machines/SwapMachineContext.ts

@@ -1,5 +0,0 @@
-import { createActorContext } from '@xstate/react'
-
-import { swapMachine } from './swapMachine'
-
-export const SwapMachineCtx = createActorContext(swapMachine)

package/src/machines/__tests__/guards.test.ts

@@ -1,228 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-import type { QuoteResponse } from '../../types'
-import {
-  canRetry,
-  hasQuote,
-  hasReceiveAddress,
-  hasValidInput,
-  hasWallet,
-  isApprovalRequired,
-  isEvmChain,
-  isSolanaChain,
-  isUtxoChain,
-} from '../guards'
-import type { SwapMachineContext } from '../types'
-
-const createTestContext = (overrides?: Partial<SwapMachineContext>): SwapMachineContext => ({
-  sellAsset: {
-    assetId: 'eip155:1/slip44:60',
-    chainId: 'eip155:1',
-    symbol: 'ETH',
-    name: 'Ethereum',
-    precision: 18,
-  },
-  buyAsset: {
-    assetId: 'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
-    chainId: 'eip155:1',
-    symbol: 'USDC',
-    name: 'USD Coin',
-    precision: 6,
-  },
-  sellAmount: '1.0',
-  sellAmountBaseUnit: '1000000000000000000',
-  selectedRate: null,
-  quote: null,
-  txHash: null,
-  approvalTxHash: null,
-  error: null,
-  errorSource: null,
-  retryCount: 0,
-  chainType: 'evm',
-  slippage: '0.5',
-  walletAddress: '0x1234567890abcdef1234567890abcdef12345678',
-  effectiveReceiveAddress: '0xabcdefabcdefabcdefabcdefabcdefabcdefabcd',
-  isSellAssetEvm: true,
-  isSellAssetUtxo: false,
-  isSellAssetSolana: false,
-  isBuyAssetEvm: true,
-  ...overrides,
-})
-
-describe('guards', () => {
-  describe('hasValidInput', () => {
-    it('returns true when all required fields are present', () => {
-      expect(hasValidInput(createTestContext())).toBe(true)
-    })
-
-    it('returns false when sellAmountBaseUnit is undefined', () => {
-      expect(hasValidInput(createTestContext({ sellAmountBaseUnit: undefined }))).toBe(false)
-    })
-
-    it('returns false when sellAmountBaseUnit is "0"', () => {
-      expect(hasValidInput(createTestContext({ sellAmountBaseUnit: '0' }))).toBe(false)
-    })
-
-    it('returns false when sellAmountBaseUnit is empty string', () => {
-      expect(hasValidInput(createTestContext({ sellAmountBaseUnit: '' }))).toBe(false)
-    })
-  })
-
-  describe('hasQuote', () => {
-    it('returns false when quote is null', () => {
-      expect(hasQuote(createTestContext())).toBe(false)
-    })
-
-    it('returns true when quote is present', () => {
-      expect(hasQuote(createTestContext({ quote: {} as QuoteResponse }))).toBe(true)
-    })
-
-    it('returns true when quote has approval data', () => {
-      expect(
-        hasQuote(
-          createTestContext({
-            quote: { approval: { isRequired: true, spender: '0xSpender' } } as QuoteResponse,
-          }),
-        ),
-      ).toBe(true)
-    })
-  })
-
-  describe('isApprovalRequired', () => {
-    it('returns false when quote is null', () => {
-      expect(isApprovalRequired(createTestContext())).toBe(false)
-    })
-
-    it('returns false when approval is not required', () => {
-      expect(
-        isApprovalRequired(
-          createTestContext({
-            quote: { approval: { isRequired: false, spender: '0xSpender' } } as QuoteResponse,
-          }),
-        ),
-      ).toBe(false)
-    })
-
-    it('returns true when approval is required for ERC20 on EVM chain', () => {
-      expect(
-        isApprovalRequired(
-          createTestContext({
-            sellAsset: {
-              assetId: 'eip155:1/erc20:0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
-              chainId: 'eip155:1',
-              symbol: 'USDC',
-              name: 'USD Coin',
-              precision: 6,
-            },
-            chainType: 'evm',
-            quote: { approval: { isRequired: true, spender: '0xSpender' } } as QuoteResponse,
-          }),
-        ),
-      ).toBe(true)
-    })
-
-    it('returns false when approval is required but sell asset is native (slip44)', () => {
-      expect(
-        isApprovalRequired(
-          createTestContext({
-            chainType: 'evm',
-            quote: { approval: { isRequired: true, spender: '0xSpender' } } as QuoteResponse,
-          }),
-        ),
-      ).toBe(false)
-    })
-
-    it('returns false when approval is required but chain is not EVM', () => {
-      expect(
-        isApprovalRequired(
-          createTestContext({
-            chainType: 'utxo',
-            quote: { approval: { isRequired: true, spender: '0xSpender' } } as QuoteResponse,
-          }),
-        ),
-      ).toBe(false)
-    })
-
-    it('returns false when quote has no approval field', () => {
-      expect(
-        isApprovalRequired(
-          createTestContext({
-            quote: {} as QuoteResponse,
-          }),
-        ),
-      ).toBe(false)
-    })
-  })
-
-  describe('canRetry', () => {
-    it('returns true when retryCount is 0', () => {
-      expect(canRetry(createTestContext({ retryCount: 0 }))).toBe(true)
-    })
-
-    it('returns true when retryCount is 2', () => {
-      expect(canRetry(createTestContext({ retryCount: 2 }))).toBe(true)
-    })
-
-    it('returns false when retryCount is 3', () => {
-      expect(canRetry(createTestContext({ retryCount: 3 }))).toBe(false)
-    })
-
-    it('returns false when retryCount is greater than 3', () => {
-      expect(canRetry(createTestContext({ retryCount: 5 }))).toBe(false)
-    })
-  })
-
-  describe('isEvmChain', () => {
-    it('returns true for evm chain', () => {
-      expect(isEvmChain(createTestContext({ chainType: 'evm' }))).toBe(true)
-    })
-
-    it('returns false for utxo chain', () => {
-      expect(isEvmChain(createTestContext({ chainType: 'utxo' }))).toBe(false)
-    })
-  })
-
-  describe('isUtxoChain', () => {
-    it('returns true for utxo chain', () => {
-      expect(isUtxoChain(createTestContext({ chainType: 'utxo' }))).toBe(true)
-    })
-
-    it('returns false for evm chain', () => {
-      expect(isUtxoChain(createTestContext({ chainType: 'evm' }))).toBe(false)
-    })
-  })
-
-  describe('isSolanaChain', () => {
-    it('returns true for solana chain', () => {
-      expect(isSolanaChain(createTestContext({ chainType: 'solana' }))).toBe(true)
-    })
-
-    it('returns false for evm chain', () => {
-      expect(isSolanaChain(createTestContext({ chainType: 'evm' }))).toBe(false)
-    })
-  })
-
-  describe('hasWallet', () => {
-    it('returns true when walletAddress is set', () => {
-      expect(hasWallet(createTestContext())).toBe(true)
-    })
-
-    it('returns false when walletAddress is undefined', () => {
-      expect(hasWallet(createTestContext({ walletAddress: undefined }))).toBe(false)
-    })
-
-    it('returns false when walletAddress is empty string', () => {
-      expect(hasWallet(createTestContext({ walletAddress: '' }))).toBe(false)
-    })
-  })
-
-  describe('hasReceiveAddress', () => {
-    it('returns true when effectiveReceiveAddress is set', () => {
-      expect(hasReceiveAddress(createTestContext())).toBe(true)
-    })
-
-    it('returns false when effectiveReceiveAddress is empty', () => {
-      expect(hasReceiveAddress(createTestContext({ effectiveReceiveAddress: '' }))).toBe(false)
-    })
-  })
-})

package/src/machines/__tests__/setup.test.ts

@@ -1,7 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-describe('test infrastructure', () => {
-  it('should work', () => {
-    expect(true).toBe(true)
-  })
-})