@trustchex/react-native-sdk 1.355.1 → 1.357.0

package/lib/module/Shared/Components/EIDScanner.js

@@ -12,7 +12,8 @@ import AppContext from "../Contexts/AppContext.js";
 import StyledButton from "./StyledButton.js";
 import LottieView from 'lottie-react-native';
 import { useKeepAwake } from "../Libs/native-keep-awake.utils.js";
-import { speakWithDebounce } from "../Libs/tts.utils.js";
+import { speak, resetLastMessage } from "../Libs/tts.utils.js";
+import { isDebugEnabled } from "../Libs/debug.utils.js";
 import { trackEIDScanStart, trackEIDScanComplete, trackEIDScanFailed } from "../Libs/analytics.utils.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const EIDScanner = ({
@@ -48,7 +49,7 @@ const EIDScanner = ({
         const dd = dateStr.substring(4, 6);
 
         // Assume 19xx if YY >= 50, else 20xx
-        const year = parseInt(yy) >= 50 ? `19${yy}` : `20${yy}`;
+        const year = parseInt(yy, 10) >= 50 ? `19${yy}` : `20${yy}`;
         return `${dd}/${mm}/${year}`;
       }
 
@@ -73,6 +74,7 @@ const EIDScanner = ({
   const appContext = React.useContext(AppContext);
   const [voiceGuidanceMessage, setVoiceGuidanceMessage] = useState();
   const [attemptNumber, setAttemptNumber] = useState(0);
+  const lastVoiceGuidanceMessage = useRef('');
   const readNFC = useCallback(async () => {
     const startTime = Date.now();
     const currentAttempt = attemptNumber + 1;
@@ -81,6 +83,8 @@ const EIDScanner = ({
     setIsScanned(false);
     setProgress(0);
     setProgressStage('');
+    lastVoiceGuidanceMessage.current = '';
+    resetLastMessage();
 
     // Track EID scan start using analytics helper
     const docType = documentType || 'UNKNOWN';
@@ -124,8 +128,6 @@ const EIDScanner = ({
           setDocumentMRZInfo(passportData.mrz);
           setDocumentFaceImageMimeType(passportData.mimeType);
           setIsScanned(true);
-
-          // Track successful EID scan
           await trackEIDScanComplete(docType, scanDuration, currentAttempt).catch(() => {});
         }
       } else {
@@ -240,8 +242,9 @@ const EIDScanner = ({
     }
   }, [isScanning, progress, pulseAnim]);
   useEffect(() => {
-    if (voiceGuidanceMessage && appContext.currentWorkflowStep?.data?.voiceGuidanceActive) {
-      speakWithDebounce(voiceGuidanceMessage);
+    if (voiceGuidanceMessage && appContext.currentWorkflowStep?.data?.voiceGuidanceActive && voiceGuidanceMessage !== lastVoiceGuidanceMessage.current) {
+      lastVoiceGuidanceMessage.current = voiceGuidanceMessage;
+      speak(voiceGuidanceMessage, true);
     }
   }, [voiceGuidanceMessage, appContext.currentWorkflowStep?.data?.voiceGuidanceActive]);
   return /*#__PURE__*/_jsxs(View, {
@@ -250,11 +253,14 @@ const EIDScanner = ({
       style: [styles.topProgressContainer, {
         paddingTop: insets.top + 16
       }],
-      children: [/*#__PURE__*/_jsxs(View, {
+      children: [/*#__PURE__*/_jsx(Text, {
+        style: styles.holdSteadyText,
+        children: t('eidScannerScreen.readingDocument')
+      }), /*#__PURE__*/_jsxs(View, {
         style: styles.progressTextContainer,
         children: [/*#__PURE__*/_jsx(Text, {
           style: styles.topScanningText,
-          children: progressStage || t('eidScannerScreen.readingDocument')
+          children: progressStage || t('eidScannerScreen.connecting')
         }), /*#__PURE__*/_jsxs(Text, {
           style: [styles.progressPercentage, {
             color: appContext.branding.primaryColor
@@ -433,6 +439,83 @@ const EIDScanner = ({
           },
           children: t('eidScannerScreen.approveAndContinue')
         })
+      }), isDebugEnabled() && /*#__PURE__*/_jsxs(View, {
+        style: {
+          position: 'absolute',
+          top: insets.top + 10,
+          right: 10,
+          backgroundColor: 'rgba(0, 0, 0, 0.85)',
+          padding: 10,
+          borderRadius: 8,
+          borderWidth: 1,
+          borderColor: '#FF6B6B',
+          maxWidth: 200,
+          zIndex: 1001
+        },
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#FF6B6B',
+            fontSize: 11,
+            fontWeight: 'bold',
+            marginBottom: 6
+          },
+          children: "\uD83D\uDC1B DEBUG MODE"
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `NFC: ${hasNfc ? '✓' : '✗'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `Enabled: ${isEnabled ? '✓' : '✗'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `Scanning: ${isScanning ? '✓' : '○'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `Scanned: ${isScanned ? '✓' : '○'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `Progress: ${Math.round(progress)}%`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `Face Image: ${documentFaceImage ? '✓' : '✗'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9,
+            marginBottom: 2
+          },
+          children: `MRZ Info: ${documentMRZInfo ? '✓' : '✗'}`
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            color: '#88D8B0',
+            fontSize: 9
+          },
+          children: `Doc Type: ${documentType}`
+        })]
       })]
     })]
   });
@@ -455,6 +538,13 @@ const styles = StyleSheet.create({
     backgroundColor: 'rgba(255, 255, 255, 0.95)',
     gap: 8
   },
+  holdSteadyText: {
+    fontSize: 20,
+    fontWeight: '700',
+    color: '#000',
+    textAlign: 'center',
+    marginBottom: 8
+  },
   progressTextContainer: {
     flexDirection: 'row',
     justifyContent: 'space-between',
@@ -462,7 +552,7 @@ const styles = StyleSheet.create({
     width: '100%'
   },
   topScanningText: {
-    fontSize: 18,
+    fontSize: 14,
     fontWeight: 'bold',
     color: '#000',
     flex: 1

package/lib/module/Shared/Components/FaceCamera.js

@@ -2,23 +2,26 @@
 
 import { useIsFocused } from '@react-navigation/native';
 import { useKeepAwake } from "../Libs/native-keep-awake.utils.js";
-import React, { useEffect, useState, useMemo } from 'react';
-import { StyleSheet, Text, View, Platform, Linking, Dimensions, ActivityIndicator, NativeModules } from 'react-native';
-import { useCameraDevice, useCameraPermission, Camera, useFrameProcessor, useCameraFormat, runAtTargetFps, useMicrophonePermission } from 'react-native-vision-camera';
-import { runAsync } from "../Libs/worklet.utils.js";
-import { useFaceDetector } from "../VisionCameraPlugins/FaceDetector/index.js";
-import { Worklets, useSharedValue } from 'react-native-worklets-core';
-import { crop } from "../VisionCameraPlugins/Cropper/index.js";
-import { isCircularRegionBright, isBlurry } from "../Libs/camera.utils.js";
+import { debugLog, debugWarn, debugError, logError } from "../Libs/debug.utils.js";
+import React, { useEffect, useState, useRef, useCallback } from 'react';
+import { StyleSheet, Text, View, Platform, Linking, ActivityIndicator, NativeModules, PermissionsAndroid } from 'react-native';
+import { TrustchexCamera } from "./TrustchexCamera.js";
 import { useTranslation } from 'react-i18next';
 import StyledButton from "./StyledButton.js";
 import { useTheme } from "../Contexts/ThemeContext.js";
 import { SafeAreaView } from 'react-native-safe-area-context';
+import { Dimensions } from 'react-native';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const VIDEO_WIDTH = 1280;
-const VIDEO_HEIGHT = 720;
-const windowWidth = Dimensions.get('window').width;
-const windowHeight = Dimensions.get('window').height;
+const {
+  width: windowWidth,
+  height: windowHeight
+} = Dimensions.get('window');
+const {
+  OpenCVModule
+} = NativeModules;
+const MIN_BRIGHTNESS_THRESHOLD = 80;
+const BLUR_VARIANCE_THRESHOLD = 60;
+const REGION_BRIGHTNESS_THRESHOLD = 70;
 const FaceCamera = ({
   onFacesDetected,
   onCameraInitialized,
@@ -26,60 +29,36 @@ const FaceCamera = ({
 }) => {
   useKeepAwake();
   const theme = useTheme();
-  const cameraPermission = useCameraPermission();
-  const microphonePermission = useMicrophonePermission();
+  const [hasPermission, setHasPermission] = useState(false);
   const [permissionsRequested, setPermissionsRequested] = useState(false);
-  const cameraRef = React.useRef(null);
+  const cameraRef = useRef(null);
   const isFocused = useIsFocused();
   const [isActive, setIsActive] = useState(false);
-  const device = useCameraDevice('front');
-  const format = useCameraFormat(device, [{
-    videoResolution: {
-      width: VIDEO_WIDTH,
-      height: VIDEO_HEIGHT
-    },
-    iso: 'max',
-    photoHdr: false,
-    videoHdr: false,
-    fps: 30
-  }]);
-  const isCameraInitialized = useSharedValue(false);
-  const faceDetectorOptions = useMemo(() => ({
-    contourMode: 'none',
-    landmarkMode: 'none',
-    classificationMode: 'all',
-    performanceMode: 'accurate',
-    trackingEnabled: false,
-    autoScale: true,
-    windowWidth: windowWidth,
-    windowHeight: windowHeight
-  }), [windowWidth, windowHeight]);
-  const {
-    detectFaces
-  } = useFaceDetector(faceDetectorOptions);
+  const isCameraInitializedRef = useRef(false);
+  const lastFrameTimeRef = useRef(0);
   const {
     t
   } = useTranslation();
   useEffect(() => {
     const requestPermissions = async () => {
-      if (!cameraPermission.hasPermission) {
-        await cameraPermission.requestPermission();
-      }
-      if (!microphonePermission.hasPermission) {
-        await microphonePermission.requestPermission();
+      if (Platform.OS === 'android') {
+        const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.CAMERA);
+        setHasPermission(granted === PermissionsAndroid.RESULTS.GRANTED);
+      } else {
+        // iOS permissions handled by native camera
+        setHasPermission(true);
       }
       setPermissionsRequested(true);
     };
     requestPermissions();
-  }, [cameraPermission, microphonePermission]);
-  const handleFaces = Worklets.createRunOnJS((faces, image, isBright) => {
-    if (faces.length > 0) {
-      console.log('[FaceCamera] handleFaces called - faces:', faces.length, 'bright:', isBright);
-      onFacesDetected(faces, image, isBright);
-    }
-  });
+  }, []);
   useEffect(() => {
-    if (!!device && !!format && isFocused) {
+    debugLog('FaceCamera', 'isActive state changed:', {
+      isFocused,
+      hasPermission,
+      isActive: isFocused && hasPermission
+    });
+    if (isFocused && hasPermission) {
       setIsActive(true);
     } else {
       setIsActive(false);
@@ -87,7 +66,7 @@ const FaceCamera = ({
     return () => {
       setIsActive(false);
     };
-  }, [device, format, isFocused]);
+  }, [isFocused, hasPermission]);
 
   // Set screen brightness to maximum when camera is active
   useEffect(() => {
@@ -100,9 +79,9 @@ const FaceCamera = ({
       if (isActive) {
         try {
           originalBrightness = await DeviceBrightness.getBrightness();
-          await DeviceBrightness.setBrightness(1.0);
+          await DeviceBrightness.setBrightness(1);
         } catch (error) {
-          console.log('Failed to set brightness:', error);
+          debugLog('FaceCamera', '[FaceCamera] Failed to set brightness:', error);
         }
       }
     };
@@ -113,96 +92,131 @@ const FaceCamera = ({
       }
     };
   }, [isActive]);
-  const handleWorklet = frame => {
-    'worklet';
-
+  const isProcessingFrame = useRef(false);
+  const handleFrame = useCallback(async event => {
+    debugLog('FaceCamera', '*** FRAME CALLBACK INVOKED ***', {
+      isProcessing: isProcessingFrame.current,
+      timestamp: Date.now()
+    });
+    if (isProcessingFrame.current) {
+      debugLog('FaceCamera', 'Frame dropped - already processing');
+      return;
+    }
+    const now = Date.now();
+    const timeSinceLastFrame = now - lastFrameTimeRef.current;
+    // Throttle to ~6.7 FPS for face scanning (150ms interval matches Flutter SDK for responsive detection)
+    if (timeSinceLastFrame < 150) {
+      debugLog('FaceCamera', `Frame dropped - throttling (${timeSinceLastFrame}ms < 150ms)`);
+      return;
+    }
+    lastFrameTimeRef.current = now;
+    if (!isCameraInitializedRef.current) {
+      debugLog('FaceCamera', 'Camera not initialized yet');
+      return;
+    }
+    if (!isActive) {
+      debugLog('FaceCamera', 'Camera not active');
+      return;
+    }
+    isProcessingFrame.current = true;
+    const {
+      frame
+    } = event.nativeEvent;
     try {
-      // Calculate brightness based on the circular preview area if provided
-      // Otherwise fall back to entire frame brightness
-      let isBright = false;
-      if (previewRect) {
-        // Convert preview rect from screen coordinates to frame coordinates
-        const scaleX = frame.width / windowWidth;
-        const scaleY = frame.height / windowHeight;
-        const frameCircleRect = {
-          minX: Math.floor(previewRect.minX * scaleX),
-          minY: Math.floor(previewRect.minY * scaleY),
-          width: Math.floor(previewRect.width * scaleX),
-          height: Math.floor(previewRect.height * scaleY)
-        };
-        isBright = isCircularRegionBright(frame, frameCircleRect, 60);
-      } else {
-        // Fallback: check entire frame brightness (use legacy method)
-        const buffer = frame.toArrayBuffer();
-        const data = new Uint8Array(buffer);
-        const width = frame.width;
-        const height = frame.height;
-        let luminanceSum = 0;
-        let pixelCount = 0;
-        const centerX = Math.floor(width / 2);
-        const centerY = Math.floor(height / 2);
-        const halfSizeX = Math.floor(width / 2);
-        const halfSizeY = Math.floor(height / 2);
-        for (let y = centerY - halfSizeY; y < centerY + halfSizeY; y++) {
-          for (let x = centerX - halfSizeX; x < centerX + halfSizeX; x++) {
-            const index = y * width + x;
-            if (data[index] !== undefined) {
-              luminanceSum += data[index];
-              pixelCount++;
-            }
-          }
-        }
-        isBright = luminanceSum / pixelCount > 60;
-      }
-
-      // Skip blurry frames to ensure sharp face captures
-      // Lower threshold (10) for better frame acceptance
-      if (isBlurry(frame, 10)) {
+      if (!frame.width || !frame.height || frame.width <= 0 || frame.height <= 0) {
+        debugLog('FaceCamera', 'Invalid frame dimensions');
         return;
       }
-      const image = crop(frame, {
-        cropRegion: {
-          top: 0,
-          left: 0,
-          width: 100,
-          height: 100
+      const base64Image = frame.base64Image ?? '';
+
+      // Read faces directly from native ML Kit results
+      const nativeFaces = frame.faces ?? [];
+      debugLog('FaceCamera', 'Native faces:', nativeFaces.length);
+
+      // Map NativeFace to FaceCamera's Face type first
+      // ML Kit classification probabilities may be undefined if detection fails
+      // Default to 0 so comparisons don't fail with undefined
+      const faces = nativeFaces.map(f => ({
+        bounds: {
+          x: f.bounds.x,
+          y: f.bounds.y,
+          width: f.bounds.width,
+          height: f.bounds.height
         },
-        includeImageBase64: true,
-        saveAsFile: false
-      });
-      if (image && image.base64) {
-        const faces = detectFaces(frame);
-        if (faces.length > 0) {
-          console.log('[FaceCamera] Faces detected:', faces.length);
+        yawAngle: f.yawAngle ?? 0,
+        pitchAngle: f.pitchAngle ?? 0,
+        rollAngle: f.rollAngle ?? 0,
+        smilingProbability: f.smilingProbability ?? 0,
+        leftEyeOpenProbability: f.leftEyeOpenProbability ?? 0,
+        rightEyeOpenProbability: f.rightEyeOpenProbability ?? 0
+      }));
+
+      // Check overall brightness - computed natively on the Y plane
+      const avgBrightness = frame.brightness ?? 128;
+      const isBright = avgBrightness >= MIN_BRIGHTNESS_THRESHOLD;
+
+      // Check brightness in the region of interest (circular preview area)
+      let isRegionBright = isBright; // Default to overall brightness
+      if (previewRect && base64Image && OpenCVModule) {
+        try {
+          // Scale preview rect from screen coordinates to frame coordinates
+          const scaleX = frame.width / windowWidth;
+          const scaleY = frame.height / windowHeight;
+          const regionMinX = Math.round(previewRect.minX * scaleX);
+          const regionMinY = Math.round(previewRect.minY * scaleY);
+          const regionWidth = Math.round(previewRect.width * scaleX);
+          const regionHeight = Math.round(previewRect.height * scaleY);
+          isRegionBright = await OpenCVModule.isCircularRegionBright(base64Image, regionMinX, regionMinY, regionWidth, regionHeight, REGION_BRIGHTNESS_THRESHOLD);
+        } catch (error) {
+          debugWarn('FaceCamera', 'Region brightness check failed:', error);
         }
-        handleFaces(faces, image.base64, isBright);
       }
-    } catch (error) {
-      console.error('[FaceCamera] Face detection error:', error);
-    }
-  };
-  const frameProcessor = useFrameProcessor(frame => {
-    'worklet';
 
-    if (!isCameraInitialized.value) {
-      return;
-    }
-    // iOS: Run at target 6 FPS using runAtTargetFps
-    if (Platform.OS === 'ios') {
-      runAtTargetFps(6, () => {
-        'worklet';
-
-        handleWorklet(frame);
-      });
-    } else {
-      // Android: Run async without throttling
-      runAsync(frame, () => {
-        'worklet';
+      // Check for blur using OpenCV Laplacian variance
+      let isNotBlurry = true;
+      try {
+        if (base64Image && OpenCVModule) {
+          const isBlurryResult = await OpenCVModule.checkBlurry(base64Image, BLUR_VARIANCE_THRESHOLD);
+          isNotBlurry = !isBlurryResult;
+        }
+      } catch (error) {
+        debugWarn('FaceCamera', 'Blur check failed:', error);
+        // If check fails, assume not blurry to continue
+      }
 
-        handleWorklet(frame);
-      });
+      // Check quality but still pass detected faces
+      // Let liveness detection logic decide whether to accept poor quality frames
+      const hasGoodQuality = isRegionBright && isNotBlurry;
+      if (!hasGoodQuality) {
+        debugLog('FaceCamera', 'Frame quality insufficient:', {
+          avgBrightness,
+          isBright,
+          isRegionBright,
+          isNotBlurry,
+          faceCount: faces.length
+        });
+      }
+      debugLog('FaceCamera', `Calling onFacesDetected with ${faces.length} faces`);
+      // Always call onFacesDetected with detected faces
+      // isRegionBright indicates whether the region of interest has acceptable brightness
+      // This allows the UI to show warnings while still detecting faces
+      onFacesDetected(faces, base64Image, isRegionBright, frame.width, frame.height);
+    } catch (error) {
+      debugError('FaceCamera', 'Face detection error:', error);
+    } finally {
+      isProcessingFrame.current = false;
+    }
+  }, [isActive, previewRect, onFacesDetected]);
+  const handleCameraReady = useCallback(() => {
+    debugLog('FaceCamera', 'Camera ready, initializing...');
+    isCameraInitializedRef.current = true;
+    if (cameraRef.current) {
+      onCameraInitialized(cameraRef.current);
     }
-  }, [handleFaces, isCameraInitialized]);
+  }, [onCameraInitialized]);
+  const handleCameraError = useCallback(event => {
+    logError('[FaceCamera] Camera error:', event.nativeEvent.error);
+  }, []);
   if (!permissionsRequested) {
     return /*#__PURE__*/_jsx(SafeAreaView, {
       style: styles.permissionContainer,
@@ -212,8 +226,7 @@ const FaceCamera = ({
       })
     });
   }
-  if (!cameraPermission.hasPermission) {
-    // Camera permission denied by user - their choice, not actionable
+  if (!hasPermission) {
     return /*#__PURE__*/_jsxs(SafeAreaView, {
       style: styles.permissionContainer,
       children: [/*#__PURE__*/_jsx(Text, {
@@ -228,50 +241,28 @@ const FaceCamera = ({
       })]
     });
   }
-  if (!microphonePermission.hasPermission) {
-    // Microphone permission denied by user - their choice, not actionable
-    return /*#__PURE__*/_jsxs(SafeAreaView, {
-      style: styles.permissionContainer,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.permissionText,
-        children: t('general.noMicrophonePermissionGiven')
-      }), /*#__PURE__*/_jsx(StyledButton, {
-        mode: "contained",
-        onPress: () => {
-          Linking.openSettings();
-        },
-        children: t('general.openSettings')
-      })]
-    });
-  }
-  if (device == null) {
-    // No camera device - device limitation, not actionable
-    return /*#__PURE__*/_jsx(SafeAreaView, {
-      style: styles.permissionContainer,
-      children: /*#__PURE__*/_jsx(Text, {
-        style: styles.permissionText,
-        children: t('general.noCameraDetected')
-      })
-    });
-  }
+  debugLog('FaceCamera', 'Rendering TrustchexCamera with props:', {
+    isActive,
+    enableFrameProcessing: isActive,
+    enableFaceDetection: isActive,
+    includeBase64: true,
+    targetFps: 10
+  });
   return /*#__PURE__*/_jsx(View, {
     style: StyleSheet.absoluteFill,
-    children: /*#__PURE__*/_jsx(Camera, {
+    children: /*#__PURE__*/_jsx(TrustchexCamera, {
       ref: cameraRef,
-      frameProcessor: frameProcessor,
       style: StyleSheet.absoluteFill,
-      device: device,
-      format: format,
-      isActive: isActive,
-      video: true,
-      photo: false,
-      audio: true,
-      videoBitRate: 'extra-low',
-      fps: Math.max(format?.minFps ?? 0, 30),
-      onInitialized: () => {
-        isCameraInitialized.value = true;
-        onCameraInitialized(cameraRef.current);
-      }
+      cameraType: "front",
+      torchEnabled: false,
+      enableFrameProcessing: isActive,
+      enableFaceDetection: isActive,
+      includeBase64: true // Enabled to capture photos for liveness steps
+      ,
+      targetFps: 5,
+      onFrameAvailable: handleFrame,
+      onCameraReady: handleCameraReady,
+      onCameraError: handleCameraError
     })
   });
 };