@trustchex/react-native-sdk 1.381.0 → 1.409.0

package/src/Screens/Static/OTPVerificationScreen.tsx

@@ -38,12 +38,15 @@ import {
   trackError,
   useScreenTracking,
 } from '../../Shared/Libs/analytics.utils';
+import { useKeepAwake } from '../../Shared/Libs/native-keep-awake.utils';
+import { useStatusBarWhiteBackground } from '../../Shared/Libs/status-bar.utils';
 
 type OTPVerificationScreenParams = {
   sessionId: string;
 };
 
 const OTPVerificationScreen = () => {
+  useKeepAwake();
   const route =
     useRoute<RouteProp<{ params: OTPVerificationScreenParams }, 'params'>>();
   const sessionId = route.params?.sessionId;
@@ -60,6 +63,9 @@ const OTPVerificationScreen = () => {
 
   useScreenTracking('otp_verification');
 
+  // Configure status bar for white background
+  useStatusBarWhiteBackground();
+
   // Guard: If sessionId is not provided, show error
   if (!sessionId) {
     return (

package/src/Screens/Static/QrCodeScanningScreen.tsx

@@ -5,11 +5,17 @@ import AppContext from '../../Shared/Contexts/AppContext';
 import QrCodeScannerCamera from '../../Shared/Components/QrCodeScannerCamera';
 import { useNavigation } from '@react-navigation/native';
 import { handleDeepLink } from '../../Shared/Libs/deeplink.utils';
+import { useKeepAwake } from '../../Shared/Libs/native-keep-awake.utils';
+import { useStatusBarWhiteBackground } from '../../Shared/Libs/status-bar.utils';
 
 const QrCodeScanningScreen = () => {
+  useKeepAwake();
   const appContext = React.useContext(AppContext);
   const navigation = useNavigation();
 
+  // Configure status bar for white background
+  useStatusBarWhiteBackground();
+
   const onQrCodeScanned = (data: string) => {
     const [bUrl, sId] = handleDeepLink({ url: data });
 
@@ -26,7 +32,7 @@ const QrCodeScanningScreen = () => {
         appContext.identificationInfo.sessionId = sId;
       }
 
-      navigation.navigate('VerificationSessionCheckScreen' as never);
+      navigation.goBack();
     }
   };
 

package/src/Screens/Static/ResultScreen.tsx

@@ -27,6 +27,7 @@ import type {
   ScannedIdentityDocument,
 } from '../../Shared/Types/identificationInfo';
 import { runWithRetry } from '../../Shared/Libs/promise.utils';
+import { useStatusBarWhiteBackground } from '../../Shared/Libs/status-bar.utils';
 import NavigationManager, {
   type NavigationManagerRef,
 } from '../../Shared/Components/NavigationManager';
@@ -61,6 +62,9 @@ const ResultScreen = () => {
   // Track screen view and exit
   useScreenTracking('result_screen');
 
+  // Configure status bar for white background
+  useStatusBarWhiteBackground();
+
   const formatDate = useCallback((dateStr?: string | null) => {
     if (!dateStr) return '';
 
@@ -97,7 +101,7 @@ const ResultScreen = () => {
   );
 
   useEffect(() => {
-    if (appContext.isDemoSession) {
+    if (appContext.isDemoSession || appContext.isTestVideoSession) {
       setShouldShowDemoData(true);
       // Generate device identifier for demo
       NativeDeviceInfo.generateHumanReadableIdentifier().then(
@@ -107,6 +111,7 @@ const ResultScreen = () => {
   }, [
     appContext.identificationInfo.identificationId,
     appContext.isDemoSession,
+    appContext.isTestVideoSession,
   ]);
 
   const createIdentification = useCallback(
@@ -227,8 +232,17 @@ const ResultScreen = () => {
     async (
       identificationId: string,
       scannedIdentityDocument?: ScannedIdentityDocument,
-      livenessDetection?: LivenessDetection
+      livenessDetection?: LivenessDetection,
+      skipIfAlreadyUploaded?: boolean
     ) => {
+      // Skip media upload if already uploaded during video call
+      if (skipIfAlreadyUploaded) {
+        console.log(
+          '[ResultScreen] Media already uploaded during video call, skipping'
+        );
+        return;
+      }
+
       const uploadFileOptions: RNFS.UploadFileOptions = {
         toUrl: `${apiUrl}/identifications/${identificationId}/media`,
         method: 'POST',
@@ -432,11 +446,16 @@ const ResultScreen = () => {
           throw new Error('IdentificationId not found');
         }
 
+        const alreadyUploaded =
+          !!identificationInfo.mediaUploadedDuringVideoCall;
+
         const sessionKey = await runWithRetry(() =>
           getSessionKey(apiUrl, appContext.identificationInfo.sessionId)
         );
 
-        await runWithRetry(() => createIdentification(identificationId));
+        if (!alreadyUploaded) {
+          await runWithRetry(() => createIdentification(identificationId));
+        }
         setProgress(20);
 
         await runWithRetry(() =>
@@ -444,29 +463,32 @@ const ResultScreen = () => {
         );
         setProgress(30);
 
-        const scannedIdentityDocument = identificationInfo.scannedDocument;
-        if (
-          scannedIdentityDocument &&
-          scannedIdentityDocument.documentType !== 'UNKNOWN'
-        ) {
+        if (!alreadyUploaded) {
+          const scannedIdentityDocument = identificationInfo.scannedDocument;
+          if (
+            scannedIdentityDocument &&
+            scannedIdentityDocument.documentType !== 'UNKNOWN'
+          ) {
+            await runWithRetry(() =>
+              submitIdentificationDocument(
+                identificationId,
+                scannedIdentityDocument,
+                sessionKey
+              )
+            );
+          }
+          setProgress(40);
+
+          const livenessDetection = identificationInfo.livenessDetection;
           await runWithRetry(() =>
-            submitIdentificationDocument(
+            uploadIdentificationMedia(
               identificationId,
               scannedIdentityDocument,
-              sessionKey
+              livenessDetection,
+              false
             )
           );
         }
-        setProgress(40);
-
-        const livenessDetection = identificationInfo.livenessDetection;
-        await runWithRetry(() =>
-          uploadIdentificationMedia(
-            identificationId,
-            scannedIdentityDocument,
-            livenessDetection
-          )
-        );
         setProgress(90);
 
         await runWithRetry(() =>
@@ -533,13 +555,26 @@ const ResultScreen = () => {
   );
 
   useEffect(() => {
-    if (appContext.identificationInfo && !appContext.isDemoSession) {
+    if (
+      appContext.identificationInfo &&
+      !appContext.isDemoSession &&
+      !appContext.isTestVideoSession
+    ) {
       submit(appContext.identificationInfo);
     }
-  }, [appContext.identificationInfo, appContext.isDemoSession, submit]);
+  }, [
+    appContext.identificationInfo,
+    appContext.isDemoSession,
+    appContext.isTestVideoSession,
+    submit,
+  ]);
 
   useEffect(() => {
-    if (progress === 100 && !appContext.isDemoSession) {
+    if (
+      progress === 100 &&
+      !appContext.isDemoSession &&
+      !appContext.isTestVideoSession
+    ) {
       setTimeout(() => {
         appContext.onCompleted?.();
         navigationManagerRef.current?.reset();

package/src/Screens/Static/VerificationSessionCheckScreen.tsx

@@ -36,7 +36,7 @@ import {
   getSimulatedDemoData,
   isDemoSession,
 } from '../../Shared/Libs/demo.utils';
-import { useNavigation, useFocusEffect } from '@react-navigation/native';
+import { useNavigation } from '@react-navigation/native';
 import {
   SESSION_CODE_CHARSET_PATTERN,
   SESSION_CODE_VALIDATION_PATTERN,
@@ -46,16 +46,17 @@ import {
   trackFunnelStep,
   useScreenTracking,
 } from '../../Shared/Libs/analytics.utils';
+import { useStatusBarWhiteBackground } from '../../Shared/Libs/status-bar.utils';
 
 const VerificationSessionCheckScreen = () => {
   const [sessionCode, setSessionCode] = useState('');
   const [isCheckingSession, setIsCheckingSession] = useState(false);
   const isCheckingSessionRef = useRef(false);
+  const checkedSessionIdRef = useRef('');
   const appContext = useContext(AppContext);
   const { t } = useTranslation();
   const navigationManagerRef = React.useRef<NavigationManagerRef>(null);
   const navigation = useNavigation();
-  const initialized = useRef(false);
   const insets = useSafeAreaInsets();
   const theme = useTheme();
   const primaryColor = theme.colors.primary;
@@ -63,6 +64,9 @@ const VerificationSessionCheckScreen = () => {
   // Track screen view and exit
   useScreenTracking('verification_session_check');
 
+  // Configure status bar for white background
+  useStatusBarWhiteBackground();
+
   const apiUrl = useMemo(
     () => `${appContext.baseUrl}/api/app/mobile`,
     [appContext.baseUrl]
@@ -86,13 +90,7 @@ const VerificationSessionCheckScreen = () => {
         );
         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 {
+        if (!(error instanceof NotFoundError)) {
           trackError(
             'SESSION_CHECK_ERROR',
             error instanceof Error ? error.message : 'Unknown error',
@@ -101,9 +99,10 @@ const VerificationSessionCheckScreen = () => {
             { recoverable: false, userAction: 'check_session' }
           );
         }
+        throw error;
       }
     },
-    [apiUrl, appContext.isDemoSession, t]
+    [apiUrl, appContext.isDemoSession]
   );
 
   const getSessionByCode = useCallback(
@@ -157,72 +156,59 @@ const VerificationSessionCheckScreen = () => {
     [navigation]
   );
 
-  // Reset initialized flag when screen is focused and sessionId is empty (after reset)
-  useFocusEffect(
-    useCallback(() => {
-      if (!appContext.identificationInfo.sessionId) {
-        initialized.current = false;
-        isCheckingSessionRef.current = false;
-      }
-    }, [appContext.identificationInfo.sessionId])
-  );
+  const getSessionRef = useRef(getSession);
+  getSessionRef.current = getSession;
+  const navigateToOTPScreenRef = useRef(navigateToOTPScreen);
+  navigateToOTPScreenRef.current = navigateToOTPScreen;
+  const appContextRef = useRef(appContext);
+  appContextRef.current = appContext;
 
   useEffect(() => {
-    // Only run this effect if sessionId exists AND we're not currently checking a session
-    // This prevents race condition when session code is entered
-    if (
-      !initialized.current &&
-      appContext.identificationInfo.sessionId &&
-      !isCheckingSessionRef.current
-    ) {
-      initialized.current = true;
-      isCheckingSessionRef.current = true;
-      setIsCheckingSession(true);
-      getSession(appContext.identificationInfo.sessionId)
-        .then((session) => {
-          if (!session) {
-            // Session not found - clear the sessionId and reset flags to allow retry
-            Alert.alert(
-              t('general.error'),
-              t('verificationSessionCheckScreen.noVerificationSessionFound')
-            );
-            appContext.identificationInfo.sessionId = '';
-            if (appContext.setSessionId) {
-              appContext.setSessionId('');
-            }
-            initialized.current = false;
-            return;
-          }
-
-          appContext.workflowSteps = session.workflowSteps;
-          if (session.branding) {
-            appContext.branding = appContext.branding || session.branding;
+    const sid = appContext.identificationInfo.sessionId;
+    if (!sid || checkedSessionIdRef.current === sid) {
+      return;
+    }
+    checkedSessionIdRef.current = sid;
+    isCheckingSessionRef.current = true;
+    setIsCheckingSession(true);
+    getSessionRef
+      .current(sid)
+      .then((session) => {
+        const ctx = appContextRef.current;
+        ctx.workflowSteps = session.workflowSteps;
+        if (session.branding) {
+          ctx.branding = ctx.branding || session.branding;
+        }
+        if (session.sendOTP) {
+          navigateToOTPScreenRef.current(session.id);
+        } else {
+          if (session.identificationId) {
+            ctx.identificationInfo.identificationId = session.identificationId;
           }
+          navigationManagerRef.current?.navigateToNextStep();
+        }
+      })
+      .catch(() => {
+        Alert.alert(
+          t('general.error'),
+          t('verificationSessionCheckScreen.noVerificationSessionFound')
+        );
+        checkedSessionIdRef.current = '';
+        const ctx = appContextRef.current;
+        if (ctx.setSessionId) {
+          ctx.setSessionId('');
+        }
+      })
+      .finally(() => {
+        isCheckingSessionRef.current = false;
+        setIsCheckingSession(false);
+      });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [appContext.identificationInfo.sessionId]);
 
-          if (session.sendOTP) {
-            navigateToOTPScreen(session.id);
-          } else {
-            if (session.identificationId) {
-              appContext.identificationInfo.identificationId =
-                session.identificationId;
-            }
-            navigationManagerRef.current?.navigateToNextStep();
-          }
-        })
-        .finally(() => {
-          setTimeout(() => {
-            isCheckingSessionRef.current = false;
-            setIsCheckingSession(false);
-          }, 1000);
-        });
-    }
-  }, [
-    appContext,
-    appContext.identificationInfo.sessionId,
-    getSession,
-    navigateToOTPScreen,
-    t,
-  ]);
+  if (!appContext || !appContext.baseUrl) {
+    return null;
+  }
 
   return (
     <SafeAreaView style={styles.safeAreaContainer}>

package/src/Shared/Animations/video-call.json

@@ -0,0 +1 @@
+{"v":"5.7.3","fr":30,"ip":0,"op":41,"w":600,"h":600,"nm":"Phone Call","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Call Icon","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[293.084,310.786,0],"ix":2},"a":{"a":0,"k":[1371.347,-543.458,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[28,28,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":20,"s":[25,25,100]},{"t":40,"s":[28,28,100]}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-22.59,22.938],[0,0],[23.373,23.448],[0,0],[23.186,-22.195],[0,0],[25.1,60.946],[0,0],[22.137,23.256],[0.601,0.601],[23.496,-22.664],[0,0],[-157.804,5.059]],"o":[[0,0],[23.373,-23.448],[-0.601,-0.601],[-23.249,-22.13],[0,0],[-60.902,-25.206],[0,0],[22.213,-23.184],[0,0],[-23.009,-23.158],[0,0],[-131.678,152.765],[32.193,0.187]],"v":[[1568.371,-346.481],[1586.008,-366.813],[1586.008,-451.645],[1538.775,-488.121],[1455.803,-488.005],[1418.862,-456.878],[1284.51,-591.463],[1315.52,-628.288],[1315.656,-711.279],[1279.141,-758.453],[1195.297,-759.345],[1173.008,-739.964],[1482.685,-310.897]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[0,10.704],[64.224,0],[0,-10.704],[-10.704,0],[0,-42.816],[-10.704,0]],"o":[[0,-64.224],[-10.704,0],[0,10.704],[42.816,0],[0,10.704],[10.704,0]],"v":[[1526.061,-582.237],[1409.772,-698.526],[1390.391,-679.145],[1409.772,-659.763],[1487.298,-582.237],[1506.679,-562.856]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ind":2,"ty":"sh","ix":3,"ks":{"a":0,"k":{"i":[[10.704,0],[0,10.704],[85.597,0.085],[0,10.704],[-10.704,0],[-0.117,-106.992]],"o":[[-10.704,0],[-0.085,-85.597],[-10.704,0],[0,-10.704],[106.992,0.117],[0,10.704]],"v":[[1584.205,-562.856],[1564.824,-582.237],[1409.772,-737.289],[1390.391,-756.67],[1409.772,-776.052],[1603.587,-582.237]],"c":true},"ix":2},"nm":"Path 3","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":4,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":45,"st":-8,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Background Circle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[300,300,0],"ix":2},"a":{"a":0,"k":[1397.949,-584.944,0],"ix":1},"s":{"a":0,"k":[27,27,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,-262.123],[262.123,0],[0,262.123],[-262.123,0]],"o":[[0,262.123],[-262.123,0],[0,-262.123],[262.123,0]],"v":[[1872.564,-584.944],[1397.949,-110.329],[923.334,-584.944],[1397.949,-1059.559]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.117700554343,0.127342568192,0.138823505476,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":45,"st":-8,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Small Circle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":210,"ix":10},"p":{"a":0,"k":[301,301,0],"ix":2},"a":{"a":0,"k":[-7,-71,0],"ix":1},"s":{"a":0,"k":[70,70,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[426,426],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":22.03,"s":[0]},{"t":39.5470890812688,"s":[100]}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":10.769,"s":[0]},{"t":35.7941593937688,"s":[100]}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false},{"ty":"st","c":{"a":0,"k":[0.117647066303,0.125490196078,0.137254901961,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":8,"ix":5},"lc":2,"lj":2,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[-7,-71],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":10.7687687687688,"op":45,"st":10.7687687687688,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Medium Circle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":119,"ix":10},"p":{"a":0,"k":[301,301,0],"ix":2},"a":{"a":0,"k":[-7,-71,0],"ix":1},"s":{"a":0,"k":[85,85,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[426,426],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":12.02,"s":[0]},{"t":29.5370790712588,"s":[100]}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0.759,"s":[0]},{"t":25.7841493837588,"s":[100]}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false},{"ty":"st","c":{"a":0,"k":[0.117647066303,0.125490196078,0.137254901961,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":7,"ix":5},"lc":2,"lj":2,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[-7,-71],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0.75875875875876,"op":45,"st":0.75875875875876,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Large Circle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[301,301,0],"ix":2},"a":{"a":0,"k":[-7,-71,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[426,426],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":15.774,"s":[0]},{"t":33.2908328250125,"s":[100]}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":4.513,"s":[0]},{"t":29.5379031375125,"s":[100]}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false},{"ty":"st","c":{"a":0,"k":[0.117647066303,0.125490196078,0.137254901961,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":6,"ix":5},"lc":2,"lj":2,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[-7,-71],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":4.51251251251251,"op":45,"st":4.51251251251251,"bm":0}],"markers":[]}

package/src/Shared/Components/DebugNavigationPanel.tsx

@@ -6,6 +6,7 @@ import {
   StyleSheet,
   Platform,
   Switch,
+  ActivityIndicator,
 } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -13,10 +14,13 @@ import AppContext from '../Contexts/AppContext';
 import { getSimulatedDemoData } from '../Libs/demo.utils';
 import type { VerificationSession } from '../Types/verificationSession';
 
+const DEV_BASE_URL = 'https://192.168.0.171:3000';
+
 type ScreenOption = {
   screen: string;
   label: string;
   icon: string;
+  isDebug?: boolean;
   hasOptions?: boolean;
   hasDocumentTypeOption?: boolean;
   setupDemo?: () => void;
@@ -43,6 +47,8 @@ const DebugNavigationPanel = () => {
   const [voiceGuidanceEnabled, setVoiceGuidanceEnabled] = useState(true);
   const [allowIdCard, setAllowIdCard] = useState(true);
   const [allowPassport, setAllowPassport] = useState(true);
+  const [isConnectingVideoCall, setIsConnectingVideoCall] = useState(false);
+  const [videoCallError, setVideoCallError] = useState<string | null>(null);
   const navigation = useNavigation();
   const appContext = useContext(AppContext);
   const insets = useSafeAreaInsets();
@@ -194,6 +200,13 @@ const DebugNavigationPanel = () => {
       screen: 'MRZTestScreen',
       label: 'MRZ Test',
       icon: ICONS.BUG_REPORT,
+      isDebug: true,
+    },
+    {
+      screen: 'BarcodeTestScreen',
+      label: 'Barcode Test',
+      icon: ICONS.BUG_REPORT,
+      isDebug: true,
     },
   ];
 
@@ -215,9 +228,67 @@ const DebugNavigationPanel = () => {
     [navigation]
   );
 
-  const jumpToScreen = useCallback(() => {
-    if (!selectedScreen) return;
+  const handleVideoCallTest = useCallback(async () => {
+    setIsConnectingVideoCall(true);
+    setVideoCallError(null);
+    try {
+      const fallbackUrl = (appContext.baseUrl ?? '').replace(/\/$/, '');
+      let response: Response;
+      let usedBaseUrl = DEV_BASE_URL;
+      try {
+        response = await fetch(
+          `${DEV_BASE_URL}/api/test/video-sessions/latest`
+        );
+      } catch {
+        usedBaseUrl = fallbackUrl;
+        response = await fetch(`${fallbackUrl}/api/test/video-sessions/latest`);
+      }
+      const text = await response.text();
+      let data: any;
+      try {
+        data = JSON.parse(text);
+      } catch {
+        throw new Error(
+          `Server returned non-JSON (${response.status}): ${text.slice(0, 120)}`
+        );
+      }
+      if (!response.ok || !data.success) {
+        throw new Error(data.message || 'No active test session found');
+      }
+      // Point SDK at the server where the test session lives.
+      // Do NOT call setBaseUrl (state setter) — it triggers a useMemo rebuild in
+      // Trustchex.tsx that resets identificationInfo to an empty object before the
+      // screen can render. Direct mutation is sufficient for the test flow.
+      appContext.baseUrl = usedBaseUrl;
+      appContext.isTestVideoSession = true;
+      appContext.identificationInfo.identificationId = data.identificationId;
+      appContext.identificationInfo.videoSessionId = data.videoSessionId;
+      appContext.identificationInfo.sessionId = data.verificationSessionId;
+
+      // Set up a mini workflow: eID scan → video call
+      const eidStep = {
+        type: 'IDENTITY_DOCUMENT_EID_SCAN' as const,
+        required: false,
+        data: { voiceGuidanceActive: false },
+      };
+      const videoCallStep = {
+        type: 'VIDEO_CALL' as const,
+        required: true,
+        data: {},
+      };
+      appContext.workflowSteps = [eidStep, videoCallStep];
+      appContext.currentWorkflowStep = eidStep;
+
+      (navigation as any).navigate('IdentityDocumentEIDScanningScreen');
+      setIsExpanded(false);
+    } catch (err: any) {
+      setVideoCallError(err.message || 'Failed to connect');
+    } finally {
+      setIsConnectingVideoCall(false);
+    }
+  }, [appContext, navigation]);
 
+  const jumpToScreen = useCallback(() => {
     // Validate document type selection for document scanning screens
     if (
       selectedScreen.hasDocumentTypeOption &&
@@ -336,16 +407,57 @@ const DebugNavigationPanel = () => {
               </View>
             </View>
           ) : (
-            screens.map((screen) => (
+            <>
+              {screens
+                .filter((s) => !s.isDebug)
+                .map((screen) => (
+                  <TouchableOpacity
+                    key={screen.screen}
+                    style={styles.screenButton}
+                    onPress={() => selectScreen(screen)}
+                  >
+                    <Text style={styles.screenIcon}>{screen.icon}</Text>
+                    <Text style={styles.screenLabel}>{screen.label}</Text>
+                  </TouchableOpacity>
+                ))}
+              <View style={styles.sectionDivider}>
+                <View style={styles.sectionDividerLine} />
+                <Text style={styles.sectionDividerLabel}>DEBUG TOOLS</Text>
+                <View style={styles.sectionDividerLine} />
+              </View>
+              {screens
+                .filter((s) => s.isDebug)
+                .map((screen) => (
+                  <TouchableOpacity
+                    key={screen.screen}
+                    style={styles.debugScreenButton}
+                    onPress={() => selectScreen(screen)}
+                  >
+                    <Text style={styles.screenIcon}>{screen.icon}</Text>
+                    <Text style={styles.debugScreenLabel}>{screen.label}</Text>
+                  </TouchableOpacity>
+                ))}
               <TouchableOpacity
-                key={screen.screen}
-                style={styles.screenButton}
-                onPress={() => selectScreen(screen)}
+                style={[
+                  styles.videoCallTestButton,
+                  isConnectingVideoCall && styles.videoCallTestButtonDisabled,
+                ]}
+                onPress={handleVideoCallTest}
+                disabled={isConnectingVideoCall}
               >
-                <Text style={styles.screenIcon}>{screen.icon}</Text>
-                <Text style={styles.screenLabel}>{screen.label}</Text>
+                {isConnectingVideoCall ? (
+                  <ActivityIndicator size="small" color="#4CAF50" />
+                ) : (
+                  <Text style={styles.screenIcon}>📹</Text>
+                )}
+                <Text style={styles.videoCallTestLabel}>
+                  {isConnectingVideoCall ? 'Connecting...' : 'Video Call Test'}
+                </Text>
               </TouchableOpacity>
-            ))
+              {videoCallError && (
+                <Text style={styles.videoCallTestError}>{videoCallError}</Text>
+              )}
+            </>
           )}
         </View>
       )}
@@ -518,6 +630,70 @@ const styles = StyleSheet.create({
   goButtonTextDisabled: {
     color: '#CCCCCC',
   },
+  sectionDivider: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginTop: 4,
+    marginBottom: 6,
+    gap: 6,
+  },
+  sectionDividerLine: {
+    flex: 1,
+    height: 1,
+    backgroundColor: 'rgba(255, 167, 38, 0.4)',
+  },
+  sectionDividerLabel: {
+    color: '#FFA726',
+    fontSize: 9,
+    fontWeight: 'bold',
+    letterSpacing: 1,
+  },
+  debugScreenButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    backgroundColor: 'rgba(255, 167, 38, 0.15)',
+    borderWidth: 1,
+    borderColor: 'rgba(255, 167, 38, 0.4)',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    borderRadius: 4,
+    marginBottom: 6,
+  },
+  debugScreenLabel: {
+    color: '#FFA726',
+    fontSize: 12,
+    fontWeight: '500',
+    flex: 1,
+  },
+  videoCallTestButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    backgroundColor: 'rgba(76, 175, 80, 0.15)',
+    borderWidth: 1,
+    borderColor: 'rgba(76, 175, 80, 0.5)',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    borderRadius: 4,
+    marginBottom: 6,
+    gap: 8,
+  },
+  videoCallTestButtonDisabled: {
+    opacity: 0.5,
+  },
+  videoCallTestLabel: {
+    color: '#4CAF50',
+    fontSize: 12,
+    fontWeight: '600',
+    flex: 1,
+  },
+  videoCallTestError: {
+    color: '#FF5252',
+    fontSize: 10,
+    marginBottom: 6,
+    paddingHorizontal: 4,
+  },
 });
 
 export default DebugNavigationPanel;