react-native-apxor-rtm-plugin

Description

React Native wrapper for Apxor RTM Plugin which includes support for deep linking.

Getting started

First integrate react-native-apxor-sdk from here.

For React Native version 0.59.0 and lower

Run the following command

$ npm install react-native-apxor-rtm-plugin --save

$ react-native link react-native-apxor-rtm-plugin

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

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

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

For React Native version 0.60.0 and higher

Run the following command

$ yarn add react-native-apxor-rtm-plugin

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

  compile project(':react-native-apxor-rtm-plugin')

  // Ignore this dependency, if you have already added this when integrating `react-native-apxor-sdk`
  implementation 'com.apxor.androidx:apxor-android-sdk-qe:1.5.0@aar'

  implementation 'com.apxor.androidx:apxor-android-sdk-rtm:1.8.7@aar'

1. Create plugins.json file at android/app/src/main/assets/ folder. If you already done this step, please ignore

2. Add the following JSON in that file

   {
     "plugins": [
       {
         "name": "rtm",
         "class": "com.apxor.androidsdk.plugins.realtimeui.ApxorRealtimeUIPlugin"
       }
       // Other Apxor plugins
     ]
   }

Configuring View IDs for Views

Apxor RTM plugin will show Inline messages (also called as Tooltips) and CoachMark messages for a given View ID/Tag. In React Native apps, you can mention View IDs for views.

For example, you want to show tooltip for a button. You can't directly give a unique id for Button. Instead, you need to wrap it up with a View tag like:

<View nativeID="loginButton">
    <Button onPress={this.handlePress}>Login</Button>
</View>

So, the same value for nativeID attribute can be configured in Apxor dashboard to identify the Button at Runtime.