Integration

React Native is a cross-platform that lets you create android and iOS apps from a single code base by using a modern, and reactive framework. These apps are built using Dart, a simple object-oriented programming language. The basic idea of React Native revolves around widgets. React Native entails its own ready-made widgets which appear native either to Android (Material Design) or iOS apps (Cupertino). Also, you can create customized widgets.

A comprehensive guide to integrating your apps with InviteReferrals. The new React Native Plugin helps you to run a referral campaign in InviteReferrals. Read this guide to know the basic integration of the referral campaign, how to track the events, how to show a welcome message, and other important information via FAQs.
Read this guide to integrate your apps with InviteReferrals Android SDK.

Add InviteReferrals Library to your Project

npm install react-native-invitereferrals

Link library to Project

react-native link react-native-invitereferrals

For IOS Manual Linking

React Native 0.59.0 Older & Not Using Cocoapods.
If you are not using Cocoapods & react-native link react-native-invitereferrals does not work.
Then you have to manually link the library
A. Open node_modules/react-native-invitereferrals/ios
B. Drag and drop RNInvitereferrals.xcodeproj into XCode project folder Libraries

Cocoapods Install (IOS Only)

React Native 0.60.0 or higher & Using Cocoapods.
Run this command from a terminal

cd ios && pod install && cd ..

Initialize Sdk (Platform Specific)

ANDROID

A. Configure your AndroidManifest.xml

<manifest….>        
   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.WAKE_LOCK" />
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
   <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
   <uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
   <uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
   <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
   <uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
      <application>         
       <meta-data           
           android:name="invitereferrals_bid"
           android:value="10xxx" />
       <meta-data
           android:name="invitereferrals_bid_e"
           android:value="C2C3xxxxxxxxxxxxxxxxxx" />
       </application>
    </manifest>

📘

In the above example, Dummy Brand ID and Encryption keys shown. Kindly login your IR_account to see your credentials.

If you want to use contact_sync feature, then add the following permissions into your
manifest.xml file under manifest tag.

<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />

B. MainApplication class initialization

Imported this statement

import com.rn_invitereferrals.InvitereferralsModule;

Call this function method in onCreate() function.

InvitereferralsModule.register(this);

Example

@Override
  public void onCreate() {
  super.onCreate();
  Log.e("MainApplication","onCreate");
  InvitereferralsModule.register(this);
  SoLoader.init(this, /* native exopackage */ false);
}

IOS

A. Configure info.plist file

• Goto Your_ProjectFolder >> ios and open Your_ProjectName.xcworkspace file into Xcode.

<key>NSAppTransportSecurity</key>
       <dict>
           <key>NSAllowsArbitraryLoads</key>
           <true/>
           <key>NSExceptionDomains</key>
           <dict/>
       </dict>
       <key>CFBundleURLTypes</key>
       <array>
           <dict>
               <key>CFBundleURLName</key>
               <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
               <key>CFBundleURLSchemes</key>
               <array>
                   <string>youUrlSchemeComesHere</string>
               </array>
           </dict>
       </array>
       <key>LSApplicationQueriesSchemes</key>
       <array>
           <string>whatsapp</string>
           <string>fb</string>
           <string>twitter</string>
       </array>

• Goto info.plist of your project. Open info.plist file as source code (right click on info.plist and click on Open as >> Source code) and add the following code in it.

  OR

  1.1. You can simply open the info.plist and add the keys which works as the same as above for this.
  Add a new row by going to the menu and clicking Editor > Add Item. Setup a NSAppTransportSecurity as a Dictionary.

  1.2. Added a Subkey called NSAllowsArbitraryLoads as Boolean and set its value to YES as in the following image.

1.3. Add a new row again and set up a URL Types item by adding a new item. Expand the URL Types key, expand Item 0, and add a new item, URL schemes. Fill in “appScheme” for Item 0 of URL schemes and your company identifier for the URL Identifier. Your file should resemble the image below when done.

1.4. Add a new row again and set up a LSApplicationQueriesSchemes as an Array. Fill in “whatsapp” for Item 0 , “fb” for item 1 and “twitter” for item 2 as like following image.

B. App Delegate initialization

Import Invitereferrals header file. Just after defaults import statements.

#import "RNInvitereferrals.h"

Initialize the sdk in didFinishLaunchingWithOptions function.

[RNInvitereferrals setupWithBrandId: BRANDID encryptedKey: @"ENCRYTEDKEY"];

Example:

-(BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions {
[RNInvitereferrals setupWithBrandId: 27XXX encryptedKey: @"685B3E09241XXXXXXXXXXXXXXXXXXXXXX"];
}

📘

Note :

In the above example, Dummy Brand ID and Encryption keys shown. Kindly login your IR_account to see your credentials.

Import invitereferrals package

Now in your React code, you can import the invitereferrals package

import invitereferrals from 'react-native-invitereferrals';