React Native 4.0.x

"react-native-trust-vision-SDK": "git+https://<github_token>:[email protected]/tsocial/<repo_name>#<version_tag_name>"

$ yarn

...
pod 'RNTrustVisionRnsdkFramework', path: '../node_modules/react-native-trust-vision-SDK'

...

# Add below lines to the end of podfile
post_install do |installer|
    installer.pods_project.targets.each do |target|
        target.build_configurations.each do |config|
            config.build_settings['OTHER_SWIFT_FLAGS'] = '$(inherited) -no-verify-emitted-module-interface'
        end

        // you can add more modules which have the error "Undefined symbol" into the list
        if ['CocoaLumberjack', 'TensorFlowLiteC', 'TensorFlowLiteSwift', 'PromiseKit', 'CryptoSwift'].include? "#{target}"
            target.build_configurations.each do |config|
                config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
            end
        end
    end
end

$ pod install

maven {
     url("$rootDir/../node_modules/react-native-trust-vision-SDK/android/repo")
}

allprojects {
    repositories {
        mavenLocal()
        ...
        maven {
             url("$rootDir/../node_modules/react-native-trust-vision-SDK/android/repo")
        }
        google()
        jcenter()
        maven { url 'https://jitpack.io' }
    }
}

android {
    ...
    aaptOptions {
        noCompress "tflite"
        noCompress "lite"
    }
}

import { NativeEventEmitter } from "react-native";

import RNTrustVisionRnsdkFramework, {
  TVConst,
  TVErrorCode,
  TVThemeCustomization,
} from "react-native-trust-vision-SDK";

try {
  const initConfig = {
    jsonConfigurationByServer: jsonConfigurationByServer,
    languageCode: languageCode,
  };
  await RNTrustVisionRnsdkFramework.initializeWithConfig(initConfig);

  const tvsdkEmitter = new NativeEventEmitter(RNTrustVisionRnsdkFramework);
  // Listen to the events during the capturing
  const subscription = tvsdkEmitter.addListener("TVSDKEvent", (event) => {
    console.log("TVSDK - " + event.name + " - " + event.params.page_name);
  });

  const selfieConfig = {
    cameraOption: TVConst.SelfieCameraMode.FRONT,
    livenessMode: TVConst.LivenessMode.FLASH_ADVANCED,
    skipConfirmScreen: true,
    isEnableSound: false,
  };
  const faceAuthConfig = {
    cusUserId: "cusUserId",
    authType: TVConst.AuthenType.REGISTRATION,
    authMode: TVConst.AuthenMode.FLASH_8,
    selfieConfig: selfieConfig,
  };
  const faceAuthResult =
    await RNTrustVisionRnsdkFramework.startFaceAuthentication(faceAuthConfig);
} catch (e) {}

const initConfig = {
  jsonConfigurationByServer: jsonConfigurationByServer,
  languageCode: languageCode,
  theme: theme,
  endpoint: endpoint,
  accessKeyId: accessKeyId,
  accessKeySecret: accessKeySecret,
  endpointLogger: endpointLogger,
  accessKeyIdLogger: accessKeyIdLogger,
  accessKeySecretLogger: accessKeySecretLogger,
  xRequestId: xRequestId,
  xRequestId2: xRequestId2,
  imageEncryptionKey: imageEncryptionKey,
  securityPublicKey: securityPublicKey,
  flowId: flowId,
  headers: headers,
};
await RNTrustVisionRnsdkFramework.initializeWithConfig(initConfig);

const idConfig = {
  cardTypes: [cardType],
  cardSide: TVConst.CardSide.FRONT,
  isEnableSound: true,
  isReadBothSide: false,
  skipConfirmScreen: true,
  isEnablePhotoGalleryPicker: false,
  isEnableUploadFrames: true,
  isEnableUploadImages: true,
  isEnableSanityCheck: true,
  isEnableDetectingIdCardTampering: true,
  isEnableReadCardInfo: true,
  isEnableCheckNfcData: true,
  isEnableVerifyNfc: true,
};

const cardType = {
  id: "vn.national_id",
  name: "CMND cũ / CMND mới / CCCD",
  orientation: TVConst.Orientation.HORIZONTAL,
  hasBackSide: true,
  frontQr: {
    exist: true,
    type: "qr_code",
    widthHeightRatio: 1,
  },
};

const result = await RNTrustVisionRnsdkFramework.startIdCapturing(config);

const config = {
  cameraOption: TVConst.SelfieCameraMode.FRONT,
  isEnableSound: true,
  livenessMode: TVConst.LivenessMode.FLASH_16,
  skipConfirmScreen: true,
  isEnableUploadFrames: true,
  isEnableUploadImages: true,
  isEnableSanityCheck: true,
  isEnableVerifyLiveness: true,
};

const selfieCapturingResult =
  await RNTrustVisionRnsdkFramework.startSelfieCapturing(config);

var frameBatchIdsDictionary = []; // this dictionary will be used for liveness verification
// frameBatchIdsDictionary.push({
//    key:   <id_returned_from_sdk>,
//    value: <id_returned_from_server>
// });

// Listen to the frame batches recorded during the capturing
const framesRecordedSubscription = tvsdkEmitter.addListener(
  "TVSDKFrameBatch",
  async (frameBatch) => {
    console.log("TVSDK - " + "FrameBatch: ", frameBatch);
    // upload frame batch to server using this api:
    // https://ekyc.trustingsocial.com/api-reference/customer-api/#upload-videoaudioframes
    const uploadingResult = await uploadFrameBatch(frameBatch);
    frameBatchIdsDictionary.push({
      key: frameBatch.batchId,
      value: uploadingResult.fileId,
    });
  }
);

// Remove all invalid batch ids:
Object.entries(frameBatchIdsDictionary).map(
  ([id_returned_from_sdk, id_returned_from_server]) => {
    if (
      !selfieCapturingResult.livenessFrameBatchIds.includes(
        id_returned_from_sdk
      )
    ) {
      delete frameBatchIdsDictionary[id_returned_from_sdk];
    }
  }
);

{
  "id": "<id of frontal image i>"
}

{
  "gesture": "lower case string of <selfieCapturingResult.selfieImages[i].gesture_type>",
  "images": [
    {
      "id": "<id of gesture image i>"
    }
  ]
}

{
"id": "<frameBatchIdsDictionary's values[0]>"
},
{
"id": "<frameBatchIdsDictionary's values[1]>"
}
...

const config = {
  cardType: cardType,
  isEnableSound: false,
  skipConfirmScreen: true,
  cardSide: TVConst.CardSide.FRONT,
  isEnableUploadFrames: true,
  isEnableUploadImages: true,
};

const result = await RNTrustVisionRnsdkFramework.startQRScanning(config);

const frontQrImage = result.frontIdQr.images[i];
const metadata = frontQrImage.metadata;
const label = frontQrImage.label;
const data = frontQrImage.imageByteArray;

const config = {
  nfcCode: nfcCode,
  hashSod: sod,
  issueDate: issueDate,
  cachedFields: cachedFields,
  isRequestReadImageNfc: true,
  isRequestIntegrityCheckNfc: true,
  isRequestCloneDetectionNfc: true,
  nfcMaxRetries: 5,
  isEnableCheckNfcData: true,
  isEnableVerifyNfc: true,
};

const result = await RNTrustVisionRnsdkFramework.startNfcScanning(config);

const selfieConfig = {
  cameraOption: TVConst.SelfieCameraMode.FRONT,
  livenessMode: TVConst.LivenessMode.FLASH_ADVANCED,
  skipConfirmScreen: true,
  isEnableSound: false,
};
const config = {
  cusUserId: "cusUserId",
  authType: TVConst.AuthenType.REGISTRATION,
  authMode: TVConst.AuthenMode.FLASH_ADVANCED,
  isEnableFaceAuthentication: true,
  isEnableFaceRegistration: true,
  selfieConfig: selfieConfig,
};

await RNTrustVisionRnsdkFramework.startFaceAuthentication(config);

const customizedTVTheme = () => {
  const normalTextSize = 14.0;
  const labelBackgroundColors = ["#00ffffff"]; // transparent. Set multiple colors if you want gradient
  const normalLabelTextColor = "#ffffff"; // white
  const errorLabelTextColor = "#ff0000"; //red
  const labelBorderColor = "#00ffffff"; // transparent
  const screenBackgroundColor = "#0D0D51"; // blue
  const labelBorderWidth = 1.0;
  const labelPaddingHorizontal = 10.0;
  const labelPaddingVertical = 5.0;
  const cornerRadius = 0.0;

  const normalLabelTheme = {
    isHidden: false,
    textSize: normalTextSize,
    fontStyle: TVThemeCustomization.FontStyle.REGULAR,
    textColor: normalLabelTextColor,
    backgroundColors: labelBackgroundColors,
    isBackgroundGradientHorizontal: false,
    cornerRadius: cornerRadius,
    borderWidth: labelBorderWidth,
    borderColor: labelBorderColor, // transparent
    paddingHorizontal: labelPaddingHorizontal,
    paddingVertical: labelPaddingVertical,
    textGravity: TVThemeCustomization.TextGravity.CENTER,
  };

  const titleLabelTheme = {};
  Object.assign(titleLabelTheme, normalLabelTheme);
  titleLabelTheme["textSize"] = 16.0;
  titleLabelTheme["fontStyle"] = TVThemeCustomization.FontStyle.BOLD;

  const errorLabelTheme = {};
  Object.assign(errorLabelTheme, normalLabelTheme);
  errorLabelTheme["textSize"] = 12.0;
  errorLabelTheme["textColor"] = errorLabelTextColor;

  const timeoutLabelTheme = {};
  Object.assign(timeoutLabelTheme, errorLabelTheme);
  timeoutLabelTheme["isHidden"] = true;

  const idCapturingTheme = {
    titleLabelTheme: titleLabelTheme,
    instructionLabelTheme: normalLabelTheme,
    errorLabelTheme: errorLabelTheme,
    timeoutLabelTheme: timeoutLabelTheme,
    normalLabelTheme: normalLabelTheme,
    closeButtonLocation: TVThemeCustomization.ButtonLocation.TOP_LEFT,
    backgroundColor: "#80000000", // 50% black
    captureButtonImage: "your_base64_image",
    captureButtonDisableImage: "your_base64_image",
    closeButtonImage: "your_base64_image",
    maskViewNeutralImage: "your_base64_image",
    maskViewSuccessImage: "your_base64_image",
    maskViewErrorImage: "your_base64_image",
    loadingImage: "your_base64_image",
    qrInstructionLabelTheme: normalLabelTheme,
    qrInstructionBackgroundImage: "your_base64_image",
    qrMaskViewNeutralImage: "your_base64_image",
    qrMaskViewSuccessImage: "your_base64_image",
    qrMaskViewErrorImage: "your_base64_image",
  };

  const idConfirmationTheme = {
    titleLabelTheme: titleLabelTheme,
    errorLabelTheme: errorLabelTheme,
    normalLabelTheme: normalLabelTheme,
    closeButtonLocation: TVThemeCustomization.ButtonLocation.TOP_LEFT,
    backgroundColor: screenBackgroundColor,
    closeButtonImage: "your_base64_image",
    icQrResultSuccessImage: "your_base64_image",
    icQrResultErrorImage: "your_base64_image",
    confirmButtonImage: "your_base64_image",
    retryButtonImage: "your_base64_image",
    maskViewImage: "your_base64_image",
    loadingImage: "your_base64_image",
  };

  const gestureTheme = {
    currentStepFocusImage: "your_base64_image",
    turnLeftActiveImage: "your_base64_image",
    finishedGestureBackgroundImage: "your_base64_image",
    turnRightActiveImage: "your_base64_image",
    turnUpActiveImage: "your_base64_image",
    turnDownActiveImage: "your_base64_image",
    lookStraightActiveImage: "your_base64_image",
    turnLeftInactiveImage: "your_base64_image",
    turnRightInactiveImage: "your_base64_image",
    turnUpInactiveImage: "your_base64_image",
    turnDownInactiveImage: "your_base64_image",
    lookStraightInactiveImage: "your_base64_image",
  };

  const selfieCapturingTheme = {
    titleLabelTheme: titleLabelTheme,
    instructionLabelTheme: normalLabelTheme,
    errorLabelTheme: errorLabelTheme,
    timeoutLabelTheme: timeoutLabelTheme,
    normalLabelTheme: normalLabelTheme,
    closeButtonLocation: TVThemeCustomization.ButtonLocation.TOP_LEFT,
    gestureTheme: gestureTheme,
    backgroundColor: screenBackgroundColor,
    captureButtonImage: "your_base64_image",
    captureButtonDisableImage: "your_base64_image",
    closeButtonImage: "your_base64_image",
    maskViewNeutralImage: "your_base64_image",
    maskViewSuccessImage: "your_base64_image",
    maskViewErrorImage: "your_base64_image",
    loadingImage: "your_base64_image",
    switchCameraSideImage: "your_base64_image",
  };

  const selfieConfirmationTheme = {
    titleLabelTheme: titleLabelTheme,
    instructionLabelTheme: normalLabelTheme,
    errorLabelTheme: errorLabelTheme,
    normalLabelTheme: normalLabelTheme,
    closeButtonLocation: TVThemeCustomization.ButtonLocation.TOP_LEFT,
    backgroundColor: screenBackgroundColor,
    closeButtonImage: "your_base64_image",
    confirmButtonImage: "your_base64_image",
    retryButtonImage: "your_base64_image",
    maskViewImage: "your_base64_image",
    loadingImage: "your_base64_image",
  };

  const qrPopupLabelTheme = {
    textSize: 16.0,
    textColor: "#99002F75" /* 60% opacity */,
  };

  const qrPopupPrimaryButtonTheme = {
    cornerRadius: 3.0,
    textSize: 16.0,
    textColor: "#ffffff",
    backgroundColors: ["#0276F1"], // set multiple color if you want gradients
  };

  const qrGuidelinePopupTheme = {
    backgroundColor: "#ffffff",
    headerImage: "your_base64_image",
    titleLabelTheme: { isHidden: true }, // hide label,
    descriptionTheme: qrPopupLabelTheme,
    primaryButtonTheme: qrPopupPrimaryButtonTheme,
    secondaryButtonTheme: { isHidden: true }, // hide button
    timeoutLabelTheme: qrPopupLabelTheme,
  };

  const qrRetryPopupTheme = {
    backgroundColor: "#ffffff",
    headerImage: "your_base64_image",
    titleLabelTheme: qrPopupLabelTheme,
    descriptionTheme: qrPopupLabelTheme,
    primaryButtonTheme: qrPopupLabelTheme,
    secondaryButtonTheme: qrPopupLabelTheme,
    timeoutLabelTheme: { isHidden: true }, // hide label
  };

  const tvTheme = {
    idCapturingTheme: idCapturingTheme,
    idConfirmationTheme: idConfirmationTheme,
    selfieCapturingTheme: selfieCapturingTheme,
    selfieConfirmationTheme: selfieConfirmationTheme,
    qrGuidelinePopupTheme: qrGuidelinePopupTheme,
    qrRetryPopupTheme: qrRetryPopupTheme,
  };

  return tvTheme;
};