Rn-braintree-one NPM

rn-braintree-one

This package provides latest iOS(v4) and Android(v3) Braintree SDK support for React Native.

Installation

npm install rn-braintree-one --save

Linking

RN >= 60 Will be linked automatically.

RN < 60 Please refer manual linking docs.

iOS

Open Podfile and add following line below platform :ios, '9.0'
```
use_modular_headers!
```
Update
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
to
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec', :modular_headers => false
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec', :modular_headers => false
And remove the following
add_flipper_pods!
post_install do |installer|
flipper_post_install(installer)
end
Remove the following lines from AppDelegate.m #if DEBUG
#import <FlipperKit/FlipperClient.h>
#import <FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h>
#import <FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h>
#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>
#import <SKIOSNetworkPlugin/SKIOSNetworkAdapter.h>
#import <FlipperKitReactPlugin/FlipperKitReactPlugin.h>
static void InitializeFlipper(UIApplication *application) {
FlipperClient *client = [FlipperClient sharedClient];
SKDescriptorMapper *layoutDescriptorMapper = [[SKDescriptorMapper alloc] initWithDefaults];
[client addPlugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:application withDescriptorMapper:layoutDescriptorMapper]];
[client addPlugin:[[FKUserDefaultsPlugin alloc] initWithSuiteName:nil]];
[client addPlugin:[FlipperKitReactPlugin new]];
[client addPlugin:[[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];
[client start];
}
#endif
and
#if DEBUG
InitializeFlipper(application);
#endif
This package uses Swift for which you need to add Swift file to your Xcode project.
- Open your project in Xcode.
- File → New → File… (or CMD+N)
- Select Swift File
- Name your file 'Swift' File.
- In the Group dropdown, make sure to select the group 'Your App Name', not the project itself.
- After you create the Swift file, you should be prompted to choose if you want to configure an Objective-C Bridging Header. Select “Create Bridging Header”.
- This file is usually named YourProject-Bridging-Header.h. Don’t change this name manually, because Xcode configures the project with this exact filename.
- Clean and Rebuild Project
Android
Update the minSdkVersion to atleast 21 in the app/build.gradle file

In project build.gradle
Update

 dependencies {
     classpath("com.android.tools.build:gradle:3.5.4")  
     ...  
 }

And

 allprojects {  
 repositories {  
    mavenLocal()  
    maven {
       url "https://cardinalcommerceprod.jfrog.io/artifactory/android"
        credentials {
          username 'braintree_team_sdk'
          password 'AKCp8jQcoDy2hxSWhDAUQKXLDPDx6NYRkqrgFLRc3qDrayg6rrCbJpsKKyMwaykVL8FWusJpp'
        }  
    }
   ...  
}

Post Install

Run

    npm install  
    cd ios  
    pod install

If not successful, refer Braintree docs

Usage

import RnBraintree from "rn-braintree-one";

// Initialize package
  RnBraintree.setup('your client Token')
  .then((res) => {
    console.log('Success in setup', res)
  })
  .catch((err) => {
    console.log('Error in setup', err)
  });

// Show Payment Screen (Android & iOS)

  RnBraintree.paymentRequest({
  bgColor: '#FF0000',
  tintColor: '#0000FF',
  amount: '20'
  })
  .then((res) => {
    console.log('Success in onPaymentPress', res)
  })
  .catch((err) => {
    console.log('Error in onPaymentPress', err)
  });
 
 // Card Tokenization
  RnBraintree.getCardNonce({
  cardholderName: 'Test User',
  number: '4111111111111111',
  expirationDate: '10/2020', // or "10/2020" or any valid date
  cvv: '400',
  shouldValidateCard : true // optional : Braintree checks for card validity if true
  })
  .then((res) => {
    console.log('Success in onCardPress', res)
  })
  .catch((err) => {
    console.log('Error in onCardPress', err)
  });

Why was this package created?

This package was created due to unavailability of a reliable Braintree package for latest Android and iOS SDK's. Google Play Store rejected our Android app for using old Braintree SDK version (2). If you also face this issue (Your app(s) are using an unsafe implementation of the HostnameVerifier interface), you can use this package.

Please let us know of your comments and feedback.