Funding Options

Learn how to show and hide the funding options UI in your React Native application.

Recommended: JavaScript SDK for React Native

While this SDK is still supported, we recommend using newer JavaScript SDK, which is optimized for React Native, but also comes with a host of other benefits.

The Dynamic SDK provides methods to show and hide a funding options UI that allows users to add funds to their wallets.

Show Funding Options

client.ui.fundingOptions.show()

Shows the funding options UI overlay where users can select different methods to fund their wallet.

Hide Funding Options

client.ui.fundingOptions.hide()

Dismisses the funding options UI overlay if it’s currently visible.

Usage Example

Here’s a basic example of how to implement funding options in your React Native application:

import { useReactiveClient } from '@dynamic-labs/react-hooks';
import { dynamicClient } from './path-to-your-client'; // Replace with your actual client path

export const useDynamicClient = () => useReactiveClient(dynamicClient);

const FundingComponent = () => {
  const client = useDynamicClient()

  const handleShowFunding = () => {
    client.ui.fundingOptions.show()
  }

  const handleHideFunding = () => {
    client.ui.fundingOptions.hide()
  }

  return (
    <>
      <Button onPress={handleShowFunding} title="Add Funds" />
      <Button onPress={handleHideFunding} title="Close Funding Options" />
    </>
  )
}