@trustchex/react-native-sdk 1.253.0 → 1.266.0

package/src/Screens/Dynamic/IdentityDocumentEIDScanningScreen.tsx

@@ -10,6 +10,12 @@ import IdentityDocumentCamera, {
   type DocumentScannedData,
 } from '../../Shared/Components/IdentityDocumentCamera';
 import { useTranslation } from 'react-i18next';
+import {
+  trackFunnelStep,
+  useScreenTracking,
+  trackVerificationStart,
+  trackVerificationComplete,
+} from '../../Shared/Libs/analytics.utils';
 
 const IdentityDocumentEIDScanningScreen = () => {
   const appContext = useContext(AppContext);
@@ -33,6 +39,14 @@ const IdentityDocumentEIDScanningScreen = () => {
     null
   );
 
+  // Track screen view and exit
+  useScreenTracking('nfc_scanning');
+
+  // Track EID scan step started when component mounts
+  useEffect(() => {
+    trackVerificationStart('IDENTITY_DOCUMENT_EID_SCAN');
+  }, []);
+
   useEffect(() => {
     if (appContext.identificationInfo.scannedDocument?.mrzFields) {
       const {
@@ -105,6 +119,8 @@ const IdentityDocumentEIDScanningScreen = () => {
                 if (allowedCountries && allowedCountries.length > 0) {
                   const countryCode = mrzFields.issuingState;
                   if (!allowedCountries.includes(countryCode as 'TUR')) {
+                    // Workflow validation - user's document country not in allowed list
+                    // Expected behavior, not a bug
                     Alert.alert(
                       t('general.error'),
                       t('general.countryNotAllowed')
@@ -120,6 +136,8 @@ const IdentityDocumentEIDScanningScreen = () => {
                   if (
                     !allowedDocumentTypes.includes(documentCode as 'I' | 'P')
                   ) {
+                    // Workflow validation - user's document type not in allowed list
+                    // Expected behavior, not a bug
                     Alert.alert(
                       t('general.error'),
                       t('general.documentTypeNotAllowed')
@@ -130,6 +148,18 @@ const IdentityDocumentEIDScanningScreen = () => {
                   }
                 }
 
+                // Track successful EID step completion
+                trackVerificationComplete('IDENTITY_DOCUMENT_EID_SCAN', true, 1);
+
+                // Track successful NFC completion as funnel step
+                trackFunnelStep(
+                  'NFC Scan Completed',
+                  4,
+                  5,
+                  'liveness_detection',
+                  true
+                );
+
                 navigationManagerRef.current?.navigateToNextStep();
               }
             }}

package/src/Screens/Dynamic/IdentityDocumentScanningScreen.tsx

@@ -10,6 +10,12 @@ import NavigationManager, {
   type NavigationManagerRef,
 } from '../../Shared/Components/NavigationManager';
 import { useTranslation } from 'react-i18next';
+import {
+  trackFunnelStep,
+  useScreenTracking,
+  trackVerificationStart,
+  trackVerificationComplete,
+} from '../../Shared/Libs/analytics.utils';
 
 const IdentityDocumentScanningScreen = () => {
   const [idFrontSideData, setIDFrontSideData] =
@@ -28,6 +34,14 @@ const IdentityDocumentScanningScreen = () => {
     null
   );
 
+  // Track screen view and exit
+  useScreenTracking('document_scanning');
+
+  // Track document scan started when component mounts
+  useEffect(() => {
+    trackVerificationStart('IDENTITY_DOCUMENT_SCAN');
+  }, []);
+
   useEffect(() => {
     if (
       ((idFrontSideData && idBackSideData) || passportData) &&
@@ -71,6 +85,8 @@ const IdentityDocumentScanningScreen = () => {
       if (allowedCountries && allowedCountries.length > 0) {
         const countryCode = mrzFields.issuingState;
         if (!allowedCountries.includes(countryCode as 'TUR')) {
+          // Workflow validation - user's document country not in allowed list
+          // Expected behavior, not a bug
           Alert.alert(t('general.error'), t('general.countryNotAllowed'));
           appContext.onError?.(t('general.countryNotAllowed'));
           navigationManagerRef.current?.reset();
@@ -81,6 +97,8 @@ const IdentityDocumentScanningScreen = () => {
       if (allowedDocumentTypes && allowedDocumentTypes.length > 0) {
         const documentCode = mrzFields.documentCode;
         if (!allowedDocumentTypes.includes(documentCode as 'I' | 'P')) {
+          // Workflow validation - user's document type not in allowed list
+          // Expected behavior, not a bug
           Alert.alert(t('general.error'), t('general.documentTypeNotAllowed'));
           appContext.onError?.(t('general.documentTypeNotAllowed'));
           navigationManagerRef.current?.reset();
@@ -88,6 +106,18 @@ const IdentityDocumentScanningScreen = () => {
         }
       }
 
+      // Track successful document scan completion
+      trackVerificationComplete('IDENTITY_DOCUMENT_SCAN', true, 1);
+
+      // Track successful document scan completion as funnel step
+      trackFunnelStep(
+        'Document Scan Completed',
+        2,
+        5,
+        'contract_acceptance',
+        true
+      );
+
       setTimeout(
         () => navigationManagerRef.current?.navigateToNextStep(),
         1000

package/src/Screens/Dynamic/LivenessDetectionScreen.tsx

@@ -28,6 +28,12 @@ import { useTranslation } from 'react-i18next';
 import StyledButton from '../../Shared/Components/StyledButton';
 import LottieView from 'lottie-react-native';
 import { speakWithDebounce } from '../../Shared/Libs/tts.utils';
+import {
+  trackFunnelStep,
+  useScreenTracking,
+  trackVerificationStart,
+  trackVerificationComplete,
+} from '../../Shared/Libs/analytics.utils';
 
 const { width: windowWidth, height: windowHeight } = Dimensions.get('window');
 
@@ -80,6 +86,9 @@ const LivenessDetectionScreen = () => {
   const navigationManagerRef = React.useRef<NavigationManagerRef>(null);
   const { t } = useTranslation();
   const [isRecording, setIsRecording] = useState(false);
+
+  // Track screen view and exit
+  useScreenTracking('liveness_detection');
   const [initialState, setInitialState] = useState<StateType>({
     brightnessLow: false,
     faceDetected: false,
@@ -170,20 +179,35 @@ const LivenessDetectionScreen = () => {
       try {
         await camera?.cancelRecording();
         setIsRecording(false);
-      } catch (e) {
-        // Ignore error
+      } catch (error) {
+        // User cancelled recording - expected behavior, no need to track
       }
     }
     setTimeout(() => {
+      // Track liveness check started
+      trackVerificationStart('LIVENESS_CHECK');
+
       camera?.startRecording({
         fileType: 'mp4',
         videoCodec: 'h265',
         onRecordingError() {
+          // Recording errors are retried automatically, no need to track them
           setIsRecording(false);
         },
         onRecordingFinished(video) {
           setTimeout(() => {
             dispatch({ type: 'VIDEO_RECORDED', payload: video.path });
+
+            // Track liveness check completion
+            trackVerificationComplete('LIVENESS_CHECK', true, 1);
+
+            trackFunnelStep(
+              'Liveness Check Completed',
+              3,
+              5,
+              'document_scanning',
+              true
+            );
             setIsRecording(false);
           }, 500);
         },
@@ -196,8 +220,9 @@ const LivenessDetectionScreen = () => {
     try {
       await camera?.stopRecording();
       setIsRecording(false);
-    } catch (e) {
-      // Ignore error
+    } catch (error) {
+      // Stop recording can fail due to race conditions when user navigates away
+      // This is expected behavior and not actionable
     }
   }, [camera]);
 
@@ -528,6 +553,7 @@ const LivenessDetectionScreen = () => {
           <FaceCamera
             onFacesDetected={onFacesDetected}
             onCameraInitialized={setCamera}
+            previewRect={PREVIEW_RECT}
           />
           <NativeCircularProgress
             style={styles.circularProgress}

package/src/Screens/Static/QrCodeScanningScreen.tsx

@@ -14,8 +14,18 @@ const QrCodeScanningScreen = () => {
     const [bUrl, sId] = handleDeepLink({ url: data });
 
     if (bUrl && sId) {
-      appContext.baseUrl = bUrl;
-      appContext.identificationInfo.sessionId = sId;
+      if (appContext.setBaseUrl) {
+        appContext.setBaseUrl(bUrl);
+      } else {
+        appContext.baseUrl = bUrl;
+      }
+
+      if (appContext.setSessionId) {
+        appContext.setSessionId(sId);
+      } else {
+        appContext.identificationInfo.sessionId = sId;
+      }
+
       navigation.navigate('VerificationSessionCheckScreen' as never);
     }
   };

package/src/Screens/Static/ResultScreen.tsx

@@ -36,6 +36,16 @@ import { encryptWithAes, getSessionKey } from '../../Shared/Libs/crypto.utils';
 import Video from 'react-native-video';
 import StyledButton from '../../Shared/Components/StyledButton';
 import NativeDeviceInfo from '../../Shared/Libs/native-device-info.utils';
+import {
+  trackError,
+  trackFunnelStep,
+  useScreenTracking,
+} from '../../Shared/Libs/analytics.utils';
+import { analyticsService } from '../../Shared/Services/AnalyticsService';
+import {
+  AnalyticsEventName,
+  AnalyticsEventCategory,
+} from '../../Shared/Types/analytics.types';
 
 const ResultScreen = () => {
   const appContext = useContext(AppContext);
@@ -46,6 +56,9 @@ const ResultScreen = () => {
   const [deviceIdentifier, setDeviceIdentifier] = useState<string>('');
   const { t } = useTranslation();
 
+  // Track screen view and exit
+  useScreenTracking('result_screen');
+
   const apiUrl = useMemo(
     () => `${appContext.baseUrl}/api/app/mobile`,
     [appContext.baseUrl]
@@ -197,7 +210,7 @@ const ResultScreen = () => {
         files: [],
         progress: (res) => {
           setProgress(
-            40 + (res.totalBytesSent / res.totalBytesExpectedToSend) * 50
+            60 + (res.totalBytesSent / res.totalBytesExpectedToSend) * 30
           );
         },
       } satisfies RNFS.UploadFileOptions;
@@ -335,7 +348,7 @@ const ResultScreen = () => {
 
         const livenessVideoPath = livenessDetection.videoPath;
         if (livenessVideoPath) {
-          let videoFilePath;
+          let videoFilePath: string;
           if (Platform.OS === 'ios') {
             await RNFS.mkdir(
               `${RNFS.TemporaryDirectoryPath}/${new Date().getTime()}`
@@ -345,11 +358,44 @@ const ResultScreen = () => {
             videoFilePath = `${RNFS.TemporaryDirectoryPath}/LIVENESS_VIDEO.mp4`;
           }
           await RNFS.copyFile(livenessVideoPath, videoFilePath);
-          await VideoCompressor.compress(videoFilePath);
+
+          // Get original file size
+          const originalStats = await RNFS.stat(videoFilePath);
+          const originalSize = originalStats.size;
+
+          // Compress video with maximum compression settings
+          const compressedVideoPath = await VideoCompressor.compress(
+            videoFilePath,
+            {
+              compressionMethod: 'manual',
+              bitrate: 500000, // 500 kbps
+              maxSize: 1280, // HD 720p
+              minimumFileSizeForCompress: 0, // Always compress
+            },
+            (compressionProgress) => {
+              // Map compression progress (0-1) to main progress (40-60%)
+              setProgress(40 + compressionProgress * 20);
+            }
+          );
+
+          // Convert file:// URI to regular path for RNFS upload
+          const normalizedPath = compressedVideoPath.replace('file://', '');
+
+          // Get compressed file size and log difference
+          const compressedStats = await RNFS.stat(normalizedPath);
+          const compressedSize = compressedStats.size;
+          const compressionRatio = (
+            ((originalSize - compressedSize) / originalSize) *
+            100
+          ).toFixed(2);
+          console.log(
+            `Video compression: ${(originalSize / 1024 / 1024).toFixed(2)}MB -> ${(compressedSize / 1024 / 1024).toFixed(2)}MB (${compressionRatio}% reduction)`
+          );
+
           uploadFileOptions.files.push({
             name: 'files',
             filename: 'LIVENESS_VIDEO.mp4',
-            filepath: videoFilePath,
+            filepath: normalizedPath,
             filetype: 'video/mp4',
           });
         }
@@ -408,15 +454,44 @@ const ResultScreen = () => {
             livenessDetection
           )
         );
+        setProgress(90);
 
         await runWithRetry(() =>
           finishIdentification(identificationId, sessionKey)
         );
         setProgress(100);
         setIsSubmitting(false);
+
+        // Track successful verification completion as final funnel step
+        trackFunnelStep('Verification Completed', 5, 5, 'nfc_scanning', true).catch(() => {});
+        analyticsService.trackEvent(
+          AnalyticsEventName.VERIFICATION_SUCCESS,
+          AnalyticsEventCategory.VERIFICATION,
+          { sessionId: appContext.identificationInfo.sessionId || '' }
+        ).catch(() => {});
       } catch (error) {
         setIsSubmitting(false);
         setProgress(0);
+
+        // Track verification failure
+        const errorMessage =
+          error instanceof Error ? error.message : 'Unknown error';
+        trackError(
+          'VERIFICATION_SUBMISSION_FAILED',
+          errorMessage,
+          'result_screen',
+          'critical',
+          { recoverable: false, userAction: 'submit_verification' }
+        ).catch(() => {});
+        analyticsService.trackEvent(
+          AnalyticsEventName.VERIFICATION_FAILED,
+          AnalyticsEventCategory.VERIFICATION,
+          {
+            sessionId: appContext.identificationInfo.sessionId || '',
+            errorMessage,
+          }
+        ).catch(() => {});
+
         Alert.alert(t('general.error'), t('resultScreen.submissionFailed'));
         appContext.onError?.(t('resultScreen.submissionFailed'));
         navigationManagerRef.current?.reset();

package/src/Screens/Static/VerificationSessionCheckScreen.tsx

@@ -20,7 +20,7 @@ import {
 } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import AppContext from '../../Shared/Contexts/AppContext';
-import httpClient, { NotFoundError } from '../../Shared/Libs/http-client';
+import httpClient, { BadRequestError, NotFoundError } from '../../Shared/Libs/http-client';
 import { useTranslation } from 'react-i18next';
 import LanguageSelector from '../../Shared/Components/LanguageSelector';
 import NavigationManager, {
@@ -29,6 +29,7 @@ import NavigationManager, {
 import type { VerificationSession } from '../../Shared/Types/verificationSession';
 import StyledButton from '../../Shared/Components/StyledButton';
 import StyledTextInput from '../../Shared/Components/StyledTextInput';
+import { analyticsService } from '../../Shared/Services/AnalyticsService';
 import { useTheme } from '../../Shared/Contexts/ThemeContext';
 import LottieView from 'lottie-react-native';
 import {
@@ -40,6 +41,11 @@ import {
   SESSION_CODE_CHARSET_PATTERN,
   SESSION_CODE_VALIDATION_PATTERN,
 } from '../../Shared/Constants/validation.constants';
+import {
+  trackError,
+  trackFunnelStep,
+  useScreenTracking,
+} from '../../Shared/Libs/analytics.utils';
 
 const VerificationSessionCheckScreen = () => {
   const [sessionCode, setSessionCode] = useState('');
@@ -57,6 +63,9 @@ const VerificationSessionCheckScreen = () => {
   const theme = useTheme();
   const primaryColor = theme.colors.primary;
 
+  // Track screen view and exit
+  useScreenTracking('verification_session_check');
+
   const apiUrl = useMemo(
     () => `${appContext.baseUrl}/api/app/mobile`,
     [appContext.baseUrl]
@@ -73,17 +82,26 @@ const VerificationSessionCheckScreen = () => {
           `${apiUrl}/verification-sessions/${id}`,
           appContext.isDemoSession
             ? getSimulatedDemoData<VerificationSession | undefined, void>(
-                'GET_SESSION'
-              )
+              'GET_SESSION'
+            )
             : undefined
         );
         return response;
       } catch (error) {
         if (error instanceof NotFoundError) {
+          // User entered invalid session ID - expected user behavior, not actionable
           Alert.alert(
             t('general.error'),
             t('verificationSessionCheckScreen.noVerificationSessionFound')
           );
+        } else {
+          trackError(
+            'SESSION_CHECK_ERROR',
+            error instanceof Error ? error.message : 'Unknown error',
+            'verification_session_check',
+            'high',
+            { recoverable: false, userAction: 'check_session' }
+          );
         }
       }
     },
@@ -94,12 +112,13 @@ const VerificationSessionCheckScreen = () => {
     async (inputCode: string) => {
       try {
         appContext.isDemoSession = isDemoSession(inputCode);
+        analyticsService.setDemoSession(appContext.isDemoSession);
         const response = await httpClient.get<{ id: string }>(
           `${apiUrl}/verification-sessions?sessionCode=${inputCode.toUpperCase()}`,
           appContext.isDemoSession
             ? getSimulatedDemoData<{ id: string } | undefined, void>(
-                'GET_SESSION_BY_CODE'
-              )
+              'GET_SESSION_BY_CODE'
+            )
             : undefined
         );
 
@@ -107,13 +126,25 @@ const VerificationSessionCheckScreen = () => {
           throw new NotFoundError();
         }
 
+        // Track successful session start as funnel step
+        trackFunnelStep('Session Started', 1, 5, undefined, true);
+
         return response;
       } catch (error) {
         if (error instanceof NotFoundError) {
+          // User entered invalid session code - expected user behavior, not actionable
           Alert.alert(
             t('general.error'),
             t('verificationSessionCheckScreen.noVerificationSessionFound')
           );
+        } else {
+          trackError(
+            'SESSION_CODE_CHECK_ERROR',
+            error instanceof Error ? error.message : 'Unknown error',
+            'verification_session_check',
+            'high',
+            { recoverable: false, userAction: 'check_session_code' }
+          );
         }
       }
     },
@@ -133,11 +164,19 @@ const VerificationSessionCheckScreen = () => {
         return true;
       } catch (error) {
         if (error instanceof NotFoundError) {
+          // Session expired or invalid - expected behavior, not actionable
           Alert.alert(
             t('general.error'),
             t('verificationSessionCheckScreen.noVerificationSessionFound')
           );
         } else {
+          trackError(
+            'VERIFICATION_CODE_SEND_FAILED',
+            'Failed to send verification code',
+            'verification_session_check',
+            'high',
+            { recoverable: true, userAction: 'send_verification_code' }
+          );
           Alert.alert(
             t('general.error'),
             t('verificationSessionCheckScreen.cannotSendVerificationCode')
@@ -162,19 +201,30 @@ const VerificationSessionCheckScreen = () => {
           },
           appContext.isDemoSession
             ? getSimulatedDemoData<
-                VerificationSession | undefined,
-                { code: string }
-              >('GET_VERIFIED_SESSION', { code: verificationCode })
+              VerificationSession | undefined,
+              { code: string }
+            >('GET_VERIFIED_SESSION', { code: verificationCode })
             : undefined
         );
 
         return response;
       } catch (error) {
         if (error instanceof NotFoundError) {
+          // Session expired or invalid - expected behavior, not actionable
           Alert.alert(
             t('general.error'),
             t('verificationSessionCheckScreen.noVerificationSessionFound')
           );
+        } else if (error instanceof BadRequestError) {
+          // Wrong OTP code - expected user behavior, not actionable
+        } else {
+          trackError(
+            'VERIFIED_SESSION_CHECK_ERROR',
+            error instanceof Error ? error.message : 'Unknown error',
+            'verification_session_check',
+            'high',
+            { recoverable: false, userAction: 'check_verified_session' }
+          );
         }
       }
     },
@@ -307,8 +357,12 @@ const VerificationSessionCheckScreen = () => {
                           const session =
                             await getSessionByCode(alphanumericText);
                           if (session?.id) {
-                            appContext.identificationInfo.sessionId =
-                              session.id;
+                            if (appContext.setSessionId) {
+                              appContext.setSessionId(session.id);
+                            } else {
+                              appContext.identificationInfo.sessionId =
+                                session.id;
+                            }
                           } else {
                             setSessionCode('');
                           }
@@ -383,6 +437,7 @@ const VerificationSessionCheckScreen = () => {
                             setIsCodeSent(false);
                             navigationManagerRef.current?.navigateToNextStep();
                           } else {
+                            // User entered wrong OTP code - expected behavior, not actionable
                             appContext.onError?.('Invalid OTP code');
                             Alert.alert(
                               t('general.error'),