thirdwebDocs
GitHub

useBuyWithFiatQuote

Hook to get a price quote for performing a "Buy with Fiat" transaction that allows users to buy a token with fiat currency.

The price quote is an object of type BuyWithFiatQuote . This quote contains the information about the purchase such as token amounts, processing fees, estimated time etc.

This hook is a React Query wrapper of the getBuyWithFiatQuote function. You can also use that function directly

Once you have the quote , you can open a new window with quote.onRampLink to allow the user to buy the token with fiat currency. and useBuyWithFiatStatus function to start polling for the status of this transaction.

Example

import { NATIVE_TOKEN_ADDRESS } from "thirdweb";
import { base } from "thirdweb/chains";
import { useBuyWithFiatQuote } from "thirdweb/react";
 
// get a quote for buying 0.01 base native token with USD fiat currency
function Example() {
  const quote = useBuyWithFiatQuote({
    client: client, // thirdweb client
    fromCurrencySymbol: "USD", // fiat currency symbol
    toChainId: base.id, // base chain id
    toAmount: "0.01", // amount of token to buy
    toTokenAddress: NATIVE_TOKEN_ADDRESS, // native token
    toAddress: "0x...", // user's wallet address
  });
 
  return (
    <div>
      {quote.data && (
        <a href={quote.data.onRampLink} target="_blank">
          open onramp provider
        </a>
      )}
    </div>
  );
}
function useBuyWithFiatQuote(
  queryOptions?: BuyWithFiatQuoteQueryOptions,
): UseQueryResult<BuyWithFiatQuote>;

Parameters

object of type GetBuyWithFiatQuoteParams

Type

let params: {
  client: ThirdwebClient;
  fromAddress: string;
  fromAmount?: string;
  fromCurrencySymbol: "USD" | "CAD" | "GBP" | "EUR" | "JPY";
  isTestMode?: boolean;
  maxSlippageBPS?: number;
  preferredProvider?: FiatProvider;
  purchaseData?: object;
  toAddress: string;
  toAmount?: string;
  toChainId: number;
  toGasAmountWei?: string;
  toTokenAddress: string;
};

Type

let queryOptions: BuyWithFiatQuoteQueryOptions;

Returns

let returnType: UseQueryResult<BuyWithFiatQuote>;

A React Query object which contains the data of type BuyWithFiatQuote