How to Integrate the Device Data Collector into React Native Applications

Open the iOS project within your React Native application in Xcode.

In Finder, go to the project folder, iOS folder, and then open .xcworkspace (if pods)/.xcodeproj.

Import KDataCollector.h and KountAnalyticsViewController.h in AppDelegate.h

Add the following code in the Appdelegate.m file.

    
    [[KDataCollector sharedCollector] setDebug:YES];
    // TODO Set your Merchant ID
    [[KDataCollector sharedCollector] setMerchantID:@"900900"];
    // TODO Set the location collection configuration
    [[KDataCollector sharedCollector]setLocationCollectorConfig:KLocationCollectorConfigRequestPermission];
    // For a released app, you'll want to set this to KEnvironmentProduction
    [[KDataCollector sharedCollector] setEnvironment:KEnvironmentTest];
    [[KountAnalyticsViewController sharedInstance] setEnvironmentForAnalytics: 
    [KDataCollector.sharedCollector environment]];
    

Create a bridging-header file or import the SDK directly.

Import KDataCollector.h and KountAnalyticsViewController.h in <ProjectName>-Bridging-Header.h.

Add the following code in the Appdelegate.swift file.

    // Set the location collection configuration
    KDataCollector.shared().locationCollectorConfig = KLocationCollectorConfig.requestPermission
        KDataCollector.shared().debug = true
        // Set your Merchant ID
        KDataCollector.shared().merchantID = "900900"
        // For a released app, you'll want to set this to KEnvironmentProduction
        KDataCollector.shared().environment = KEnvironment.test
        KountAnalyticsViewController().setEnvironmentForAnalytics(KDataCollector.shared().environment)
    

Create a new file called KountBridgeModule.swift and add the following code.

    import UIKit
    
    @objc(KountBridgeModule)
    
    class KountBridgeModule: NSObject {
    
    @objc
    func collect() {
      DispatchQueue.main.async {
        KountAnalyticsViewController().collect(KountAnalyticsViewController.getAppSessionID(), analyticsSwitch: false) {
            (sessionID, success, error) in
                if (success) {
                    print("IDK",KountAnalyticsViewController.getAppSessionID())
                    print("Collection Successful")
                }
                else {
                    if((error) != nil) {
                        print("Collection failed with error",error?.localizedDescription as Any)
                    }
                    else {
                        print("Collection failed without error")
                    }
            }
        }
      }

Create a new file called KountBridgeModule.m and add the following code to make native code access available to .js files.

    #import <Foundation/Foundation.h>
    #import "React/RCTBridgeModule.h"
    
     @interface RCT_EXTERN_MODULE(KountBridgeModule, NSObject)
     
     RCT_EXTERN_METHOD(collect)
    + (BOOL)requiresMainQueueSetup
    {
        return YES;
    }
    
    RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD(getAppID) {
                                NSString *sessionID = [KountAnalyticsViewController getAppSessionID];
                                return sessionID;
                       }
    
     @end
    

Gradle

Refer to How to Integrate the Device Data Collector into Mobile Apps using Android Gradle.

Android Library JAR

Refer to How to Integrate the Device Data Collector into Android Applications using the Library JAR.

In the main activity of your application, initialize the collector and assign the <MERCHANT_ID> you received. Optionally, you can provide a sessionID if you need to generate your own. If not, the SDK will generate one for you. Send this sessionID back to your severs in order to make calls to the API.

Add the following code in your MainActivity:

    import com.kount.api.analytics.AnalyticsCollector;
    import com.kount.api.analytics.AnalyticsConstants;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
      ...
      // REQUIRED SECTION
      AnalyticsCollector.setMerchantId("999999");
      // END REQUIRED SECTION
      AnalyticsConstants.collectDeviceDataForSession=true
  
      //For production need to add AnalyticsCollector.ENVIRONMENT_PRODUCTION
      AnalyticsCollector.setEnvironment(AnalyticsCollector.ENVIRONMENT_TEST);
  
      // OPTIONAL SESSION_ID SECTION
      final String deviceSessionID UUID.randomUUID().toString();
      AnalyticsCollector.setSessionId(deviceSessionID);
      // END OPTIONAL SESSION_ID SECTION
      ...
     }
    

To support Location Collection in Android API 23 and later, add the following permissions to your main activity, onCreate method:

    if (ContextCompat.checkSelfPermission(this, Manifest.permission.ACCESS_FINE_LOCATION) != PackageManager.PERMISSION_GRANTED) {
      if (ActivityCompat.shouldShowRequestPermissionRationale(this, Manifest.permission.ACCESS_FINE_LOCATION)) {
        ActivityCompat.requestPermissions(this, new String[]{Manifest.permission.ACCESS_FINE_LOCATION}, AnalyticsCollector.REQUEST_PERMISSION_LOCATION);
      } else {
          ActivityCompat.requestPermissions(this, new String[]{Manifest.permission.ACCESS_FINE_LOCATION}, AnalyticsCollector.REQUEST_PERMISSION_LOCATION);
      }
    }
    

Create the KountModule.java file inside of the android/app/src/main/java/com/your-app-name/ folder. This file contains your native module Java class.

Add the following code:

    import androidx.annotation.NonNull;
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.bridge.ReactContextBaseJavaModule;
    import com.facebook.react.bridge.ReactMethod;
    import com.kount.api.analytics.AnalyticsCollector;

    public class KountModule extends ReactContextBaseJavaModule {
      private static ReactApplicationContext reactContext;
  
      KountModule(ReactApplicationContext context) {
          super(context);
          reactContext = context;
      }
  
      @ReactMethod
      public void collect() {
          AnalyticsCollector.collectDeviceDataForSession(reactContext,(sessionId)->
{
  Log.d("TAG", "Client success completed with sessionId "+sessionId);
  Log.d("TAG", "DDC status is " +AnalyticsCollector.getCollectionStatus());
  callback.invoke(sessionId,AnalyticsCollector.getCollectionStatus().name());
  return null;
},(sessionId, error)->
  {
    Log.d("TAG", "client failed with sessionId $error, $sessionId");
    Log.d("TAG", "DDC status is " +AnalyticsCollector.getCollectionStatus());
    callback.invoke(sessionId,AnalyticsCollector.getCollectionStatus().name());
    return null;
});
      }
  
      @NonNull
      @Override
      public String getName() {
          return "KOUNT_MODULE";
      }
    }
    

Register the Module: To add your Native Module to ReactPackage, first create a new Java Class named KountModulePackage.java that implements ReactPackage inside the android/app/src/main/java/com/your-app-name/ folder:

Then add the following content:

    import androidx.annotation.NonNull;

    import com.facebook.react.ReactPackage;
    import com.facebook.react.bridge.NativeModule;
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.uimanager.ViewManager;
    
    import java.util.ArrayList;
    import java.util.Collections;
    import java.util.List;
    
    public class KountModulePackage implements ReactPackage {
      @NonNull
      @Override
      public List<NativeModule> createNativeModules(@NonNull ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        modules.add(new KountModule(reactContext));
        return modules;
      }
    
      @NonNull
      @Override
      public List<ViewManager> createViewManagers(@NonNull ReactApplicationContext reactContext) {
          return Collections.emptyList();
      }
    }
    

Open your MainApplication.java file in the following path: android/app/src/main/java/com/your-app-name/MainApplication.java and locate the ReactNativeHost’s getPackages() method and add your package to the packages list.

    @Override
    protected List<ReactPackage> getPackages() { 
     @SuppressWarnings("UnnecessaryLocalVariable")   
     List<ReactPackage> packages = new PackageList(this).getPackages();  
     packages.add(new KountModulePackage()); 
     return packages;
    }
    

Create a new JavaScript file named KountModule.js in your project root folder and add the following code.

      import { NativeModules } from "react-native";
      const {KOUNT_MODULE}=NativeModules;
      export default KOUNT_MODULE;