@trustchex/react-native-sdk 1.381.0 → 1.464.0

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

@@ -1,39 +1,33 @@
 "use strict";
 
 import React, { useCallback, useContext, useState } from 'react';
-import { View, Text, TouchableOpacity, StyleSheet, Platform, Switch } from 'react-native';
+import { View, Text, TouchableOpacity, StyleSheet, Platform, Switch, ActivityIndicator } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { useTranslation } from 'react-i18next';
 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 - Locked with key for session security
-  HANDSHAKE: '📝',
-  // Icons.handshake - Document for contract signing
-  CREDIT_CARD: '🪪',
-  // Icons.credit_card - ID card for document scan
-  NFC: '💳',
-  // Icons.nfc - Contactless card for eID
-  FACE: '📸',
-  // Icons.face - Camera for face detection
-  CHECK_CIRCLE: '📋',
-  // Icons.check_circle - Clipboard for results
-  BUG_REPORT: '🔧',
-  // Icons.bug_report - Wrench for debugging
-  PHONE: '💬' // Icons.phone - Message for OTP code
-};
+const DEV_BASE_URL = 'https://192.168.0.171:3000';
+const DEBUG_VERBAL_CONSENT_TITLE_EN = 'Verbal Consent';
+const DEBUG_VERBAL_CONSENT_TITLE_TR = 'Sözlü Onay';
+const DEBUG_VERBAL_CONSENT_TEXT_EN = 'I confirm my identity and give my explicit consent to the processing of my personal data for digital identity verification. I acknowledge that my biometric data will be used solely for this purpose. I understand that I can withdraw this consent at any time.';
+const DEBUG_VERBAL_CONSENT_TEXT_TR = 'Dijital kimlik doğrulama amacıyla kimliğimi teyit ediyor ve kişisel verilerimin işlenmesine açık rızamı veriyorum. Biyometrik verilerimin yalnızca kimlik doğrulama amacıyla işleneceğini kabul ediyorum. Bu onayı istediğim zaman geri çekebileceğimi biliyorum.';
 const DebugNavigationPanel = () => {
   const [isExpanded, setIsExpanded] = useState(false);
   const [selectedScreen, setSelectedScreen] = useState(null);
   const [voiceGuidanceEnabled, setVoiceGuidanceEnabled] = useState(true);
   const [allowIdCard, setAllowIdCard] = useState(true);
   const [allowPassport, setAllowPassport] = useState(true);
+  const [isConnectingVideoCall, setIsConnectingVideoCall] = useState(false);
+  const [videoCallError, setVideoCallError] = useState(null);
   const navigation = useNavigation();
   const appContext = useContext(AppContext);
   const insets = useSafeAreaInsets();
+  const {
+    i18n
+  } = useTranslation();
+  const isTurkish = (i18n.language || '').toLowerCase().startsWith('tr');
   const setupDemoSession = useCallback((setDebugFlag = false) => {
     appContext.setIsDemoSession?.(true);
     appContext.identificationInfo.sessionId = 'demo-verification-id';
@@ -78,12 +72,10 @@ const DebugNavigationPanel = () => {
   }, [appContext]);
   const screens = [{
     screen: 'VerificationSessionCheckScreen',
-    label: 'Session Check',
-    icon: ICONS.LOGIN
+    label: 'Session Check'
   }, {
     screen: 'OTPVerificationScreen',
     label: 'OTP',
-    icon: ICONS.PHONE,
     setupDemo: () => {
       setupDemoSession(true);
     },
@@ -93,7 +85,6 @@ const DebugNavigationPanel = () => {
   }, {
     screen: 'ContractAcceptanceScreen',
     label: 'Consent',
-    icon: ICONS.HANDSHAKE,
     hasOptions: true,
     setupDemo: () => {
       setupDemoSession(true);
@@ -103,10 +94,40 @@ const DebugNavigationPanel = () => {
         appContext.currentWorkflowStep = contractStep;
       }
     }
+  }, {
+    screen: 'VerbalConsentScreen',
+    label: 'Verbal Consent',
+    hasOptions: true,
+    setupDemo: () => {
+      setupDemoSession(true);
+      const existingStep = appContext.workflowSteps?.find(s => s.type === 'VERBAL_CONSENT');
+      const localizedConsentTitle = isTurkish ? DEBUG_VERBAL_CONSENT_TITLE_TR : DEBUG_VERBAL_CONSENT_TITLE_EN;
+      const localizedConsentText = isTurkish ? DEBUG_VERBAL_CONSENT_TEXT_TR : DEBUG_VERBAL_CONSENT_TEXT_EN;
+      const localizedStep = existingStep ? {
+        ...existingStep,
+        data: {
+          ...existingStep.data,
+          verbalConsentTitle: localizedConsentTitle,
+          verbalConsentText: localizedConsentText,
+          voiceGuidanceActive: false
+        }
+      } : {
+        type: 'VERBAL_CONSENT',
+        required: true,
+        data: {
+          verbalConsentTitle: localizedConsentTitle,
+          verbalConsentText: localizedConsentText,
+          voiceGuidanceActive: false
+        }
+      };
+      if (appContext.workflowSteps) {
+        appContext.workflowSteps = appContext.workflowSteps.map(step => step.type === 'VERBAL_CONSENT' ? localizedStep : step);
+      }
+      appContext.currentWorkflowStep = localizedStep;
+    }
   }, {
     screen: 'IdentityDocumentScanningScreen',
     label: 'ID Scan',
-    icon: ICONS.CREDIT_CARD,
     hasOptions: true,
     hasDocumentTypeOption: true,
     setupDemo: () => {
@@ -119,7 +140,6 @@ const DebugNavigationPanel = () => {
   }, {
     screen: 'IdentityDocumentEIDScanningScreen',
     label: 'eID Scan',
-    icon: ICONS.NFC,
     hasOptions: true,
     hasDocumentTypeOption: true,
     setupDemo: () => {
@@ -132,7 +152,6 @@ const DebugNavigationPanel = () => {
   }, {
     screen: 'LivenessDetectionScreen',
     label: 'Liveness',
-    icon: ICONS.FACE,
     hasOptions: true,
     setupDemo: () => {
       setupDemoSession(true);
@@ -144,19 +163,27 @@ const DebugNavigationPanel = () => {
   }, {
     screen: 'ResultScreen',
     label: 'Result',
-    icon: ICONS.CHECK_CIRCLE,
     setupDemo: () => {
       setupDemoSession();
     }
   }, {
     screen: 'MRZTestScreen',
     label: 'MRZ Test',
-    icon: ICONS.BUG_REPORT
+    isDebug: true
+  }, {
+    screen: 'BarcodeTestScreen',
+    label: 'Barcode Test',
+    isDebug: true
+  }, {
+    screen: 'NFCScanTestScreen',
+    label: 'NFC Scan Test',
+    isDebug: true
   }];
   const selectScreen = useCallback(screen => {
     if (!screen.hasOptions) {
       if (screen.setupDemo) {
         screen.setupDemo();
+        applyVoiceGuidance(voiceGuidanceEnabled);
       }
       navigation.navigate(screen.screen, screen.params);
       setIsExpanded(false);
@@ -166,10 +193,64 @@ const DebugNavigationPanel = () => {
     setVoiceGuidanceEnabled(true);
     setAllowIdCard(true);
     setAllowPassport(true);
-  }, [navigation]);
-  const jumpToScreen = useCallback(() => {
-    if (!selectedScreen) return;
+  }, [navigation, voiceGuidanceEnabled, applyVoiceGuidance]);
+  const handleVideoCallTest = useCallback(async () => {
+    setIsConnectingVideoCall(true);
+    setVideoCallError(null);
+    try {
+      const fallbackUrl = (appContext.baseUrl ?? '').replace(/\/$/, '');
+      let 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;
+      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',
+        required: false,
+        data: {
+          voiceGuidanceActive: false
+        }
+      };
+      const videoCallStep = {
+        type: 'VIDEO_CALL',
+        required: true,
+        data: {}
+      };
+      appContext.workflowSteps = [eidStep, videoCallStep];
+      appContext.currentWorkflowStep = eidStep;
+      navigation.navigate('IdentityDocumentEIDScanningScreen');
+      setIsExpanded(false);
+    } catch (err) {
+      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 && !allowIdCard && !allowPassport) {
       // Don't navigate if no document types are selected
@@ -206,14 +287,14 @@ const DebugNavigationPanel = () => {
         style: styles.title,
         children: "SDK JUMP TO SCREEN:"
       }), selectedScreen ? /*#__PURE__*/_jsxs(View, {
-        children: [/*#__PURE__*/_jsxs(Text, {
+        children: [/*#__PURE__*/_jsx(Text, {
           style: styles.optionsTitle,
-          children: [selectedScreen.icon, " ", selectedScreen.label]
+          children: selectedScreen.label
         }), /*#__PURE__*/_jsxs(View, {
           style: styles.optionRow,
           children: [/*#__PURE__*/_jsx(Text, {
             style: styles.optionLabel,
-            children: "\uD83D\uDD0A Voice Guidance"
+            children: "Voice Guidance"
           }), /*#__PURE__*/_jsx(Switch, {
             value: voiceGuidanceEnabled,
             onValueChange: setVoiceGuidanceEnabled,
@@ -228,7 +309,7 @@ const DebugNavigationPanel = () => {
             style: styles.optionRow,
             children: [/*#__PURE__*/_jsx(Text, {
               style: styles.optionLabel,
-              children: "\uD83E\uDEAA Allow ID Card"
+              children: "Allow ID Card"
             }), /*#__PURE__*/_jsx(Switch, {
               value: allowIdCard,
               onValueChange: setAllowIdCard,
@@ -242,7 +323,7 @@ const DebugNavigationPanel = () => {
             style: styles.optionRow,
             children: [/*#__PURE__*/_jsx(Text, {
               style: styles.optionLabel,
-              children: "\uD83D\uDEC2 Allow Passport"
+              children: "Allow Passport"
             }), /*#__PURE__*/_jsx(Switch, {
               value: allowPassport,
               onValueChange: setAllowPassport,
@@ -272,17 +353,47 @@ const DebugNavigationPanel = () => {
             })
           })]
         })]
-      }) : screens.map(screen => /*#__PURE__*/_jsxs(TouchableOpacity, {
-        style: styles.screenButton,
-        onPress: () => selectScreen(screen),
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: styles.screenIcon,
-          children: screen.icon
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.screenLabel,
-          children: screen.label
+      }) : /*#__PURE__*/_jsxs(_Fragment, {
+        children: [screens.filter(s => !s.isDebug).map(screen => /*#__PURE__*/_jsx(TouchableOpacity, {
+          style: styles.screenButton,
+          onPress: () => selectScreen(screen),
+          children: /*#__PURE__*/_jsx(Text, {
+            style: styles.screenLabel,
+            children: screen.label
+          })
+        }, screen.screen)), /*#__PURE__*/_jsxs(View, {
+          style: styles.sectionDivider,
+          children: [/*#__PURE__*/_jsx(View, {
+            style: styles.sectionDividerLine
+          }), /*#__PURE__*/_jsx(Text, {
+            style: styles.sectionDividerLabel,
+            children: "DEBUG TOOLS"
+          }), /*#__PURE__*/_jsx(View, {
+            style: styles.sectionDividerLine
+          })]
+        }), screens.filter(s => s.isDebug).map(screen => /*#__PURE__*/_jsx(TouchableOpacity, {
+          style: styles.debugScreenButton,
+          onPress: () => selectScreen(screen),
+          children: /*#__PURE__*/_jsx(Text, {
+            style: styles.debugScreenLabel,
+            children: screen.label
+          })
+        }, screen.screen)), /*#__PURE__*/_jsxs(TouchableOpacity, {
+          style: [styles.videoCallTestButton, isConnectingVideoCall && styles.videoCallTestButtonDisabled],
+          onPress: handleVideoCallTest,
+          disabled: isConnectingVideoCall,
+          children: [isConnectingVideoCall && /*#__PURE__*/_jsx(ActivityIndicator, {
+            size: "small",
+            color: "#4CAF50"
+          }), /*#__PURE__*/_jsx(Text, {
+            style: styles.videoCallTestLabel,
+            children: isConnectingVideoCall ? 'Connecting...' : 'Video Call Test'
+          })]
+        }), videoCallError && /*#__PURE__*/_jsx(Text, {
+          style: styles.videoCallTestError,
+          children: videoCallError
         })]
-      }, screen.screen))]
+      })]
     }), /*#__PURE__*/_jsxs(TouchableOpacity, {
       style: styles.toggleButton,
       onPress: () => {
@@ -292,18 +403,13 @@ const DebugNavigationPanel = () => {
         setAllowIdCard(true);
         setAllowPassport(true);
       },
-      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, {
+      children: [isExpanded && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(Text, {
           style: styles.toggleText,
           children: "DEBUG NAV"
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.spacing
         })]
-      }), /*#__PURE__*/_jsx(View, {
-        style: styles.spacing
       }), /*#__PURE__*/_jsx(Text, {
         style: styles.arrow,
         children: isExpanded ? '▼' : '▲'
@@ -322,9 +428,9 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     alignItems: 'center',
     backgroundColor: '#FF5252',
-    paddingHorizontal: 12,
+    paddingHorizontal: 10,
     paddingVertical: 10,
-    borderRadius: 10,
+    borderRadius: 8,
     borderWidth: 2,
     borderColor: 'white',
     ...Platform.select({
@@ -342,9 +448,6 @@ const styles = StyleSheet.create({
       }
     })
   },
-  bugIcon: {
-    fontSize: 24
-  },
   spacing: {
     width: 8
   },
@@ -355,7 +458,10 @@ const styles = StyleSheet.create({
   },
   arrow: {
     color: 'white',
-    fontSize: 20
+    fontSize: 20,
+    lineHeight: 20,
+    textAlignVertical: 'center',
+    includeFontPadding: false
   },
   panel: {
     backgroundColor: 'rgba(0, 0, 0, 0.9)',
@@ -398,12 +504,6 @@ const styles = StyleSheet.create({
     borderRadius: 4,
     marginBottom: 6
   },
-  screenIcon: {
-    fontSize: 16,
-    marginRight: 8,
-    width: 20,
-    textAlign: 'center'
-  },
   screenLabel: {
     color: 'white',
     fontSize: 12,
@@ -461,6 +561,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;