@trustchex/react-native-sdk 1.334.0 → 1.354.0

package/lib/module/Screens/Static/VerificationSessionCheckScreen.js

@@ -4,7 +4,7 @@ import React, { useCallback, useContext, useEffect, useMemo, useRef, useState }
 import { SafeAreaView, Text, StyleSheet, Alert, View, Image, Dimensions, KeyboardAvoidingView, Platform, ScrollView } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import AppContext from "../../Shared/Contexts/AppContext.js";
-import httpClient, { BadRequestError, NotFoundError, TooManyRequestsError } from "../../Shared/Libs/http-client.js";
+import httpClient, { NotFoundError } from "../../Shared/Libs/http-client.js";
 import { useTranslation } from 'react-i18next';
 import LanguageSelector from "../../Shared/Components/LanguageSelector.js";
 import NavigationManager from "../../Shared/Components/NavigationManager.js";
@@ -20,11 +20,8 @@ import { trackError, trackFunnelStep, useScreenTracking } from "../../Shared/Lib
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const VerificationSessionCheckScreen = () => {
   const [sessionCode, setSessionCode] = useState('');
-  const [code, setCode] = useState('');
   const [isCheckingSession, setIsCheckingSession] = useState(false);
-  const [isSendAgainEnabled, setIsSendAgainEnabled] = useState(false);
-  const [isCodeSent, setIsCodeSent] = useState(false);
-  const [isCodeGettingVerified, setIsCodeGettingVerified] = useState(false);
+  const isCheckingSessionRef = useRef(false);
   const appContext = useContext(AppContext);
   const {
     t
@@ -42,9 +39,10 @@ const VerificationSessionCheckScreen = () => {
   const validateSessionCode = useCallback(value => {
     return SESSION_CODE_VALIDATION_PATTERN.test(value.toUpperCase());
   }, []);
-  const getSession = useCallback(async id => {
+  const getSession = useCallback(async (id, isDemoMode) => {
+    const isDemo = isDemoMode ?? appContext.isDemoSession;
     try {
-      const response = await httpClient.get(`${apiUrl}/verification-sessions/${id}`, appContext.isDemoSession ? getSimulatedDemoData('GET_SESSION') : undefined);
+      const response = await httpClient.get(`${apiUrl}/verification-sessions/${id}`, isDemo ? getSimulatedDemoData('GET_SESSION') : undefined);
       return response;
     } catch (error) {
       if (error instanceof NotFoundError) {
@@ -60,9 +58,10 @@ const VerificationSessionCheckScreen = () => {
   }, [apiUrl, appContext.isDemoSession, t]);
   const getSessionByCode = useCallback(async inputCode => {
     try {
-      appContext.isDemoSession = isDemoSession(inputCode);
-      analyticsService.setDemoSession(appContext.isDemoSession);
-      const response = await httpClient.get(`${apiUrl}/verification-sessions?sessionCode=${inputCode.toUpperCase()}`, appContext.isDemoSession ? getSimulatedDemoData('GET_SESSION_BY_CODE') : undefined);
+      const isDemoMode = isDemoSession(inputCode);
+      appContext.setIsDemoSession?.(isDemoMode);
+      analyticsService.setDemoSession(isDemoMode);
+      const response = await httpClient.get(`${apiUrl}/verification-sessions?sessionCode=${inputCode.toUpperCase()}`, isDemoMode ? getSimulatedDemoData('GET_SESSION_BY_CODE') : undefined);
       if (!response || !response.id) {
         throw new NotFoundError();
       }
@@ -82,68 +81,17 @@ const VerificationSessionCheckScreen = () => {
       }
     }
   }, [apiUrl, appContext, t]);
-  const sendVerificationCode = useCallback(async sessionId => {
-    try {
-      await httpClient.post(`${apiUrl}/verification-sessions/${sessionId}`, {}, appContext.isDemoSession ? getSimulatedDemoData('SEND_VERIFICATION_CODE') : undefined);
-      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 if (error instanceof TooManyRequestsError) {
-        // Code was already sent recently - this is expected behavior
-        // Return true since the code was already sent
-        return true;
-      } 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'));
-      }
-    }
-    return false;
-  }, [apiUrl, appContext.isDemoSession, t]);
-  const getVerifiedSession = useCallback(async (sessionId, verificationCode) => {
-    try {
-      const response = await httpClient.post(`${apiUrl}/verification-sessions/${sessionId}`, {
-        code: verificationCode
-      }, appContext.isDemoSession ? getSimulatedDemoData('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'
-        });
-      }
-    }
-  }, [apiUrl, appContext.isDemoSession, t]);
-  const sendOTPCode = useCallback(async sessionId => {
-    if (!sessionId) {
-      return false;
-    }
-    const isSent = await sendVerificationCode(sessionId);
-    if (!isSent) {
-      return false;
-    }
-    setIsSendAgainEnabled(false);
-    setTimeout(() => {
-      setIsSendAgainEnabled(true);
-    }, 3 * 60 * 1000);
-    setIsCodeSent(true);
-    return true;
-  }, [sendVerificationCode]);
+  const navigateToOTPScreen = useCallback(sessionId => {
+    navigation.navigate('OTPVerificationScreen', {
+      sessionId
+    });
+  }, [navigation]);
   useEffect(() => {
-    if (!initialized.current && appContext.identificationInfo.sessionId) {
+    // 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 => {
         appContext.workflowSteps = session?.workflowSteps;
@@ -151,18 +99,21 @@ const VerificationSessionCheckScreen = () => {
           appContext.branding = appContext.branding || session.branding;
         }
         if (session?.sendOTP) {
-          return sendOTPCode(session.id);
-        } else if (session?.identificationId) {
-          appContext.identificationInfo.identificationId = session?.identificationId;
+          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, sendOTPCode]);
+  }, [appContext, appContext.identificationInfo.sessionId, getSession, navigateToOTPScreen]);
   return /*#__PURE__*/_jsx(SafeAreaView, {
     style: styles.safeAreaContainer,
     children: /*#__PURE__*/_jsx(KeyboardAvoidingView, {
@@ -187,13 +138,13 @@ const VerificationSessionCheckScreen = () => {
               source: require('../../Shared/Assets/trustchex-logo-black.png'),
               style: styles.trustchexLogo
             })
-          }), isCheckingSession || isCodeGettingVerified ? /*#__PURE__*/_jsx(LottieView, {
+          }), isCheckingSession ? /*#__PURE__*/_jsx(LottieView, {
             source: require('../../Shared/Animations/loading.json'),
             style: styles.loadingAnimation,
             autoPlay: true,
             loop: true,
             resizeMode: "cover"
-          }) : !isCodeSent ? /*#__PURE__*/_jsxs(_Fragment, {
+          }) : /*#__PURE__*/_jsxs(_Fragment, {
             children: [/*#__PURE__*/_jsx(Text, {
               style: styles.mainText,
               children: t('verificationSessionCheckScreen.mainText')
@@ -211,21 +162,37 @@ const VerificationSessionCheckScreen = () => {
                   setSessionCode(alphanumericText);
                   if (validateSessionCode(alphanumericText) && alphanumericText.length === 8) {
                     try {
+                      isCheckingSessionRef.current = true;
                       setIsCheckingSession(true);
-                      const session = await getSessionByCode(alphanumericText);
-                      if (session?.id) {
+                      const isDemoMode = isDemoSession(alphanumericText);
+                      const sessionResponse = await getSessionByCode(alphanumericText);
+                      if (sessionResponse?.id) {
                         if (appContext.setSessionId) {
-                          appContext.setSessionId(session.id);
+                          appContext.setSessionId(sessionResponse.id);
                         } else {
-                          appContext.identificationInfo.sessionId = session.id;
+                          appContext.identificationInfo.sessionId = sessionResponse.id;
+                        }
+                        const session = await getSession(sessionResponse.id, isDemoMode);
+                        appContext.workflowSteps = session?.workflowSteps;
+                        if (session?.branding) {
+                          appContext.branding = appContext.branding || session.branding;
+                        }
+                        if (session?.sendOTP) {
+                          navigateToOTPScreen(sessionResponse.id);
+                        } else {
+                          if (session?.identificationId) {
+                            appContext.identificationInfo.identificationId = session?.identificationId;
+                          }
+                          navigationManagerRef.current?.navigateToNextStep();
                         }
                       } else {
                         setSessionCode('');
                       }
-                    } catch {
+                    } catch (error) {
                       setSessionCode('');
                     } finally {
                       setTimeout(() => {
+                        isCheckingSessionRef.current = false;
                         setIsCheckingSession(false);
                       }, 1000);
                     }
@@ -254,53 +221,6 @@ const VerificationSessionCheckScreen = () => {
               },
               children: t('verificationSessionCheckScreen.scanQRCode')
             })]
-          }) : /*#__PURE__*/_jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx(Text, {
-              style: styles.mainText,
-              children: t('verificationSessionCheckScreen.codeText')
-            }), /*#__PURE__*/_jsx(StyledTextInput, {
-              autoFocus: true,
-              placeholder: "",
-              borderColor: primaryColor,
-              focusedBorderColor: primaryColor,
-              inputStyle: styles.otpCodeTextInput,
-              keyboardType: "number-pad",
-              textContentType: "oneTimeCode",
-              autoComplete: "sms-otp",
-              maxLength: 6,
-              onChangeText: text => {
-                const numericText = text.replace(/[^0-9]/g, '');
-                if (numericText.length <= 6) {
-                  setCode(numericText);
-                  if (numericText.length === 6) {
-                    (async () => {
-                      setIsCodeGettingVerified(true);
-                      const verifiedSession = await getVerifiedSession(appContext.identificationInfo.sessionId, numericText);
-                      if (verifiedSession?.identificationId) {
-                        appContext.identificationInfo.identificationId = verifiedSession?.identificationId;
-                        setCode('');
-                        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'), t('verificationSessionCheckScreen.codeError'));
-                        setCode('');
-                        setIsCodeGettingVerified(false);
-                      }
-                    })();
-                  }
-                }
-              },
-              value: code
-            }), /*#__PURE__*/_jsx(StyledButton, {
-              mode: "contained",
-              disabled: !isSendAgainEnabled,
-              onPress: () => {
-                sendOTPCode(appContext.identificationInfo.sessionId);
-              },
-              children: t('verificationSessionCheckScreen.sendCodeAgain')
-            })]
           })]
         }), appContext.branding.logoUrl && /*#__PURE__*/_jsxs(View, {
           style: [styles.footer, {
@@ -428,12 +348,6 @@ const styles = StyleSheet.create({
     letterSpacing: 0,
     textAlign: 'center',
     textTransform: 'none'
-  },
-  otpCodeTextInput: {
-    fontWeight: '800',
-    fontSize: 28,
-    textAlign: 'center',
-    letterSpacing: 8
   }
 });
 export default VerificationSessionCheckScreen;

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

@@ -0,0 +1,252 @@
+"use strict";
+
+import React, { useCallback, useContext, useState } from 'react';
+import { View, Text, TouchableOpacity, StyleSheet, Platform } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import AppContext from "../Contexts/AppContext.js";
+import { getSimulatedDemoData } from "../Libs/demo.utils.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// Icon mapping matching Flutter SDK Material Icons
+const ICONS = {
+  LOGIN: '🔑',
+  // Icons.login
+  HANDSHAKE: '🤝',
+  // Icons.handshake
+  CREDIT_CARD: '💳',
+  // Icons.credit_card
+  NFC: '📡',
+  // Icons.nfc
+  FACE: '👤',
+  // Icons.face
+  CHECK_CIRCLE: '✅',
+  // Icons.check_circle
+  BUG_REPORT: '🔧',
+  // Icons.bug_report (using wrench for debug)
+  PHONE: '📱' // Icons.phone
+};
+const DebugNavigationPanel = () => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const navigation = useNavigation();
+  const appContext = useContext(AppContext);
+  const insets = useSafeAreaInsets();
+  const setupDemoSession = useCallback((setDebugFlag = false) => {
+    appContext.setIsDemoSession?.(true);
+    appContext.identificationInfo.sessionId = 'demo-verification-id';
+    appContext.identificationInfo.identificationId = 'demo-identification-id';
+    appContext.isDebugNavigated = setDebugFlag;
+
+    // Populate workflow steps with demo data (including contract URLs)
+    const demoSession = getSimulatedDemoData('GET_SESSION');
+    appContext.workflowSteps = demoSession.workflowSteps;
+  }, [appContext]);
+  const screens = [{
+    screen: 'VerificationSessionCheckScreen',
+    label: 'Session Check',
+    icon: ICONS.LOGIN
+  }, {
+    screen: 'OTPVerificationScreen',
+    label: 'OTP',
+    icon: ICONS.PHONE,
+    setupDemo: () => {
+      setupDemoSession(true);
+    },
+    params: {
+      sessionId: 'demo-verification-id'
+    }
+  }, {
+    screen: 'ContractAcceptanceScreen',
+    label: 'Consent',
+    icon: ICONS.HANDSHAKE,
+    setupDemo: () => {
+      setupDemoSession(true);
+      // Set current workflow step to contract acceptance so demo contract URLs are loaded
+      const contractStep = appContext.workflowSteps?.find(step => step.type === 'CONTRACT_ACCEPTANCE');
+      if (contractStep) {
+        appContext.currentWorkflowStep = contractStep;
+      }
+    }
+  }, {
+    screen: 'IdentityDocumentScanningScreen',
+    label: 'ID Scan',
+    icon: ICONS.CREDIT_CARD,
+    setupDemo: () => {
+      setupDemoSession(true);
+    }
+  }, {
+    screen: 'IdentityDocumentEIDScanningScreen',
+    label: 'eID Scan',
+    icon: ICONS.NFC,
+    setupDemo: () => {
+      setupDemoSession(true);
+    }
+  }, {
+    screen: 'LivenessDetectionScreen',
+    label: 'Liveness',
+    icon: ICONS.FACE,
+    setupDemo: () => {
+      setupDemoSession(true);
+    }
+  }, {
+    screen: 'ResultScreen',
+    label: 'Result',
+    icon: ICONS.CHECK_CIRCLE,
+    setupDemo: () => {
+      setupDemoSession();
+    }
+  }];
+  const jumpToScreen = useCallback(screen => {
+    if (screen.setupDemo) {
+      screen.setupDemo();
+    }
+    navigation.navigate(screen.screen, screen.params);
+    setIsExpanded(false);
+  }, [navigation]);
+
+  // Only show in development mode
+  if (!__DEV__) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.container, {
+      bottom: 20 + insets.bottom
+    }],
+    children: [isExpanded && /*#__PURE__*/_jsxs(View, {
+      style: styles.panel,
+      children: [/*#__PURE__*/_jsx(Text, {
+        style: styles.title,
+        children: "SDK JUMP TO SCREEN:"
+      }), screens.map(screen => /*#__PURE__*/_jsxs(TouchableOpacity, {
+        style: styles.screenButton,
+        onPress: () => jumpToScreen(screen),
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: styles.screenIcon,
+          children: screen.icon
+        }), /*#__PURE__*/_jsx(Text, {
+          style: styles.screenLabel,
+          children: screen.label
+        })]
+      }, screen.screen))]
+    }), /*#__PURE__*/_jsxs(TouchableOpacity, {
+      style: styles.toggleButton,
+      onPress: () => setIsExpanded(!isExpanded),
+      children: [/*#__PURE__*/_jsx(Text, {
+        style: styles.bugIcon,
+        children: ICONS.BUG_REPORT
+      }), isExpanded && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(View, {
+          style: styles.spacing
+        }), /*#__PURE__*/_jsx(Text, {
+          style: styles.toggleText,
+          children: "DEBUG NAV"
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.spacing
+      }), /*#__PURE__*/_jsx(Text, {
+        style: styles.arrow,
+        children: isExpanded ? '▼' : '▲'
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    position: 'absolute',
+    right: 20,
+    alignItems: 'flex-end',
+    zIndex: 9999
+  },
+  toggleButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: '#FF5252',
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+    borderRadius: 10,
+    borderWidth: 2,
+    borderColor: 'white',
+    ...Platform.select({
+      ios: {
+        shadowColor: '#000',
+        shadowOffset: {
+          width: 0,
+          height: 4
+        },
+        shadowOpacity: 0.3,
+        shadowRadius: 8
+      },
+      android: {
+        elevation: 8
+      }
+    })
+  },
+  bugIcon: {
+    fontSize: 24
+  },
+  spacing: {
+    width: 8
+  },
+  toggleText: {
+    color: 'white',
+    fontSize: 14,
+    fontWeight: 'bold'
+  },
+  arrow: {
+    color: 'white',
+    fontSize: 20
+  },
+  panel: {
+    backgroundColor: 'rgba(0, 0, 0, 0.9)',
+    borderRadius: 12,
+    padding: 12,
+    marginBottom: 10,
+    borderWidth: 1,
+    borderColor: 'rgba(255, 82, 82, 0.5)',
+    minWidth: 180,
+    ...Platform.select({
+      ios: {
+        shadowColor: '#000',
+        shadowOffset: {
+          width: 0,
+          height: 4
+        },
+        shadowOpacity: 0.5,
+        shadowRadius: 15
+      },
+      android: {
+        elevation: 15
+      }
+    })
+  },
+  title: {
+    color: 'rgba(255, 255, 255, 0.7)',
+    fontSize: 11,
+    fontWeight: 'bold',
+    letterSpacing: 1.2,
+    marginBottom: 12,
+    textAlign: 'right'
+  },
+  screenButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    backgroundColor: '#616161',
+    paddingHorizontal: 12,
+    paddingVertical: 8,
+    borderRadius: 4,
+    marginBottom: 6
+  },
+  screenIcon: {
+    fontSize: 16,
+    marginRight: 8,
+    width: 20,
+    textAlign: 'center'
+  },
+  screenLabel: {
+    color: 'white',
+    fontSize: 12,
+    fontWeight: '500',
+    flex: 1
+  }
+});
+export default DebugNavigationPanel;