react-native-apxor-sdk

react-native-apxor-sdk

Description

React Native wrapper for Apxor SDK. Please refer Plugins section to integrate other Apxor plugins.

Getting started

$ npm install react-native-apxor-sdk --save

$ react-native link react-native-apxor-sdk

Manual installation

Android

1. Open up android/app/src/main/java/[...]/MainActivity.java

   • Add import com.apxor.reactnativesdk.RNApxorSDKPackage; to the imports at the top of the file
   • Add new RNApxorSDKPackage() to the list returned by the getPackages() method

   @Override
   protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
               new MainReactPackage(),
               ...
               new RNApxorSDKPackage(), <- ApxorSDK package
               ...
       );
   }
   

2. Append the following lines to android/settings.gradle:

   include ':react-native-apxor-sdk'
   project(':react-native-apxor-sdk').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-apxor-sdk/android')
   

Additional steps todo

1. Insert the following lines inside repositories block in android/build.gradle

     maven { url "http://repo.apxor.com/artifactory/list/libs-release-android/" }
   

2. Insert the following lines inside the dependencies block in android/app/build.gradle:

     compile project(':react-native-apxor-sdk')
     implementation 'com.apxor.android:apxor-android-sdk-core:2.5.1@aar'
   

3. Insert the following lines in the onCreate method in android/app/src/main/java/(package)/MainApplication.java:

   ApxorSDK.initialize("<APP_ID>", MainApplication.this);
   

   Note:

   • The second argument, MainApplication.this, makes sures to provide ApplicationContext instead of ReactApplicationContext for ApxorSDK to work properly.
   • If you change the application class name (default: MainApplication), make sure to use your_class_name.this instead.

Plugins (Optional)

1. Add following dependencies in build.gradle file

   // firebase-messaging version >= 11.4.0 needed for push plugin
   implementation ('com.apxor.android:apxor-android-sdk-push:1.2.1@aar') { // Tracks Uninstalls also
       exclude group: 'com.google.firebase'
   }
   
   implementation 'com.apxor.android:apxor-android-sdk-qe:1.2.6@aar'
   implementation 'com.apxor.android:surveys:1.1.7@aar'
   

2. Create plugins.json file at android/app/src/main/assets/ folder

3. Paste the following JSON in that file

   {
     "plugins": [
       {
         "name": "push",
         "class": "com.apxor.androidsdk.plugins.push.PushPlugin"
       },
       {
         "name": "surveys",
         "class": "com.apxor.androidsdk.plugins.survey.SurveyPlugin"
       }
     ]
   }
   

4. If you have extended the FirebaseMessagingService in your application, please use below code in your extends FirebaseMessagingService class to receive Push notifications sent from Apxor dashboard

   if (remoteMessage.getFrom().equals(YOUR_FCM_SENDER_ID)) {
       // Your logic goes here
   } else {
       if (ApxorPushAPI.isApxorNotification(remoteMessage)) {
           ApxorPushAPI.handleNotification(remoteMessage, getApplicationContext());
       } else {
           // Silent or Data push notification which you can send through Apxor dashboard
       }
   }
   

Usage

import RNApxorSDK from 'react-native-apxor-sdk';

UserId:

// Syntax
RNApxorSDK.setUserIdentifier("user_id");

// Example
RNApxorSDK.setUserIdentifier("<some_user_id>");

Events:

// Syntax
RNApxorSDK.logAppEvent(event_name, properties);

// Example
RNApxorSDK.logAppEvent("ADD_TO_CART", {
    "userId": "[e-mail]",
    "value": "1299",
    "item": "Sony Head Phone 1201" 
});

User Properties:

// Syntax
RNApxorSDK.setUserCustomInfo(properties);

// Example
RNApxorSDK.setUserCustomInfo({
    "property1": "value",
    "property2": "value2"
});

Track Navigation:

######If you are already using react-navigation, Apxor SDK automatically tracks screen navigation if you add below statement in your Root component:

const appNavigator = createStackNavigator({ /* your navigation config*/});

const App = createAppContainer(appNavigator);

// This will return a HOC which will take care of automatic screen tracking
const Root = RNApxorSDK.wrapApplication(App); 

// This will supplied to AppRegistry
export default Root; 

######Otherwise:

// Syntax
RNApxorSDK.logNavigationEvent(screen_name);

// Example
RNApxorSDK.logNavigationEvent("LoginScreen");