react-native-onramp v0.1.4

react-native-onramp

This is the React-Native SDK for Onramp payment gateway.

General Requirements

The minimum requirements for the SDK are:

• iOS 12.0 and higher
• Android minSdkVersion 21
• Android compileSdkVersion 33

Installation

Installation with yarn

yarn add react-native-onramp

iOS Extra Steps after installing

After the installation is complete, for iOS run:

npx pod-install

or

cd ios
pod install

To allow your application to support UPI intent in iOS, add the following code to enable UPI intents to the LSApplicationQueriesSchemes in the Info.plist file of your project.

    <key>LSApplicationQueriesSchemes</key>
    <array>
        <string>paytmmp</string>
        <string>gpay</string>
        <string>bhim</string>
        <string>upi</string>
        <string>phonepe</string>
    </array>

Usage

Initialize the SDK

Add the following imports

import {startOnrampSDK, onRampSDKNativeEvent} from 'react-native-onramp';

Initialize the SDK by calling the startOnrampSDK function and pass the basic config parametes to start the sdk.

   startOnrampSDK({
       appId: 1, // replace this with the appID you got during onboarding
       walletAddress: '0x49...436B', // replace with user's wallet address
       flowtype: 1 // 1 -> onramp || 2 -> offramp || 3 -> Merchant checkout
       fiatType: 1 // 1 -> INR || 2 -> TRY
       paymentMethod: 1 // 1 -> Instant transafer(UPI) || 2 -> Bank transfer(IMPS/FAST)
       // ... pass other configs here
   });

Listening to SDK Events

Add onRampSDKNativeEvent listener in your component where you've initialized the sdk.

 React.useEffect(() => {
   const onRampEventListener = onRampSDKNativeEvent.addListener(
     'widgetEvents',
     eventData => {
       // handle all the events here
       console.log('Received onRampEvent:', eventData);
     },
   );

   return () => {
     onRampEventListener.remove();
   };
 }, []);

Events Docs

Here is the list of all events:

• ONRAMP_WIDGET_READY -> sent when widget is ready for user interaction
• ONRAMP_WIDGET_FAILED -> sent when widget render failed due to multiple reasons like wrong params combination or missing params etc.

• ONRAMP_WIDGET_CONTENT_COPIED -> sent when copy to clipboard event is performed in widget, sends along the content copied.

• ONRAMP_WIDGET_APP_CLOSED -> sent when user request closes the widget and cancels the transaction.

• ONRAMP_WIDGET_TX_INIT -> when user sees the payment details on screen

• ONRAMP_WIDGET_TX_FINDING -> when user submits the reference number for INR deposit
• ONRAMP_WIDGET_TX_PURCHASING -> when system finds the deposit against reference / UTR submitted by user
• ONRAMP_WIDGET_TX_SENDING -> when system is done purchasing the crypto & starts withdrawal
• ONRAMP_WIDGET_TX_COMPLETED -> when system gets the tx hash for the deposit
• ONRAMP_WIDGET_TX_SENDING_FAILED -> if Failed before getting the tx hash
• ONRAMP_WIDGET_TX_PURCHASING_FAILED -> if failed while making the crypto purchase
• ONRAMP_WIDGET_TX_FINDING_FAILED -> if system failed at finding the deposit against the reference / UTR

License

MIT

Made with create-react-native-library