@sanctum-key/react-native-sdk 1.0.51 → 1.0.52

package/src/components/KYCElements/IDCardCapture.tsx

@@ -525,217 +525,218 @@ export const IDCardCapture: React.FC<IDCardCaptureProps> = ({ component, value =
     }
 };
 
-  const handleSilentCapture = async (result: { success: boolean; path?: string; error?: string; barcode?: unknown }) => {
-    if (isProcessingCaptureRef.current) return;
-    if (scanPhaseRef.current === 'barcode') return;
-    if (isAnalyzingRef.current) return;
-
-
-    const side = currentSideRef.current;
-    const captured = capturedImagesRef.current;
-    const docType = selectedDocTypeRef.current;
-    const cData = countryDataRef.current;
+const handleSilentCapture = async (result: { success: boolean; path?: string; error?: string; barcode?: unknown }) => {
+  if (isProcessingCaptureRef.current) return;
+  if (scanPhaseRef.current === 'barcode') return;
+  if (isAnalyzingRef.current) return;
+
+  // 🚨 SYNCHRONOUS LOCK: Block all subsequent camera frames immediately
+  isAnalyzingRef.current = true;
+
+  const side = currentSideRef.current;
+  const captured = capturedImagesRef.current;
+  const docType = selectedDocTypeRef.current;
+  const cData = countryDataRef.current;
+
+  if (result.success && result.path) {
+    setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: true, success: false, error: '' }));
+    const safeCapturePath = Platform.OS === 'ios' && !result.path.startsWith('file://') ? `file://${result.path}` : result.path;
+    
+    let templatePath = captured[side]?.templatePath || '';
+    let templateBbox: IBbox | undefined;
+    let templateResponse: any;
 
-    if (result.success && result.path) {
-      setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: true, success: false, error: '' }));
-      
-      const safeCapturePath = Platform.OS === 'ios' && !result.path.startsWith('file://') ? `file://${result.path}` : result.path;
-      let templatePath = captured[side]?.templatePath || '';
-      let templateBbox: IBbox | undefined;
-      let templateResponse: any;
+    if (!docType) {
+      setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: false, success: false, error: 'Document type not selected' }));
+      isAnalyzingRef.current = false; // 🚨 UNLOCK
+      return;
+    }
 
-      if (!docType) {
-        setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: false, success: false, error: 'Document type not selected' }));
-        return;
+    const issuingSubdivision = docType.region !== 'root' ? docType.region : undefined;
+    
+    const watchdog = setTimeout(() => {
+      if (isAnalyzingRef.current) {
+        isAnalyzingRef.current = false; // 🚨 UNLOCK inside watchdog
+        setSilentCaptureResult((prev) => ({ 
+          ...prev, 
+          isAnalyzing: false, 
+          success: false, 
+          error: state.currentLanguage === 'en' ? 'Taking longer than expected. Hold steady.' : 'Traitement long. Veuillez rester immobile.' 
+        }));
       }
+    }, 20000);
 
-      const issuingSubdivision = docType.region !== 'root' ? docType.region : undefined;
-
-      const watchdog = setTimeout(() => {
-        if (isAnalyzingRef.current) {
-          setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: false, success: false, error: state.currentLanguage === 'en' ? 'Taking longer than expected. Hold steady.' : 'Traitement long. Veuillez rester immobile.' }));
-        }
-      }, 20000);
-
-      try {
-        if (!templatePath) {
-          const templateType = await checkTemplateType({ path: safeCapturePath, docType: docType.type as GovernmentDocumentType, docRegion: cData?.code || "", postfix: side, issuingSubdivision: issuingSubdivision }, env);
-          templateResponse = templateType;
-          if (templateType.template_path) templatePath = templateType.template_path;
-          if (templateType.card_obb) {
-            const obbConfidence = getObbConfidence((templateType as any).card_obb);
-            if (obbConfidence !== null && obbConfidence < OBB_CONFIDENCE_THRESHOLD) {
-              clearTimeout(watchdog);
-              setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: false, success: false, error: t('kyc.idCardCapture.cardNotFullyInFrame') }));
-              return;
-            }
-            try { const crop = await cropByObb(safeCapturePath, (templateType as any).card_obb); templateBbox = crop.bbox; } catch {}
+    try {
+      if (!templatePath) {
+        const templateType = await checkTemplateType({ 
+          path: safeCapturePath, 
+          docType: docType.type as GovernmentDocumentType, 
+          docRegion: cData?.code || "", 
+          postfix: side, 
+          issuingSubdivision: issuingSubdivision 
+        }, env);
+        
+        templateResponse = templateType;
+        if (templateType.template_path) templatePath = templateType.template_path;
+        
+        if (templateType.card_obb) {
+          const obbConfidence = getObbConfidence((templateType as any).card_obb);
+          if (obbConfidence !== null && obbConfidence < OBB_CONFIDENCE_THRESHOLD) {
+            clearTimeout(watchdog);
+            setSilentCaptureResult((prev) => ({ ...prev, isAnalyzing: false, success: false, error: t('kyc.idCardCapture.cardNotFullyInFrame') }));
+            isAnalyzingRef.current = false; // 🚨 UNLOCK
+            return;
           }
+          try {
+            const crop = await cropByObb(safeCapturePath, (templateType as any).card_obb);
+            templateBbox = crop.bbox;
+          } catch {}
         }
+      }
 
-        sdkLogger.info(`Template check passed for ${side}`, { templatePath }); 
-        const extractedCountryKey = templatePath ? templatePath.split('/')[0] : (ISO_TO_COUNTRY_NAME[cData?.code || ''] || 'root');
-        const regionMappings = getCurrentSideVerification(side, extractedCountryKey, cData);
-        let verificationRes: any;
-
-        if (side === 'front') {
-          const matchedAuthMethod = getCorrespondingAuthMethod(templatePath, regionMappings.regionMapping, regionMappings.key || '', 'front');
-          const mrzType = getCorrespondingMrzType(templatePath, regionMappings.regionMapping, regionMappings.key || '') || 'TD1';
-          verificationRes = await frontVerification({ path: safeCapturePath, regionMapping: { authMethod: matchedAuthMethod ? [matchedAuthMethod] : [], mrzTypes: mrzType ? [mrzType] : [] }, selectedDocumentType: GovernmentDocumentTypeShorted[docType.type as keyof typeof GovernmentDocumentTypeShorted] || '', code: cData?.code || '', currentSide: side, templatePath, mrzType, issuingSubdivision: issuingSubdivision, clientSideBarcodeData: silentCaptureResult.barcode }, env);
-        } else {
-          const matchedBackAuthMethod = getCorrespondingAuthMethod(templatePath, regionMappings.regionMapping, regionMappings.key || '', 'back');
-          const backMrzType = getCorrespondingMrzType(templatePath, regionMappings.regionMapping, regionMappings.key || '') || '';
-          const frontTemplatePath = captured['front']?.templatePath || '';
-          verificationRes = await backVerification({ path: safeCapturePath, regionMapping: { authMethod: matchedBackAuthMethod ? [matchedBackAuthMethod] : [], mrzTypes: backMrzType ? [backMrzType] : [] }, selectedDocumentType: GovernmentDocumentTypeShorted[docType.type as keyof typeof GovernmentDocumentTypeShorted] || '', code: cData?.code || '', currentSide: side, templatePath, mrzType: backMrzType, templateResponse, issuingSubdivision: issuingSubdivision, frontTemplatePath: frontTemplatePath }, env);
-        }
+      sdkLogger.info(`Template check passed for ${side}`, { templatePath });
+      
+      const extractedCountryKey = templatePath ? templatePath.split('/')[0] : (ISO_TO_COUNTRY_NAME[cData?.code || ''] || 'root');
+      const regionMappings = getCurrentSideVerification(side, extractedCountryKey, cData);
+      
+      let verificationRes: any;
+      if (side === 'front') {
+        const matchedAuthMethod = getCorrespondingAuthMethod(templatePath, regionMappings.regionMapping, regionMappings.key || '', 'front');
+        const mrzType = getCorrespondingMrzType(templatePath, regionMappings.regionMapping, regionMappings.key || '') || 'TD1';
+        
+        verificationRes = await frontVerification({ 
+          path: safeCapturePath, 
+          regionMapping: { authMethod: matchedAuthMethod ? [matchedAuthMethod] : [], mrzTypes: mrzType ? [mrzType] : [] }, 
+          selectedDocumentType: GovernmentDocumentTypeShorted[docType.type as keyof typeof GovernmentDocumentTypeShorted] || '', 
+          code: cData?.code || '', 
+          currentSide: side, 
+          templatePath, 
+          mrzType, 
+          issuingSubdivision: issuingSubdivision, 
+          clientSideBarcodeData: silentCaptureResult.barcode 
+        }, env);
+      } else {
+        const matchedBackAuthMethod = getCorrespondingAuthMethod(templatePath, regionMappings.regionMapping, regionMappings.key || '', 'back');
+        const backMrzType = getCorrespondingMrzType(templatePath, regionMappings.regionMapping, regionMappings.key || '') || '';
+        const frontTemplatePath = captured['front']?.templatePath || '';
+        
+        verificationRes = await backVerification({ 
+          path: safeCapturePath, 
+          regionMapping: { authMethod: matchedBackAuthMethod ? [matchedBackAuthMethod] : [], mrzTypes: backMrzType ? [backMrzType] : [] }, 
+          selectedDocumentType: GovernmentDocumentTypeShorted[docType.type as keyof typeof GovernmentDocumentTypeShorted] || '', 
+          code: cData?.code || '', 
+          currentSide: side, 
+          templatePath, 
+          mrzType: backMrzType, 
+          templateResponse, 
+          issuingSubdivision: issuingSubdivision, 
+          frontTemplatePath: frontTemplatePath 
+        }, env);
+      }
 
-        const bbox = verificationRes?.bbox || templateBbox;
-        const verifiedMrz = verificationRes?.mrz ? JSON.stringify(verificationRes.mrz) : "";
-
-        if (isBarcodeRequired(side, cData, docType)) {
-          const barcodeData = scannedBarcodeRef.current;
-          const isHIC = docType.type === 'health_insurance_card';
-          const isValidScan = typeof barcodeData === 'string' && ((isHIC && barcodeData.length > 0) || barcodeData.length > 50);
-
-          if (isValidScan) {
-            let parsedDictionary;
-            if (isHIC && barcodeData.length < 50) {
-              parsedDictionary = { data: { card_number: barcodeData, barcode_type: "1D" } };
-            } else {
-              const token = await authentification();
-              parsedDictionary = await kycService.formatBarcodeData({ textInput: barcodeData, token }, env);
-            }
-            const verifiedResult: ISilentCaptureResult & { region?: string } = { path: safeCapturePath, templatePath: templatePath, bbox: bbox, success: true, mrz: JSON.stringify(parsedDictionary), barcode: barcodeData, isAnalyzing: false, country: cData?.code, documentType: docType.type, region: docType.region !== 'root' ? docType.region : undefined };
-            
-            clearTimeout(watchdog); setSilentCaptureResult(verifiedResult);
-            if (bbox) setBboxBySide(prev => ({ ...prev, ['back']: bbox as IBbox }));
-            await autoCapture(safeCapturePath!, verifiedResult);
-            return;
+      const bbox = verificationRes?.bbox || templateBbox;
+      const verifiedMrz = verificationRes?.mrz ? JSON.stringify(verificationRes.mrz) : "";
+
+      if (isBarcodeRequired(side, cData, docType)) {
+        const barcodeData = scannedBarcodeRef.current;
+        const isHIC = docType.type === 'health_insurance_card';
+        const isValidScan = typeof barcodeData === 'string' && ((isHIC && barcodeData.length > 0) || barcodeData.length > 50);
+        
+        if (isValidScan) {
+          let parsedDictionary;
+          if (isHIC && barcodeData.length < 50) {
+            parsedDictionary = { data: { card_number: barcodeData, barcode_type: "1D" } };
+          } else {
+            const token = await authentification();
+            parsedDictionary = await kycService.formatBarcodeData({ textInput: barcodeData, token }, env);
           }
-          sdkLogger.info(`Verification passed. Waiting for barcode scan phase.`); // 🚨 LOG
+          const verifiedResult: ISilentCaptureResult & { region?: string } = { 
+            path: safeCapturePath, templatePath: templatePath, bbox: bbox, success: true, 
+            mrz: JSON.stringify(parsedDictionary), barcode: barcodeData, isAnalyzing: false, 
+            country: cData?.code, documentType: docType.type, region: docType.region !== 'root' ? docType.region : undefined 
+          };
+          
           clearTimeout(watchdog);
-          setPendingCAImage({ path: safeCapturePath!, templateResponse, templatePath, bbox });
-          setScanPhase('barcode');
-          setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false }));
+          setSilentCaptureResult(verifiedResult);
+          if (bbox) setBboxBySide(prev => ({ ...prev, ['back']: bbox as IBbox }));
+          
+          isAnalyzingRef.current = false; // 🚨 UNLOCK on success
+          await autoCapture(safeCapturePath!, verifiedResult);
           return;
         }
 
-        const verifiedResult: ISilentCaptureResult & { region?: string } = { path: safeCapturePath, templatePath, bbox, success: true, mrz: verifiedMrz, isAnalyzing: false, country: cData?.code, documentType: docType.type, region: issuingSubdivision };
+        sdkLogger.info(`Verification passed. Waiting for barcode scan phase.`);
         clearTimeout(watchdog);
-        setSilentCaptureResult(verifiedResult);
-        if (bbox) setBboxBySide(prev => ({ ...prev, [side]: bbox }));
-        await autoCapture(safeCapturePath, verifiedResult);
+        setPendingCAImage({ path: safeCapturePath!, templateResponse, templatePath, bbox });
+        setScanPhase('barcode');
+        setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false }));
+        isAnalyzingRef.current = false; // 🚨 UNLOCK before phase shift
+        return;
+      }
 
-      } catch (error: any) {
-        clearTimeout(watchdog);
-        
-        const rawMessage = (typeof error === 'string' ? error : (error?.message || '')).toLowerCase();
-        const statusCode = error?.response?.status || error?.status;
-
-        if (
-          statusCode === 401 || 
-          statusCode === 403 || 
-          rawMessage.includes('401') || 
-          rawMessage.includes('unauthorized') || 
-          rawMessage.includes('token') ||
-          rawMessage.includes('unauthenticated')
-        ) {
-          sdkLogger.error(`Secure API Session Expired during AI extraction`); 
-          setShowCamera(false); 
-          setIsProcessingCapture(false);
-          setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false, success: false, error: '' }));
-          
-          // Use React Native's native Alert to wait for the user's tap
-          Alert.alert(
-            state.currentLanguage === 'en' ? 'Session Expired' : 'Session Expirée',
-            state.currentLanguage === 'en' 
-              ? 'Your secure session has expired. Please restart the process.' 
-              : 'Votre session sécurisée a expiré. Veuillez recommencer.',
-            [
-              {
-                text: state.currentLanguage === 'en' ? 'Restart' : 'Recommencer',
-                onPress: () => handleExitKYCFlow() // Redirects ONLY when they click the button
-              }
-            ],
-            { cancelable: false } // Forces them to click the button
-          );
-          
-          return; 
-        }
+      const verifiedResult: ISilentCaptureResult & { region?: string } = { 
+        path: safeCapturePath, templatePath, bbox, success: true, mrz: verifiedMrz, isAnalyzing: false, 
+        country: cData?.code, documentType: docType.type, region: issuingSubdivision 
+      };
+      
+      clearTimeout(watchdog);
+      setSilentCaptureResult(verifiedResult);
+      if (bbox) setBboxBySide(prev => ({ ...prev, [side]: bbox }));
+      
+      isAnalyzingRef.current = false; // 🚨 UNLOCK on final success
+      await autoCapture(safeCapturePath, verifiedResult);
 
-        let hintMessage = '';
-
-        // 2. Business Logic Errors
-        if (
-          rawMessage.includes('card_not_fully_in_frame') || 
-          rawMessage.includes('non entièrement visible') || 
-          rawMessage.includes('aucun visage détecté') ||
-          rawMessage.includes('stabiliser la caméra')
-        ) {
-          hintMessage = state.currentLanguage === 'en' 
-            ? 'Ensure the entire card and your face are clearly inside the frame.' 
-            : 'Assurez-vous que toute la carte et le visage sont clairement dans le cadre.';
-        } 
-        
-        // 2. Document/Country Mismatch
-        // Catches: 'pays sélectionné', 'LPIPS'
-        else if (rawMessage.includes('pays sélectionné')) {
-          hintMessage = state.currentLanguage === 'en' 
-            ? 'This document does not match the selected country.' 
-            : 'Ce document ne correspond pas au pays sélectionné.';
-        } 
-        
-        // 3. Front/Back Document Mismatch
-        // Catches: 'ne correspond pas au recto', 'document différent'
-        else if (rawMessage.includes('ne correspond pas au recto') || rawMessage.includes('document différent')) {
-          hintMessage = state.currentLanguage === 'en' 
-            ? 'Please scan the back of the exact same ID.' 
-            : 'Veuillez scanner le verso de la même pièce d\'identité.';
-        } 
-        
-        // 4. Data Extraction Failures (OCR & MRZ)
-        // Catches: 'impossible de lire', 'impossible d'extraire', 'mrz illisible', 'lecture mrz invalide'
-        else if (
-          rawMessage.includes('impossible de lire') || 
-          rawMessage.includes('impossible d\'extraire') || 
-          rawMessage.includes('mrz') || 
-          rawMessage.includes('extraction') || 
-          rawMessage.includes('illisible') || 
-          rawMessage.includes('invalide')
-        ) {
-          hintMessage = state.currentLanguage === 'en' 
-            ? 'Cannot read document text. Avoid glare, improve lighting, and hold steady.' 
-            : 'Impossible de lire le texte. Évitez les reflets, améliorez l\'éclairage et restez immobile.';
-        }
-        
-        // 5. Server Infrastructure & Downtime
-        // Catches: Cloudflare tunnel errors, 502/503 Gateway timeouts
-        else if (
-          rawMessage.includes('cloudflare') || 
-          rawMessage.includes('tunnel') || 
-          rawMessage.includes('502') || 
-          rawMessage.includes('503')
-        ) {
-          hintMessage = state.currentLanguage === 'en' 
-            ? 'Server is temporarily offline. Please try again in a few minutes.' 
-            : 'Le serveur est temporairement hors ligne. Veuillez réessayer dans quelques minutes.';
-        } 
+    } catch (error: any) {
+      clearTimeout(watchdog);
+      const rawMessage = (typeof error === 'string' ? error : (error?.message || '')).toLowerCase();
+      const statusCode = error?.response?.status || error?.status;
+      
+      if (
+        statusCode === 401 || statusCode === 403 || 
+        rawMessage.includes('401') || rawMessage.includes('unauthorized') || 
+        rawMessage.includes('token') || rawMessage.includes('unauthenticated')
+      ) {
+        sdkLogger.error(`Secure API Session Expired during AI extraction`);
+        setShowCamera(false);
+        setIsProcessingCapture(false);
+        setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false, success: false, error: '' }));
         
-        // 6. True Network Errors vs. Fallback Processing
-        else {
-          // Strictly detect Axios network drops without swallowing unknown custom errors
-          const isNetworkError = error?.isAxiosError || rawMessage === 'network error' || error?.code === 'econnaborted' || rawMessage.includes('network');
-          
-          if (isNetworkError) {
-            hintMessage = state.currentLanguage === 'en'
-              ? 'Poor connection. Please check your internet.'
-              : 'Connexion faible. Veuillez vérifier votre internet.';
-          }  
+        Alert.alert(
+          state.currentLanguage === 'en' ? 'Session Expired' : 'Session Expirée',
+          state.currentLanguage === 'en' ? 'Your secure session has expired. Please restart the process.' : 'Votre session sécurisée a expiré. Veuillez recommencer.',
+          [{ text: state.currentLanguage === 'en' ? 'Restart' : 'Recommencer', onPress: () => handleExitKYCFlow() }],
+          { cancelable: false }
+        );
+        isAnalyzingRef.current = false; // 🚨 UNLOCK on session expiry
+        return;
+      }
+
+      let hintMessage = '';
+      if (rawMessage.includes('card_not_fully_in_frame') || rawMessage.includes('non entièrement visible') || rawMessage.includes('aucun visage détecté') || rawMessage.includes('stabiliser la caméra')) {
+        hintMessage = state.currentLanguage === 'en' ? 'Ensure the entire card and your face are clearly inside the frame.' : 'Assurez-vous que toute la carte et le visage sont clairement dans le cadre.';
+      } else if (rawMessage.includes('pays sélectionné')) {
+        hintMessage = state.currentLanguage === 'en' ? 'This document does not match the selected country.' : 'Ce document ne correspond pas au pays sélectionné.';
+      } else if (rawMessage.includes('ne correspond pas au recto') || rawMessage.includes('document différent')) {
+        hintMessage = state.currentLanguage === 'en' ? 'Please scan the back of the exact same ID.' : 'Veuillez scanner le verso de la même pièce d\'identité.';
+      } else if (rawMessage.includes('impossible de lire') || rawMessage.includes('impossible d\'extraire') || rawMessage.includes('mrz') || rawMessage.includes('extraction') || rawMessage.includes('illisible') || rawMessage.includes('invalide')) {
+        hintMessage = state.currentLanguage === 'en' ? 'Cannot read document text. Avoid glare, improve lighting, and hold steady.' : 'Impossible de lire le texte. Évitez les reflets, améliorez l\'éclairage et restez immobile.';
+      } else if (rawMessage.includes('cloudflare') || rawMessage.includes('tunnel') || rawMessage.includes('502') || rawMessage.includes('503')) {
+        hintMessage = state.currentLanguage === 'en' ? 'Server is temporarily offline. Please try again in a few minutes.' : 'Le serveur est temporairement hors ligne. Veuillez réessayer dans quelques minutes.';
+      } else {
+        const isNetworkError = error?.isAxiosError || rawMessage === 'network error' || error?.code === 'econnaborted' || rawMessage.includes('network');
+        if (isNetworkError) {
+          hintMessage = state.currentLanguage === 'en' ? 'Poor connection. Please check your internet.' : 'Connexion faible. Veuillez vérifier votre internet.';
         }
-        setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false, success: false, error: hintMessage }));
       }
+
+      setSilentCaptureResult(prev => ({ ...prev, isAnalyzing: false, success: false, error: hintMessage }));
+      isAnalyzingRef.current = false; // 🚨 UNLOCK at end of catch block
     }
-  };
+  } else {
+    // 🚨 UNLOCK if the camera frame was invalid or empty
+    isAnalyzingRef.current = false; 
+  }
+};
 
   useEffect(() => {
     if (scanPhase === 'barcode' && pendingCAImage && silentCaptureResult.barcode) {

package/src/components/TemplateKYCExample.tsx

@@ -48,6 +48,7 @@ export interface TemplateKYCExampleProps {
   onError: (error: string) => void;
   language: string;
   API_KEY?: string;
+  TEST_API_KEY?: string;
   templateId?: string;
   template?: KYCTemplate;
   env?: KycEnvironment;
@@ -66,6 +67,7 @@ export function TemplateKYCExample({
   onError,
   language,
   API_KEY,
+  TEST_API_KEY,
   templateId,
   template,
   env = 'PRODUCTION',
@@ -155,6 +157,7 @@ export function TemplateKYCExample({
           onCancel={handleCancel}
           language={language}
           API_KEY={API_KEY}
+          TEST_API_KEY={TEST_API_KEY}
           env={env}
           serverEnv={serverEnv}
           existingSessionId={existingSessionId}

package/src/components/TemplateKYCFlowRefactored.tsx

@@ -4,7 +4,6 @@ import { KYCTemplate, VerificationState } from '../types/KYC.types';
 import { TemplateKYCFlowProvider, useTemplateKYCFlowContext } from '../hooks/useTemplateKYCFlow';
 import { useI18n } from '../hooks/useI18n';
 import { showAlert } from '../utils/platformAlert';
-
 import { IDCardCapture } from './KYCElements/IDCardCapture';
 import { SelfieCaptureTemplate } from './KYCElements/SelfieCaptureTemplate';
 import { FileUploadTemplate } from './KYCElements/FileUploadTemplate';
@@ -21,18 +20,19 @@ import { PersonalInformationTemplate } from './KYCElements/PersonalInformationTe
 import { AdditionalDocumentsTemplate } from './KYCElements/AdditionalDocumentsTemplate';
 import { KycEnvironment, BackendEnvironment } from '../types/env.types';
 import KYCConfig from '../config/KYCConfig';
-import { sdkLogger } from '../utils/logger'; // 🚨 IMPORT SDK LOGGER
+import { logger, sdkLogger } from '../utils/logger'; 
 
 interface TemplateKYCFlowProps {
-  template?: KYCTemplate;        // Format SDK direct (existing, now optional)
-  templateId?: string;           // New: ID to load from API
+  template?: KYCTemplate;        
+  templateId?: string;           
   onComplete?: (data: VerificationState) => void;
   onError?: (error: string) => void;
   language?: string;
   onCancel?: () => void;
-  API_KEY?: string;              // Required if templateId is used
-  env?: KycEnvironment;          // Flow execution: PRODUCTION (full AI) or SANDBOX (skip AI)
-  serverEnv?: BackendEnvironment; // Backend to call: PRODUCTION or TEST (API URL)
+  API_KEY?: string;              
+  TEST_API_KEY?: string;
+  env?: KycEnvironment;          
+  serverEnv?: BackendEnvironment; 
   existingSessionId?: string;
   initialComponentIndex?: number;
   initialCountryResume?: { code: string; documentType: string; region?: string };
@@ -49,6 +49,7 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
   language = 'fr',
   onCancel,
   API_KEY,
+  TEST_API_KEY,
   env = 'PRODUCTION',
   serverEnv,
   existingSessionId,
@@ -61,12 +62,14 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
   const { t } = useI18n();
   const { template: loadedTemplate, isLoading, error, loadTemplate } = useTemplateLoader();
 
+  // 🚨 1. Determine the active API key based on the environment
+  const activeApiKey = env === 'PRODUCTION' ? API_KEY : (TEST_API_KEY || API_KEY);
+
   useEffect(() => {
-    if (API_KEY) {
-      if (sdkLogger.setApiKey) sdkLogger.setApiKey(API_KEY);
+    if (activeApiKey) {
+      if (sdkLogger.setApiKey) sdkLogger.setApiKey(activeApiKey);
     }
-    
-  }, [env, serverEnv, existingSessionId, API_KEY]);
+  }, [env, serverEnv, existingSessionId, activeApiKey]);
 
   useEffect(() => {
     if (serverEnv !== undefined) {
@@ -77,19 +80,20 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
   useEffect(() => {
     if (!providedTemplate && !templateId) {
       const errorMsg = 'Either template or templateId must be provided';
-      sdkLogger.error("Template Loading Failed: Missing Props", { errorMsg });
+      logger.error("Template Loading Failed: Missing Props", { errorMsg });
       onError?.(errorMsg);
       return;
     }
 
-    if (templateId && !API_KEY) {
-      sdkLogger.info(`Fetching template ${templateId} via token authentication`);
+    if (templateId && !activeApiKey) {
+      logger.log(`Fetching template ${templateId} via token authentication`);
       loadTemplate(templateId);
-    } else if (templateId && API_KEY) {
-      sdkLogger.info(`Fetching template ${templateId} via API Key`);
-      loadTemplate(templateId, API_KEY);
+    } else if (templateId && activeApiKey) {
+      logger.log(`Fetching template ${templateId} via API Key`);
+      // 🚨 2. Use the resolved active key here
+      loadTemplate(templateId, activeApiKey);
     }
-  }, [templateId, API_KEY, providedTemplate, loadTemplate, onError]);
+  }, [templateId, activeApiKey, providedTemplate, loadTemplate, onError]);
 
   useEffect(() => {
     if (error) {
@@ -103,8 +107,8 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
       t('kyc.cancelConfirmation.title'),
       t('kyc.cancelConfirmation.message'),
       [
-        { 
-          text: t('kyc.cancelConfirmation.cancelButton'), 
+        {
+          text: t('kyc.cancelConfirmation.cancelButton'),
           style: 'cancel',
         },
         {
@@ -140,11 +144,11 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
     return (
       <View style={styles.errorContainer}>
         <Text style={styles.errorText}>{error}</Text>
-        <TouchableOpacity 
-          style={styles.retryButton} 
+        <TouchableOpacity
+          style={styles.retryButton}
           onPress={() => {
             sdkLogger.info("User retrying template fetch");
-            loadTemplate(templateId, API_KEY);
+            loadTemplate(templateId, activeApiKey);
           }}
         >
           <Text style={styles.retryButtonText}>{t('common.retry') || 'Retry'}</Text>
@@ -163,7 +167,6 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
     );
   }
 
-
   return (
     <TemplateKYCFlowProvider
       template={template}
@@ -179,7 +182,10 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
       }}
       onCancel={OnCancel}
       initialLanguage={language}
-      apiKey={API_KEY}
+      // 🚨 3. Pass the resolved active API key down to the provider! 
+      // The context/hooks will automatically use this key.
+      apiKey={activeApiKey}
+      testApiKey={TEST_API_KEY} 
       env={env}
       existingSessionId={existingSessionId}
       initialComponentIndex={initialComponentIndex}

package/src/config/KYCConfig.ts

@@ -4,10 +4,11 @@ class KYCConfig {
     private static instance: KYCConfig;
     private backendEnvironment: BackendEnvironment = 'PRODUCTION';
 
-    private backendUrls: Record<BackendEnvironment, string> = {
+    // 🚨 Use a string record to safely handle 'TEST' or 'SANDBOX' aliases 
+    private backendUrls: Record<string, string> = {
         PRODUCTION: 'https://service.sanctumkey.com/api/v1',
-        // TEST: 'https://kyc-backend.transfergratis.net/api/v1', 
-        TEST: 'https://api.sanctumkey.com/api/v1', 
+        TEST: 'https://api.sanctumkey.com/api/v1',
+        SANDBOX: 'https://kyc-backend.transfergratis.net/api/v1',
     };
 
     private constructor() { }
@@ -24,7 +25,8 @@ class KYCConfig {
     }
 
     public getBackendUrl(): string {
-        return this.backendUrls[this.backendEnvironment];
+        // Fallback to PRODUCTION if an invalid env string is somehow passed
+        return this.backendUrls[this.backendEnvironment] || this.backendUrls['PRODUCTION'];
     }
 
     public getBackendEnvironment(): BackendEnvironment {
@@ -32,4 +34,4 @@ class KYCConfig {
     }
 }
 
-export default KYCConfig.getInstance();
+export default KYCConfig.getInstance();

package/src/hooks/useTemplateKYCFlow.tsx

@@ -33,6 +33,7 @@ interface TemplateKYCFlowProviderProps {
   onCancel?: () => void;
   initialLanguage?: string;
   apiKey?: string;
+  testApiKey?: string;
   env?: KycEnvironment;
   existingSessionId?: string;
   /** Index in template.components where to resume (0-based). Simple to store in template table. */