Only available from SDK V1

​
Summary

This hook can be used to trigger an Onramp UI so that users can immediately buy crypto with fiat.

​
How it works

After setting up your onramp provider, you can use the useFunding to prompt your user to fund their wallet.

UseFunding exposes the following attributes:

MethodTypeDescription
enabledbooleanWeather funding is enable and ready to use
openExternalFundingfunctionTrigger the onramp UI with required onrampProvider attribute and optional address and token attributes, returns a Promise that will resolve once the onramp UI is closed
connectWalletForFundingfunctionTrigger connecting a wallet in order to fund your primary wallet
fundWithExternalWalletfunctionTriggers a transaction to your primary wallet from a connected wallet given fromWallet and amount

​
Examples

Example on funding your primary wallet from an external wallet

import { useFunding } from "@dynamic-labs/sdk-react-core";

const FundFromExternalWalletButton = () => {
  const [transactionId, setTransactionId] = useState<string>();
  const { connectWalletForFunding, fundWithExternalWallet } = useFunding();

  const onSubmit: FormEventHandler<HTMLFormElement> = async (event) => {
    event.preventDefault();

    const formData = new FormData(event.currentTarget);

    const amount = formData.get("amount") as string;

    if (!amount) return;

    const externalWallet = await connectWalletForFunding();

    const transactionId = await fundWithExternalWallet({ amount: Number(amount), fromWallet: externalWallet });

    setTransactionId(transactionId);
  }

  return (
      <form onSubmit={onSubmit}>
        <label htmlFor="amount">Amount:</label>
        <input
          id="amount"
          name="amount"
          type="string"
          required
        />

        <button type="submit">Fund from External Wallet</button>
      </form>

      {transactionId && (
        <p>Transaction ID: {transactionId}</p>
      )}
    </>
  )
}

Example on a custom onramp button.

import { useFunding } from "@dynamic-labs/sdk-react-core";
import { OnrampProviders } from '@dynamic-labs/sdk-api-core';

const FundMyWalletButton = () => {
  const { enabled, openExternalFunding } = useFunding();

  const onClick = () => {
    openExternalFunding({
      onrampProvider: OnrampProviders.Banxa,
      token: "USDT",
      address: "0x1234567890123456789012345678901234567890",
    }).then(() => window.alert("Success!"));
  };

  return (
    <button onClick={onClick} disabled={!enabled}>
      Buy USDT
    </button>
  );
};