@oiti/rn-liveness3d 1.1.2 → 2.1.0

package/src/context/Liveness3DContext.tsx

@@ -0,0 +1,122 @@
+import { startLiveness3d } from '../index';
+import React, { createContext, FC, useContext, useState } from 'react';
+import { ArgsType } from '../@types/ArgsType';
+import { onErrorType, onSuccessType } from '../@types/ResultType';
+import { ResultType } from '../@types/ResultTypes';
+import { askPermission } from '../utils/permissions';
+import { Platform } from 'react-native';
+
+export const SCREEN = Object.freeze({
+  INSTRUCTION_VIEW: 1,
+  PERMISSION_VIEW: 2,
+} as const);
+
+interface Liveness3DContextType {
+  screen: number;
+  setScreen: React.Dispatch<React.SetStateAction<number>>;
+  navigation: any;
+  setNavigation: React.Dispatch<React.SetStateAction<any>>;
+  options: ArgsType | undefined;
+  setOptions: React.Dispatch<React.SetStateAction<ArgsType | undefined>>;
+  onLiveness3DError: (error: onErrorType) => void;
+  onLiveness3DSuccess: (result: onSuccessType) => void;
+  onBack: () => any;
+  onAskPermission: () => any;
+  startLiveness: () => any;
+  callbackView: string;
+  setCallbackView: React.Dispatch<React.SetStateAction<string>>;
+}
+
+const Liveness3DContext = createContext<Liveness3DContextType | undefined>(
+  undefined
+);
+
+export const Liveness3DProvider: FC<ResultType> = ({
+  children,
+  onError,
+  onSuccess,
+}) => {
+  const [screen, setScreen] = useState<number>(1);
+  const [navigation, setNavigation] = useState<any>();
+  const [options, setOptions] = useState<ArgsType>();
+  const [callbackView, setCallbackView] = useState<string>('');
+
+  const onLiveness3DError = (error: onErrorType) => {
+    onError(error);
+  };
+
+  const onLiveness3DSuccess = (result: onSuccessType) => {
+    onSuccess(result);
+  };
+
+  function onBack() {
+    switch (screen) {
+      case SCREEN.INSTRUCTION_VIEW:
+        onLiveness3DError({ code: '0', message: 'RESULT_CANCELED' });
+        break;
+      case SCREEN.PERMISSION_VIEW:
+        setScreen(1);
+        break;
+    }
+  }
+
+  function startLiveness() {
+    if (options) {
+      startLiveness3d(options)
+        .then((result) => {
+          {
+            if (Platform.OS == 'android') {
+              //@ts-ignore
+              onSuccess(JSON.parse(result) as onSuccessType);
+            } else {
+              onSuccess(result as onSuccessType);
+            }
+          }
+        })
+        .catch((error) => {
+          onError(error as onErrorType);
+        });
+    }
+  }
+  function onAskPermission() {
+    askPermission().then((result) => {
+      result === true && startLiveness();
+      result === false && setScreen(1);
+    });
+  }
+
+  const contextValue: Liveness3DContextType = {
+    screen,
+    setScreen,
+    navigation,
+    setNavigation,
+    onLiveness3DError,
+    onLiveness3DSuccess,
+    onBack,
+    options,
+    setOptions,
+    startLiveness,
+    onAskPermission,
+    callbackView,
+    setCallbackView,
+  };
+
+  return (
+    //@ts-ignore
+    <Liveness3DContext.Provider value={contextValue}>
+      {children}
+    </Liveness3DContext.Provider>
+  );
+};
+
+export const useLiveness3DContext = (): Liveness3DContextType => {
+  const context = useContext(Liveness3DContext);
+  if (!context) {
+    throw new Error(
+      'useLiveness3DContext must be used within a Liveness3DProvider'
+    );
+  }
+  return context;
+};
+
+export default Liveness3DContext;

package/src/helpers/Liveness3DHelper.tsx

@@ -0,0 +1,24 @@
+import React, { useEffect, type FC } from 'react';
+import { useLiveness3DContext } from '../context/Liveness3DContext';
+import type { Liveness3DHelperInterface } from '../interfaces/Liveness3DHelper';
+
+export const Liveness3DHelper: FC<Liveness3DHelperInterface> = ({
+  children,
+  options,
+  onError,
+}) => {
+  const { setNavigation, setOptions, setCallbackView } = useLiveness3DContext();
+
+  useEffect(() => {
+    if (
+      options.appkey === null ||
+      options.appkey === undefined ||
+      options.appkey === ''
+    ) {
+      onError({ code: '0', message: 'invalidAppKey' });
+    }
+    setOptions(options);
+  }, [options, onError, setNavigation, setOptions, setCallbackView]);
+
+  return <>{children}</>;
+};

package/src/index.tsx

@@ -1,8 +1,15 @@
-import React, { FC, useEffect, useState } from 'react';
-import { NativeModules, Platform, PermissionsAndroid } from 'react-native';
+import React, { FC } from 'react';
+import { NativeModules, Platform } from 'react-native';
 import type { ArgsType, LoadingType } from './@types/ArgsType';
 import InstructionsView from './screens/Liveness3D/InstructionsView';
 import PermissionView from './screens/PermissionView';
+import type { onErrorType, onSuccessType } from './@types/ResultType';
+import {
+  Liveness3DProvider,
+  SCREEN,
+  useLiveness3DContext,
+} from './context/Liveness3DContext';
+import { Liveness3DHelper } from './helpers/Liveness3DHelper';
 
 const LINKING_ERROR =
   `The package '@oiti/rn-liveness3d' doesn't seem to be linked. Make sure: \n\n` +
@@ -10,12 +17,7 @@ const LINKING_ERROR =
   '- You rebuilt the app after installing the package\n' +
   '- You are not using Expo Go\n';
 
-const SCREEN = Object.freeze({
-  INSTRUCTION_VIEW: 1,
-  PERMISSION_VIEW: 2,
-} as const);
-
-const RnLiveness3d = NativeModules.RnLiveness3d
+export const RnLiveness3d = NativeModules.RnLiveness3d
   ? NativeModules.RnLiveness3d
   : new Proxy(
       {},
@@ -28,49 +30,35 @@ const RnLiveness3d = NativeModules.RnLiveness3d
 
 export function startLiveness3d(
   options: ArgsType,
-  loading?: any
-): Promise<any> {
+  loading?: LoadingType
+): Promise<onErrorType | onSuccessType> {
   let args: ArgsType = {
     appkey: options?.appkey === undefined ? '' : options?.appkey,
+    ticket: options?.ticket,
     environment:
-      options?.environment === undefined ? '.HML' : options?.environment,
-    baseUrl: options?.baseUrl === undefined ? '' : options?.baseUrl,
-    apparence: {
-      backgroundColor:
-        options?.apparence?.backgroundColor === ''
-          ? '#1E1E1E'
-          : options?.apparence?.backgroundColor,
-      loadingColor:
-        options?.apparence?.loadingColor === ''
-          ? '#05D758'
-          : options?.apparence?.loadingColor,
-    },
-    liveness3Dtext: options.liveness3Dtext || [],
+      options?.environment === undefined ? 'HML' : options?.environment,
+    liveness3Dtext: options?.liveness3Dtext || {},
+    theme: options?.theme || {},
+    fonts: options?.fonts || {},
     loading: loading,
   };
 
   if (Platform.OS === 'android') {
     return RnLiveness3d.startliveness3d(
       args.appkey,
-      loading?.type,
-      loading?.size * 200,
-      loading?.backgroundColor,
-      loading?.loadingColor
+      args.ticket,
+      loading?.type ? loading?.type : 'default',
+      loading?.size ? loading?.size * 200 : 1 * 200,
+      loading?.backgroundColor ? loading?.backgroundColor : '#333333',
+      loading?.loadingColor ? loading?.loadingColor : '#05D758',
+      args?.theme,
+      args?.fonts,
+      args?.liveness3Dtext
     );
   }
-
   return RnLiveness3d.startliveness3d(args);
 }
 
-export function logEvent3D(name: string, appkey: string): Promise<any> {
-  if (Platform.OS === 'ios') {
-    return RnLiveness3d.logevent({ event: name, appkey: appkey });
-  } else {
-    console.log(name, appkey);
-    return RnLiveness3d.logevent(name, appkey);
-  }
-}
-
 export function checkIosPermission(): Promise<any> {
   return RnLiveness3d.checkiospermission({ p: 'granted' });
 }
@@ -78,52 +66,74 @@ export function checkIosPermissionGranted(): Promise<any> {
   return RnLiveness3d.checkpermissiongranted({ p: 'granted' });
 }
 
-const PERMISSIONS_REQUEST: any = PermissionsAndroid.PERMISSIONS.CAMERA;
+export function checkcamerapermissionAndroid(): Promise<any> {
+  return RnLiveness3d.checkcamerapermission();
+}
+export function askcamerapermissionAndroid(): Promise<any> {
+  return RnLiveness3d.askcamerapermission();
+}
 
-const requestCameraPermission = async (
+export const requestCameraPermission = async (
   options: ArgsType,
+  onSuccess: (result: onSuccessType) => void,
+  onError: (error: onErrorType) => void,
   loading?: LoadingType
 ) => {
   if (Platform.OS === 'ios') {
-    checkIosPermission().then((result) => {
-      if (result === 'true') {
-        return RnLiveness3d.startliveness3d(options);
+    checkIosPermission().then(async (result) => {
+      if (result === true) {
+        await startLiveness3d(options, loading)
+          .then((result) => {
+            if (Platform.OS == 'android') {
+              //@ts-ignore
+              onSuccess(JSON.parse(result) as onSuccessType);
+            } else {
+              onSuccess(result as onSuccessType);
+            }
+          })
+          .catch((error) => onError(error as onErrorType));
       }
-      if (result === 'false') {
+      if (result === false) {
         return;
       }
     });
   }
-  try {
-    const granted = await PermissionsAndroid.request(PERMISSIONS_REQUEST, {
-      title: '',
-      message: 'Precisamos acessar sua câmera',
-      buttonNeutral: 'Ver Depois',
-      buttonNegative: 'Cancelar',
-      buttonPositive: 'OK',
-    });
 
-    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
-      startLiveness3d(options, loading).then((result) => console.log(result));
-    } else {
-      console.log('Camera permission denied');
+  if (Platform.OS === 'android') {
+    try {
+      await askcamerapermissionAndroid().then(async (res) => {
+        if (res === true) {
+          await startLiveness3d(options, loading)
+            .then((result) => {
+              if (Platform.OS == 'android') {
+                //@ts-ignore
+                onSuccess(JSON.parse(result) as onSuccessType);
+              } else {
+                onSuccess(result as onSuccessType);
+              }
+            })
+            .catch((error) => onError(error as onErrorType));
+        } else {
+          console.log('Camera permission denied');
+        }
+      });
+    } catch (err) {
+      console.warn(err);
     }
-  } catch (err) {
-    console.warn(err);
   }
 };
 
 async function checkPermission(): Promise<boolean> {
   if (Platform.OS === 'ios') {
     const grantediso = await checkIosPermissionGranted();
-    if (grantediso === 'true') {
+    if (grantediso === true) {
       return true;
     }
-    if (grantediso === 'false') {
+    if (grantediso === false) {
       return false;
     }
   }
-  const granted = await PermissionsAndroid.check(PERMISSIONS_REQUEST);
+  const granted = await checkcamerapermissionAndroid();
   if (granted) {
     return true;
   } else {
@@ -136,19 +146,33 @@ export function Liveness3dView({
   CustomPermissionView,
   options,
   loading,
+  onSuccess,
+  onError,
+  onBack,
 }: {
-  CustomInstructionView: FC;
-  CustomPermissionView: FC;
+  CustomInstructionView?: FC;
+  CustomPermissionView?: FC;
   options: ArgsType;
   loading: LoadingType;
+  onSuccess: (result: onSuccessType) => void;
+  onError: (error: onErrorType) => void;
+  onBack: () => void;
 }) {
   return (
-    <GetIntructionView
-      CustomInstructionView={CustomInstructionView}
-      CustomPermissionView={CustomPermissionView}
-      options={options}
-      loading={loading}
-    />
+    //@ts-ignore
+    <Liveness3DProvider onError={onError} onSuccess={onSuccess}>
+      <Liveness3DHelper options={options} onError={onError}>
+        <GetIntructionView
+          CustomInstructionView={CustomInstructionView}
+          CustomPermissionView={CustomPermissionView}
+          options={options}
+          loading={loading}
+          onSuccess={onSuccess}
+          onError={onError}
+          onBack={onBack}
+        />
+      </Liveness3DHelper>
+    </Liveness3DProvider>
   );
 }
 
@@ -157,18 +181,24 @@ export function GetIntructionView({
   CustomPermissionView,
   options,
   loading,
+  onSuccess,
+  onError,
+  onBack,
 }: {
-  CustomInstructionView: FC;
-  CustomPermissionView: FC;
+  CustomInstructionView?: FC;
+  CustomPermissionView?: FC;
   options: ArgsType;
   loading: LoadingType;
+  onSuccess: (result: onSuccessType) => void;
+  onError: (error: onErrorType) => void;
+  onBack: () => void;
 }) {
-  const [screen, setScreen] = useState(1);
+  const { setScreen, screen } = useLiveness3DContext();
 
-  function onBack() {
+  function onBackScreen() {
     switch (screen) {
       case SCREEN.INSTRUCTION_VIEW:
-        setScreen(1);
+        onBack();
         break;
       case SCREEN.PERMISSION_VIEW:
         setScreen(1);
@@ -177,43 +207,46 @@ export function GetIntructionView({
   }
   async function verifyPermission() {
     if (screen === 1) {
-      logEvent3D('ACTION_L3FT_instructionContinue', options.appkey);
       if ((await checkPermission()) === true) {
-        startLiveness3d(options, loading).then((result) => console.log(result));
+        startLiveness3d(options, loading)
+          .then((result) => {
+            if (Platform.OS == 'android') {
+              //@ts-ignore
+              onSuccess(JSON.parse(result) as onSuccessType);
+            } else {
+              onSuccess(result as onSuccessType);
+            }
+          })
+          .catch((error) => onError(error as onErrorType));
       } else {
         setScreen(2);
       }
     }
     if (screen === 2) {
-      logEvent3D('ACTION_L3FT_permissionVerify', options.appkey);
-      await requestCameraPermission(options);
+      await requestCameraPermission(options, onSuccess, onError);
       setScreen(1);
     }
   }
-  useEffect(() => {
-    if (screen === 1) {
-      logEvent3D('STATE_L3FT_instructionView', options.appkey);
-    }
-    if (screen === 2) {
-      logEvent3D('STATE_L3FT_permissionView', options.appkey);
-    }
-  });
 
   return (
     <>
       {screen === 1 &&
         (!CustomInstructionView ? (
-          <InstructionsView onVerify={verifyPermission} onBack={onBack} />
+          <InstructionsView onVerify={verifyPermission} onBack={onBackScreen} />
         ) : (
           CustomInstructionView
         ))}
 
       {screen === 2 &&
         (!CustomPermissionView ? (
-          <PermissionView onVerify={verifyPermission} onBack={onBack} />
+          <PermissionView onVerify={verifyPermission} onBack={onBackScreen} />
         ) : (
           CustomPermissionView
         ))}
     </>
   );
 }
+
+export { ContinueButton } from './actions/ContinueButton';
+export { PermissionButton } from './actions/PermissionButton';
+export { BackButton } from './actions/BackButton';

package/src/interfaces/Liveness3DHelper.tsx

@@ -0,0 +1,7 @@
+import { onErrorType } from '../@types/ResultType';
+import { ArgsType } from '../@types/ArgsType';
+
+export interface Liveness3DHelperInterface {
+  options: ArgsType;
+  onError: (error: onErrorType) => void;
+}

package/src/interfaces/OitiBackButtonInterface.tsx

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+import type { TouchableOpacityProps } from 'react-native';
+
+export interface OitiBackButtonInterface extends TouchableOpacityProps {
+  children: ReactNode;
+}

package/src/interfaces/OitiContinueButton.tsx

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+import type { TouchableOpacityProps } from 'react-native';
+
+export interface OitiContinueButtonInterface extends TouchableOpacityProps {
+  children: ReactNode;
+}

package/src/interfaces/OitiPermissionButtonInterface.tsx

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+import type { TouchableOpacityProps } from 'react-native';
+
+export interface OitiPermissionButtonInterface extends TouchableOpacityProps {
+  children: ReactNode;
+}

package/src/screens/Liveness3D/InstructionsView.tsx

@@ -25,13 +25,13 @@ export default function InstructionsView({
 }) {
   return (
     <View style={styles.container}>
+      <TouchableOpacity onPress={() => onBack()} style={styles.navigationBar}>
+        <Image
+          source={require('../../assets/images/left-arrow.png')}
+          style={styles.leftArrow}
+        />
+      </TouchableOpacity>
       <View style={styles.boxImg}>
-        <TouchableOpacity onPress={() => onBack()} style={styles.navigationBar}>
-          <Image
-            source={require('../../assets/images/left-arrow.png')}
-            style={styles.leftArrow}
-          />
-        </TouchableOpacity>
         <View style={styles.imgContainer}>
           <Image
             source={require('../../assets/images/img_face.png')}
@@ -193,8 +193,8 @@ const styles = StyleSheet.create({
   leftArrow: {
     marginTop: normalize(70, scaleH),
     marginLeft: 20,
-    width: 25,
-    height: 25,
+    width: normalize(25, scaleW),
+    height: normalize(35, scaleH),
   },
   imgFace: {
     height: '100%',

package/src/utils/continueButton.tsx

@@ -0,0 +1,12 @@
+import { verifyPermission } from './permissions';
+
+export const continueButton = async (): Promise<boolean> => {
+  return verifyPermission()
+    .then((result) => {
+      return result;
+    })
+    .catch((error) => {
+      console.error(error);
+      return false;
+    });
+};

package/src/utils/permissions.tsx

@@ -0,0 +1,30 @@
+import { NativeModules, Platform } from 'react-native';
+
+export const RnLiveness3d = NativeModules.RnLiveness3d
+  ? NativeModules.RnLiveness3d
+  : new Proxy(
+      {},
+      {
+        get() {
+          throw new Error(LINKING_ERROR);
+        },
+      }
+    );
+
+const LINKING_ERROR =
+  `The package '@oiti/rn-liveness3d' doesn't seem to be linked. Make sure: \n\n` +
+  Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) +
+  '- You rebuilt the app after installing the package\n' +
+  '- You are not using Expo Go\n';
+
+export function verifyPermission(): Promise<boolean> {
+  return Platform.OS === 'android'
+    ? RnLiveness3d.checkcamerapermission()
+    : RnLiveness3d.checkiospermission({ p: 'granted' });
+}
+
+export function askPermission(): Promise<boolean> {
+  return Platform.OS === 'android'
+    ? RnLiveness3d.askcamerapermission()
+    : RnLiveness3d.checkpermissiongranted({ p: 'granted' });
+}

package/src/utils/screenStore.tsx

@@ -0,0 +1,4 @@
+export const SCREEN = Object.freeze({
+  INSTRUCTION_VIEW: 1,
+  PERMISSION_VIEW: 2,
+} as const);