πŸ“±React-Native SDK

react-native-enroll SDK

General Notes:

  • Package is only usable for react-native 0.74.0+

  • run npm i react-native-enroll --save

Android

  • open your app android project settings.gradle and add these lines in the top of the file.

  • make sure your minSdk is 24

import org.gradle.api.initialization.resolve.RepositoriesMode
pluginManagement {
    repositories {
        mavenCentral()
        google()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
        maven {
            url 'https://maven.innovatrics.com/releases'
            allowInsecureProtocol = true
        }
        maven { url 'https://jitpack.io' }
    }
}
dependencyResolutionManagement{
    repositoriesMode.set(RepositoriesMode.PREFER_SETTINGS)
    repositories{
        mavenCentral()
        google()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
        maven {
            url 'https://maven.innovatrics.com/releases'
            allowInsecureProtocol = true
        }
    }
}
  • After this line apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings) Add:

include ':eNROLL-sdk'
project(':eNROLL-sdk').projectDir = new file('../node_modules/react-native-enroll/android/eNROLL-sdk')
  • Finally, ask for your license then drag and drop it to your project navigator files with copy files if needed checked and check all your targets.

  • now run react-native run-android

ios

  • in your podfile for your ios xcode project add these lines:

source 'https://github.com/innovatrics/innovatrics-podspecs'

  pod 'dot-face-detection-fast', '7.5.1'
  pod 'dot-face-background-uniformity', '7.5.1'
  pod 'dot-face-expression-neutral', '7.5.1'
  pod 'dot-document', '7.5.1'
  • add the following to your project info.plist file

    <key>NSCameraUsageDescription</key>
	<string>"Your Message to the users"</string>
	<key>NSLocationWhenInUseUsageDescription</key>
	<string>"Your Message to the users"</string>
	<key>NSAppTransportSecurity</key>
    	<dict>
        	<key>NSAllowsArbitraryLoads</key>
        	<true/>
    	</dict>
  • Finally, ask for your license then drag and drop it to your project navigator files with copy files if needed checked and check all your targets.

use the sdk in react-native as follows:

import { init, launch } from 'react-native-enroll';
import { EnrollEnvironment, EnrollMode, LocalizationCode } from 'react-native-enroll/src/NativeEnroll';
  const [error, setError] = useState<string | null>(null);
  const [success, setSuccess] = useState<string | null>(null);
  const [requestId, setRequestId] = useState<string | null>(null);

  useEffect(() => {
    //remove listener is needed to be triggered in the return for useEffect so clear event lisnters. as getRequestId callback is using events
    var removeListeners: (() => void) | null = null;
    init(
      "TENANT_ID",
      "TENANT_SECRET",
      LocalizationCode.AR
      , EnrollMode.ONBOARDING,
      EnrollEnvironment.STAGING, (requestId, onEnd) => {
        setRequestId(requestId)
        // set removeListeners callback
        removeListeners = onEnd
      }, (message) => {
        console.log('onFinish', message)
        if (message.errorMessage)
          setError(message.errorMessage)
        else if (message.successMessage)
          setSuccess(message.successMessage)
      }, "GOOGLE_API_KEY", {}, false, "LEVEL_OF_TRUST", "APPLICATION_ID", "CORRELATION_ID")
    // remove subscriberd event listeners
    return () => { removeListeners != null && removeListeners() }

  }, []);

and the launch as follows:

 <Button title='Launch Enroll' onPress={() => launch()}/>

You can also include enrollColors if needed