End-to-end Transaction Example

Want to go beyond swaps and bridges? With Composer, you can deposit into vaults, stake, and lend — all in a single transaction using the same API pattern shown below. See the Composer Quickstart.

Step by step

Requesting a quote or routes

import axios from 'axios';

const getQuote = async (
  fromChain: number,
  toChain: number,
  fromToken: string,
  toToken: string,
  fromAmount: string,
  fromAddress: string,
) => {
  const result = await axios.get('https://li.quest/v1/quote', {
    params: {
      fromChain,
      toChain,
      fromToken,
      toToken,
      fromAmount,
      fromAddress,
    },
  });
  return result.data;
};

const fromChain = 42161; // Arbitrum
const fromToken = 'USDC';
const toChain = 100; // Gnosis
const toToken = 'USDC';
const fromAmount = '1000000';
const fromAddress = '0xYOUR_WALLET_ADDRESS';

const quote = await getQuote(fromChain, toChain, fromToken, toToken, fromAmount, fromAddress);

Choose the desired route if `/advanced/routes` was used and retrieve transaction data from `/advanced/stepTransaction`

This step is only needed if /advanced/routes endpoint was used. /quote already returns the transaction data within the response. Difference between /quote and /advanced/routes is described here

Setting the allowance

Before any transaction can be sent, it must be made sure that the user is allowed to send the requested amount from the wallet. This example uses the classic approve() approach. To reduce approval transactions using off-chain EIP-712 signatures, see the Permit & Permit2 Approval Flow.

import { erc20Abi, zeroAddress, type Address } from 'viem';
import type { PublicClient, WalletClient } from 'viem';

// Get the current allowance and update it if needed
const checkAndSetAllowance = async (
  publicClient: PublicClient,
  walletClient: WalletClient,
  tokenAddress: Address,
  approvalAddress: Address,
  amount: bigint,
) => {
  // Transactions with the native token don't need approval
  if (tokenAddress === zeroAddress) {
    return;
  }

  const [account] = await walletClient.getAddresses();
  const allowance = await publicClient.readContract({
    address: tokenAddress,
    abi: erc20Abi,
    functionName: 'allowance',
    args: [account, approvalAddress],
  });

  if (allowance < amount) {
    const hash = await walletClient.writeContract({
      address: tokenAddress,
      abi: erc20Abi,
      functionName: 'approve',
      args: [approvalAddress, amount],
      account,
      chain: walletClient.chain,
    });
    await publicClient.waitForTransactionReceipt({ hash });
  }
};

await checkAndSetAllowance(
  publicClient,
  walletClient,
  quote.action.fromToken.address as Address,
  quote.estimate.approvalAddress as Address,
  BigInt(fromAmount),
);

Sending the transaction

After receiving a quote, the transaction has to be sent to trigger the transfer.Firstly, the wallet has to be configured. The transaction executes on the source chain, so the following example connects your wallet to Arbitrum:

import { createPublicClient, createWalletClient, http } from 'viem';
import { mnemonicToAccount } from 'viem/accounts';
import { arbitrum } from 'viem/chains';

const account = mnemonicToAccount('YOUR_PERSONAL_MNEMONIC');
const publicClient = createPublicClient({ chain: arbitrum, transport: http() });
const walletClient = createWalletClient({ account, chain: arbitrum, transport: http() });

Afterward, the transaction can be sent using the transactionRequest inside the previously retrieved quote:

import type { Address, Hex } from 'viem';

const hash = await walletClient.sendTransaction({
  to: quote.transactionRequest.to as Address,
  data: quote.transactionRequest.data as Hex,
  value: BigInt(quote.transactionRequest.value),
  gas: BigInt(quote.transactionRequest.gasLimit),
  gasPrice: BigInt(quote.transactionRequest.gasPrice),
});
await publicClient.waitForTransactionReceipt({ hash });

Executing second step if applicable

If two-step route was used, the second step has to be executed after the first step is complete. Fetch the status of the first step like described in next step and then request transactionData from the /advanced/stepTransaction endpoint.

Fetching the transfer status

To check if the token was successfully sent to the receiving chain, the /status endpoint can be called:

const getStatus = async (
  bridge: string,
  fromChain: number,
  toChain: number,
  txHash: string,
) => {
  const result = await axios.get('https://li.quest/v1/status', {
    params: {
      bridge,
      fromChain,
      toChain,
      txHash,
    },
  });
  return result.data;
};

const result = await getStatus(quote.tool, fromChain, toChain, hash);

Full example

import axios from 'axios';
import {
  createPublicClient,
  createWalletClient,
  erc20Abi,
  http,
  zeroAddress,
  type Address,
  type Hex,
} from 'viem';
import { mnemonicToAccount } from 'viem/accounts';
import { arbitrum } from 'viem/chains';

const API_URL = 'https://li.quest/v1';

// Get a quote for your desired transfer
const getQuote = async (
  fromChain: number,
  toChain: number,
  fromToken: string,
  toToken: string,
  fromAmount: string,
  fromAddress: string,
) => {
  const result = await axios.get(`${API_URL}/quote`, {
    params: {
      fromChain,
      toChain,
      fromToken,
      toToken,
      fromAmount,
      fromAddress,
    },
  });
  return result.data;
};

// Check the status of your transfer
const getStatus = async (
  bridge: string,
  fromChain: number,
  toChain: number,
  txHash: string,
) => {
  const result = await axios.get(`${API_URL}/status`, {
    params: {
      bridge,
      fromChain,
      toChain,
      txHash,
    },
  });
  return result.data;
};

const fromChain: number = 42161; // Arbitrum
const fromToken = 'USDC';
const toChain: number = 100; // Gnosis
const toToken = 'USDC';
const fromAmount = '1000000';

// Set up your wallet on the source chain
const account = mnemonicToAccount('YOUR_PERSONAL_MNEMONIC');
const publicClient = createPublicClient({ chain: arbitrum, transport: http() });
const walletClient = createWalletClient({ account, chain: arbitrum, transport: http() });

// Get the current allowance and update it if needed
const checkAndSetAllowance = async (
  tokenAddress: Address,
  approvalAddress: Address,
  amount: bigint,
) => {
  // Transactions with the native token don't need approval
  if (tokenAddress === zeroAddress) {
    return;
  }

  const allowance = await publicClient.readContract({
    address: tokenAddress,
    abi: erc20Abi,
    functionName: 'allowance',
    args: [account.address, approvalAddress],
  });

  if (allowance < amount) {
    const approveHash = await walletClient.writeContract({
      address: tokenAddress,
      abi: erc20Abi,
      functionName: 'approve',
      args: [approvalAddress, amount],
    });
    await publicClient.waitForTransactionReceipt({ hash: approveHash });
  }
};

const run = async () => {
  const quote = await getQuote(
    fromChain,
    toChain,
    fromToken,
    toToken,
    fromAmount,
    account.address,
  );

  await checkAndSetAllowance(
    quote.action.fromToken.address as Address,
    quote.estimate.approvalAddress as Address,
    BigInt(fromAmount),
  );

  const hash = await walletClient.sendTransaction({
    to: quote.transactionRequest.to as Address,
    data: quote.transactionRequest.data as Hex,
    value: BigInt(quote.transactionRequest.value),
    gas: BigInt(quote.transactionRequest.gasLimit),
    gasPrice: BigInt(quote.transactionRequest.gasPrice),
  });

  await publicClient.waitForTransactionReceipt({ hash });

  // Only needed for cross chain transfers
  if (fromChain !== toChain) {
    let result;
    do {
      result = await getStatus(quote.tool, fromChain, toChain, hash);

      if (result.status !== 'DONE' && result.status !== 'FAILED') {
        await new Promise((resolve) => setTimeout(resolve, 5000)); // Wait 5s
      }
    } while (result.status !== 'DONE' && result.status !== 'FAILED');
  }
};

run().then(() => {
  console.log('DONE!');
});

Learn About LI.FI

Supported Systems

LI.FI Architecture

User Flows and Examples

Learn More

Changelog

End-to-end Transaction Example

Step by step

Full example

​Step by step

​Full example

Step by step

Full example