React Native Presence SDK Integration Guide
Native Modules Intro
Sometimes a React Native app needs to access a native platform API that is not available by default in JavaScript, for example the native iOS or Android SDK methods exposed in the Presence SDK (PSDK).
React Native apps may integrate with the Presence SDK through a native modules for iOS & Android. In this guide we will provide high level steps to integrate the Presence SDK into your react native application.
•First, please review some of the documentation on integrating native methods with React Native. Make sure to read an understand these sources well before esitmating or starting development.
React Native documention:
https://reactnative.dev/docs/native-modules-intro
For more detailed platform specific step for iOS and Android, you may also refer to the following :
iOS: https://reactnative.dev/docs/native-modules-ios http://nightlyclosures.com/2018/02/09/writing-a-react-native-ios-module-in-swift/
Android: https://reactnative.dev/docs/native-modules-android https://www.dynamsoft.com/codepool/react-native-bridging-modules-android.html
• For PSDK specifically the first thing to do is drop the PSDK library in the correct folders. Android: yourAppfolder/android/app/libs iOS: yourAppFolder/ios/
See the documentation on how to setup PSDK natively for iOS/Android. For example, in Android you’ll need to make an entry in the AndroidManifest.xml file specific to your app.
• In both Android/iOS you will need to expose the native methods you wish to interact with in order to pass data and send request from React Native to PSDK.
Setup iOS React Native PSDK integration
In iOS you must first expose your file via the RCT_EXPORT_MODULE method in an Objective-C file, then to expose specific methods use the RCT_EXPORT_METHOD For example, you might create a file called PSDKHelpers.m and inside that file before any code you have the line RCT_EXPORT_MODULE; you may have a specific method called RCT_EXPORT_METHOD(signoutTMX) – which you’d call to log out of PSDK. You’d call that method from RN with “PSDKHelpers.signout()” – the objective c code would be:
RCT_EXPORT_METHOD(signout) {
[[PSDK getPresenceSDK] logOutWithCompletion:^(BOOL hostSuccess, NSError *hostError, BOOL teamSuccess, NSError *teamErrors){
}];
[ [TMIdentityHelper shared] logout];
}In the above code example TMIdentityHelper is a Swift file that interacts with PSDK.
@objc public func logout() {
TMCookieManager.shared.removeLoginCookies();
PSDK.getPresenceSDK().logOutHost();
PSDK.getPresenceSDK().logout();
previousMember = nil;
}Setup Android React Native PSDK integration
For Android you’d create a .java file and you’d have @ReactMethod the line above any method you’d want to expose – also the you need a ReactPackage method to list all React Native methods
So the Android equivalent is:
@ReactMethod
Public void signoutPSDK() {
getPresenceSDK().logOutHost();
MainApplication.experienceSDK.logout();
TMCookieManager.getInstance.removeLoginCookies(null);
TMLoginManager.getInstance.signOut();
}Completeing the React Native PSDK integration
• In your React Native app you simply need to import the NativeModules module from React Native: import { NativeModules } from ‘react-native’; Then assign the module to a const; it’s very useful to have the name of both the Android and iOS modules be the same. const PSDKHelper = NativeModules.PSDKHelpers;
• Then just call a method: PSDKHelpers.signout();
• You can use the debugger in both Android Studio and XCode to debug your native modules.
• You can pass data back and forth; be careful of differences in data types.
