The Connecthings React Native plugin allows you to access to the GDPR methods and In-App actions methods from the js code.

Nevertheless, the configuration of the SDK must still must done at the ios and android app level.

A react-native demo application is available on github to shows you a concrete implementation.

You just have to clone the https://github.com/Connecthings/react-app-demo repo

Initialize the SDK

Follow the iOS and Android minutes quickstart to initialize the SDK at the native app level.

Add the plugin to your project

  • Add the plugin to your npm dependecies:
npm install react-native-connecthings@^5.2.0 --save
  • The plugin support autolink since version 5.1.3, so no need to run link command.

Note:

Starting from version 5.1.3 of the Connecthings React Native plugin, you need to use AndroidX and a recent version of React Native (0.60.X and above). If you still want to use old versions of React Rative (0.59.10 and below), you can use the Connecthings React Native plugin version 5.1.1 Autolink is supported only in the versions compatible with React Native 0.60.X and more. When using 5.1.1 version or less of the plugin, you will need to manually link the plugin.

Note:

If you are migrating your project from React Native 0.59.X to 0.60.X and more, you will need to run unlink command react-native unlink react-native-connecthings You will need to read the official React Native blog post about the major 0.60 release and check their upgrade helper .

Being compliant with GDPR

The following methods allow your application to be compliant to GDPR.

You can find out more about this by reading our GDPR tutorial.

import RNConnecthings from 'react-native-connecthings';

RNConnecthings.optinsNeverAsked(function(error, optinsNeverAsked) {
  if (optinsNeverAsked) {
    //Ask optins for GRPD
  }
});
//give the optin to the SDK
//USER_DATA is mandatory
RNConnecthings.updateOptin("USER_DATA", true);
RNConnecthings.updateOptin("STATUS", true);
//Notify the SDK that all optins has been given - must be called each time you update optin
RNConnecthings.allOptinsAreUpdated()

RNConnecthings.isOptinAuthorized("USER_DATA", function(error, optinAuthorized) {
  if (optinAuthorized) {
    //Actions if optin has been given
  }
});

The In-App actions

The following methods allow your application to use the in-app actions.

In-app Actions are actions/messages triggered on a user's phone when the application is active in the foreground.

You can find out more about this by reading our In-App actions tutorial.

1- To listen the in-App actions, your application must have initialized a connecthings event emitter:

const connecthingsManagerEmitter = Platform.select({
  ios: new NativeEventEmitter(RNConnecthings),
  android: DeviceEventEmitter,
});

2- From the connecthings event emitter, your application can subscribe to receive:

  • the CreateInAppAction event: event which indicates that there is a place with a in-App action available
  • the RemoveInAppAction event: event which indicates that the place is no more detected, so it is time to remove the in-AppAction
this.subscriptionCreate = connecthingsManagerEmitter.addListener(
    'CreateInAppAction',
    (inAppAction) => console.log("in AppAction tag:", inAppAction.tag)) // can access inAppAction.id or inAppAction.tag
);

this.subscriptionRemove = connecthingsManagerEmitter.addListener(
    'RemoveInAppAction',
    (inAppAction) => console.log("in AppAction tag:", inAppAction.id)
);

3- Your application must ask the SDK to start listening for the In-App Actions:

RNConnecthings.startListeningInAppAction()

4- Think to unsubcribe from the emmitter

this.subscriptionCreate.remove()
this.subscriptionRemove.remove()

5- Think to stop listening the In-App actions:

RNConnecthings.stopListeningInAppAction()

The Push Notifications

The following methods allow your application to use Push Notifications.

You need to follow our native Push Notifications tutorial.

In the case you don't want to display the Push Notification permission popup immediately after the first app launch and you want to choose when to display it later, you can register for push on your react-native code instead of doing it on the native side. To register for push on your react-native code, use the function below:

RNConnecthings.registerForPush(true);

Setting custom user ID

The following method allow you to set a custom user ID.

RNConnecthings.setCustomId("customUserIdentifier");