@sanctum-key/react-native-sdk 1.0.18 → 1.0.20

package/src/modules/api/KYCService.ts

@@ -281,7 +281,7 @@ export class KYCService {
   }
 
   //check templatetemplate_type
-  async checkTemplateType(params: { fileUri: string; docType: string; docRegion: string; token: string; postfix: string }, env: KycEnvironment = 'PRODUCTION'): Promise<any> {
+  async checkTemplateType(params: { fileUri: string; docType: string; docRegion: string; token: string; postfix: string}, env: KycEnvironment = 'PRODUCTION'): Promise<any> {
     // SANDBOX mode
     if (env === 'SANDBOX') {
       console.log("SANDBOX mode: Skipping AI template type check");
@@ -296,7 +296,6 @@ export class KYCService {
     const { fileUri, docType, docRegion, token, postfix } = params;
     const formData = new FormData();
     
-    // ✅ FIX: Dynamically assign the postfix to the filename
     await appendFileToFormData(formData, 'file', fileUri, `id_card_${postfix}.jpg`, 'image/jpeg');
 
     const docTypeShorted = GovernmentDocumentTypeShorted[docType as GovernmentDocumentType];
@@ -317,29 +316,75 @@ export class KYCService {
 
   }
 
-  async extractDocumentInformation(params: { fileUri: string; docType: string; docRegion: string; token: string; postfix?: string }): Promise<any> {
-    const { fileUri, docType, docRegion, token, postfix = 'front' } = params;
-    const formData = new FormData();
+  async extractDocumentInformation(params: { 
+    fileUri: string; 
+    docType: string; 
+    docRegion: string; 
+    templatePath: string; // 🚨 Required by API
+    issuingSubdivision?: string; // 🚨 Required for non-passports
+    token: string; 
+    postfix?: string 
+  }): Promise<any> {
+    const { fileUri, docType, docRegion, templatePath, issuingSubdivision, token, postfix = 'front' } = params;
     
-    // ✅ FIX: Dynamic filename
+    // 1. Prepare Form Data
+    const formData = new FormData();
+    // Prefixing with 'front' or 'back' as strictly required by the docs
     await appendFileToFormData(formData, 'file', fileUri, `id_card_${postfix}.jpg`, 'image/jpeg');
 
-    const url = `${this.textExtractionServiceURL}/extract_doc_information/?doc_type=${encodeURIComponent(docType)}&doc_region=${encodeURIComponent(docRegion)}`;
-    const attempt = async () => {
-      const res = await axios.post(url, formData, {
-        headers: { 'Content-Type': 'multipart/form-data', 'Authorization': `Bearer ${token}`, },
+    // 2. Build the URL with ALL required parameters
+    let queryParams = `doc_type=${encodeURIComponent(docType)}&doc_region=${encodeURIComponent(docRegion)}&template_path=${encodeURIComponent(templatePath)}`;
+    if (issuingSubdivision) {
+      queryParams += `&issuing_subdivision=${encodeURIComponent(issuingSubdivision)}`;
+    }
+    
+    const url = `${this.textExtractionServiceURL}/extract_doc_information/?${queryParams}`;
+
+    try {
+      // 3. Start the Job
+      const startRes = await axios.post(url, formData, {
+        headers: { 'Content-Type': 'multipart/form-data', 'Authorization': `Bearer ${token}` },
         timeout: 60000,
       });
-      logger.log('extractDocumentInformation res', JSON.stringify(truncateFields(res)));
+      
+      const jobId = startRes.data?.job_id;
+      if (!jobId) throw new Error("Backend did not return a job_id");
 
-      if (res.data?.detail) throw new Error(res.data.detail);
-      return res.data;
-    };
-    try {
-      return await attempt();
-    } catch (e) {
-      logger.error('Error extracting document information:', JSON.stringify(truncateFields(e)));
-      throw e;
+      logger.log(`Extraction job started: ${jobId}. Polling for results...`);
+
+      // 4. Poll the Status Endpoint
+      const statusUrl = `${this.textExtractionServiceURL}/extract_doc_information/status/${jobId}`;
+      
+      // Poll every 2 seconds, up to 15 times (30 seconds max)
+      const maxRetries = 15;
+      for (let i = 0; i < maxRetries; i++) {
+        // Wait 2 seconds before checking
+        await new Promise(resolve => setTimeout(resolve, 2000));
+        
+        const statusRes = await axios.get(statusUrl, {
+           headers: { 'Authorization': `Bearer ${token}` }
+        });
+
+        const statusData = statusRes.data;
+
+        if (statusData.status === 'completed') {
+          logger.log('Extraction completed successfully', JSON.stringify(truncateFields(statusData.result)));
+          return statusData.result; // 👈 Returns the actual extracted data
+        }
+
+        if (statusData.status === 'failed') {
+          throw new Error(statusData.error || "Document extraction failed during processing.");
+        }
+
+        // If 'processing', loop continues...
+      }
+
+      throw new Error("Document extraction timed out waiting for results.");
+
+    } catch (e: any) {
+      const errorMsg = e.response?.data?.detail || e.message;
+      logger.error('Error extracting document information:', errorMsg);
+      throw new Error(errorMsg);
     }
   }
 
@@ -412,24 +457,14 @@ export class KYCService {
        card_obb: { x: 50, y: 50, width: 200, height: 200 }
      };
    }
-
    const { fileUri, docType, docRegion, postfix = 'back', token, template_path, mrz_type } = params;
-   
-   // 1. Build the FormData ONLY for the file
-   const formData = new FormData();
-   const filePayload = {
-     uri: fileUri, 
-     type: 'image/jpeg',
-     name: `id_card_${postfix}.jpg`,
-   };
-   formData.append('file', filePayload as any);
 
+   // ... top of extractMrzText (params extraction, etc) ...
    const docTypeShorted = GovernmentDocumentTypeShorted[docType as GovernmentDocumentType] || docType;
    const safeMrzType = mrz_type && mrz_type.trim() !== '' ? mrz_type : 'TD1';
    
    logger.log("docTypeShorted", docTypeShorted, docRegion, postfix);
 
-   // 🚨 THE FIX: Pass all required text parameters in the URL query string for FastAPI
    const queryParams = new URLSearchParams({
        doc_type: docTypeShorted,
        doc_region: docRegion,
@@ -443,14 +478,52 @@ export class KYCService {
    logger.log("url", url);
 
    try {
-     const response = await fetch(url, {
-       method: 'POST',
-       headers: { 
-           'Authorization': `Bearer ${token}`,
-           'Accept': 'application/json'
-        },
-       body: formData, // Only the file goes in the body
-     });
+     let response;
+
+     if (Platform.OS === 'web') {
+         // 🚨 THE FIX: Completely bypass React Native Web's networking polyfills.
+         // We explicitly grab the browser's native APIs so the bundler cannot interfere.
+         const nativeFetch = window.fetch;
+         const NativeFormData = window.FormData;
+
+         const formData = new NativeFormData();
+         
+         // Fetch the Blob natively
+         const fileReq = await nativeFetch(fileUri);
+         const blob = await fileReq.blob();
+         
+         // Append the Blob. The native browser will perfectly handle the multipart boundary.
+         formData.append('file', blob, `id_card_${postfix}.jpg`);
+
+         // Execute using Native Fetch!
+         response = await nativeFetch(url, {
+             method: 'POST',
+             headers: { 
+                 'Authorization': `Bearer ${token}`,
+                 'Accept': 'application/json'
+             },
+             body: formData,
+         });
+
+     } else {
+         // 📱 MOBILE NATIVE: React Native's Native Bridge expects this exact object
+         const formData = new FormData();
+         const filePayload = {
+             uri: fileUri, 
+             type: 'image/jpeg',
+             name: `id_card_${postfix}.jpg`,
+         };
+         formData.append('file', filePayload as any);
+
+         response = await fetch(url, {
+             method: 'POST',
+             headers: { 
+                 'Authorization': `Bearer ${token}`,
+                 'Accept': 'application/json'
+             },
+             body: formData,
+         });
+     }
 
      if (!response.ok) {
          const errorText = await response.text();
@@ -458,19 +531,11 @@ export class KYCService {
          throw new Error(`Erreur serveur: ${response.status}`);
      }
 
-    //  const data = await response.json();
-    //  logger.log('extractMrzText res', JSON.stringify(data, null, 2));
-
-    //  if (Object.keys(data).length === 0) throw new Error('No data found');
-    //  if (data?.success === false) throw new Error(data.parsed_data?.status || 'Échec de l\'extraction MRZ');
-
-    //  return data;
-    const data = await response.json();
+     const data = await response.json();
      logger.log('extractMrzText res', JSON.stringify(data, null, 2));
 
      if (Object.keys(data).length === 0) throw new Error('No data found');
      
-     // 🚨 UPDATE THIS LINE to grab the actual status_message:
      if (data?.success === false) {
          const serverMessage = data.parsed_data?.status_message || data.parsed_data?.status || 'Échec de l\'extraction MRZ';
          throw new Error(`Lecture MRZ refusée: ${serverMessage}`);
@@ -559,41 +624,53 @@ export class KYCService {
   }
 
   async verificationSession(payload: VerificationSessionRequest): Promise<any> {
-    console.log('apiKey in verificationSession', payload.apiKey);
     try {
       const { session_id, step, data, templateId, action, apiKey } = payload;
+      
+      // 1. Safe Auth Resolution
       const token = apiKey ? undefined : await authentification();
+      
+      if (!apiKey && !token) {
+         throw new Error("Authentication failed: No API key or Token available.");
+      }
+
+
       const payloadData = {
         action: action,
         data: {
-          step,
-          templateId,
-          ...(action === "location_permission" ? { permissionGranted: true, } : {}),
-          ...data,
+          ...data, 
+          step: step,
+          templateId: templateId,
+          ...(action === "location_permission" ? { permissionGranted: true } : {}),
         },
-        ...({ session_id: session_id }),
-        timestamp: new Date().toISOString()
-      }
+        session_id: session_id,
+        timestamp: new Date().toISOString(),
+      };
+
       const url = `${KYCConfig.getBackendUrl()}/verification/api/kyc/sessions/${session_id}/steps/${step}/`;
 
+      // 3. Clean Logging
       const logPayload = truncateFields({ payloadData, session_id, step });
-      logger.log('verificationSession payload',
-        JSON.stringify(truncateFields({ logPayload, token: token ?? "-", path: url, apiKey }),
-          null, 2))
-
-      const res = await axios.post<SessionResponse>(url,
-        payloadData,
-        {
+      logger.log('verificationSession payload', JSON.stringify({ 
+          url,
+          apiKey: apiKey ? '***HIDDEN***' : 'None', // Don't log the raw API key!
+          token: token ? '***HIDDEN***' : 'None',
+          payload: logPayload 
+      }, null, 2));
+
+      // 4. API Execution
+      const res = await axios.post<SessionResponse>(url, payloadData, {
           headers: {
             'Content-Type': 'application/json',
             ...(apiKey ? { 'Authorization': `ApiKey ${apiKey}` } : { 'Authorization': `Bearer ${token}` })
           }
-        });
+      });
+      
       logger.log('verificationSession res', JSON.stringify(truncateFields(res.data), null, 2));
       return res.data;
 
     } catch (error) {
-      logger.error('Error validating component:', JSON.stringify(error, null, 2));
+      logger.error('Error validating component:', JSON.stringify(errorMessage(error), null, 2));
       throw new Error(errorMessage(error));
     }
   }
@@ -738,6 +815,54 @@ export class KYCService {
         throw error;
     }
 }
+
+// Inside KYCService.ts
+
+async validateBackTemplate(params: {
+  region: string;
+  docType: string;
+  frontTemplateName: string;
+  backTemplateName: string;
+  subRegion: string;
+  token: string;
+}, env: KycEnvironment = 'PRODUCTION'): Promise<any> {
+  if (env === 'SANDBOX') {
+    logger.log("SANDBOX mode: Skipping back template validation");
+    return { is_match: true, status_message: "SANDBOX: Valid Match" };
+  }
+
+  const { region, docType, frontTemplateName, backTemplateName, subRegion, token } = params;
+  
+  // 🚨 THE FIX: Format the payload as URL Query Parameters
+  const queryParams = new URLSearchParams({
+    region: region,
+    doc_type: docType,
+    front_template_name: frontTemplateName,
+    back_template_name: backTemplateName,
+    sub_region: subRegion || ""
+  }).toString();
+
+  const url = `${this.mrzServiceURL}/validate_back_template/?${queryParams}`;
+
+  logger.log('validateBackTemplate URL', url);
+
+  try {
+    // Pass `null` for the body since the data is now in the URL
+    const res = await axios.post(url, null, {
+      headers: { 
+        'Accept': 'application/json',
+        'Authorization': `Bearer ${token}` 
+      },
+      timeout: 20000,
+    });
+    logger.log('validateBackTemplate res', JSON.stringify(res.data, null, 2));
+    return res.data;
+  } catch (e: any) {
+    const errorMsg = e.response?.data?.detail || e.response?.data?.Error || e.message;
+    logger.error('Error validating back template:', JSON.stringify(errorMsg));
+    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Template validation failed');
+  }
+}
 }
 
 const kycService = new KYCService("", "");
@@ -782,8 +907,6 @@ export const authentification = async (): Promise<string> => {
     activeAuthRequest = (async () => {
       logger.log('Authenticating: Fetching new Keycloak token...');
       
-      // 🚨 FIX: Do NOT use URLSearchParams in React Native with Axios.
-      // Use a raw URL-encoded string to guarantee Keycloak understands the payload.
       const params = 'client_id=kyc_frontend&client_secret=QhgAmvKgmwODzsEp98dnA4PeUEMMaFHd&grant_type=client_credentials';
       
       const res = await axios.post(

package/src/web/WebKYCEntry.tsx

@@ -111,6 +111,7 @@ export function WebKYCEntry({
   onCancel,
   onSessionSave,
 }: WebKYCEntryProps): JSX.Element {
+  console.log('first')
   const { setLocale } = useI18n();
   const [urlParams, setUrlParams] = useState<URLParams>({});
   const [isLoading, setIsLoading] = useState(true);
@@ -204,7 +205,6 @@ export function WebKYCEntry({
     }
   }, [urlParams]);
 
-  // Handle KYC completion
   const handleComplete = useCallback(async (data: any) => {
     console.log('KYC completed:', data);
 
@@ -214,15 +214,48 @@ export function WebKYCEntry({
     // Handle Push URL webhook if provided
     if (urlParams.push_url) {
       try {
+        const innerResult = data?.result?.result || data?.result || data;
+        const nestedDataMap = innerResult?.data;
+        
+        let kycSessionId = data?.session_id || urlParams.kyc_id || '';
+        let parsedKycData: any = null;
+
+        if (nestedDataMap) {
+          const mapKeys = Object.keys(nestedDataMap);
+          if (mapKeys.length > 0) {
+            const detectedSessionId = mapKeys.find(key => key.startsWith('kyc-')) || mapKeys[0];
+            if (detectedSessionId) {
+              kycSessionId = detectedSessionId;
+            }
+            
+            const rawData = nestedDataMap[kycSessionId]?.data;
+
+            if (typeof rawData === 'string') {
+              try {
+                parsedKycData = JSON.parse(rawData);
+              } catch (parseErr) {
+                console.warn('Failed parsing inner stringified JSON string:', parseErr);
+                parsedKycData = rawData;
+              }
+            } else {
+              parsedKycData = rawData;
+            }
+          }
+        }
+
+        const finalSessionId = kycSessionId || parsedKycData?.session_id || urlParams.kyc_id || 'unknown';
+
+        // 3. Build your exact un-nested payload signature
         const verificationState = {
-          status: 'success', // verification completed successfully
-          result: data, // pass complete data object as result
-          reference_id: urlParams.reference_id,
+          session_id: finalSessionId,
+          status: 'success',
+          message: innerResult?.message || 'Verification data retrieved successfully.',
+          data: parsedKycData || {}
         };
+
         await postWebhook(urlParams.push_url, verificationState, 5000);
-        console.log('Successfully pushed KYC data to webhook');
+        console.log('Successfully pushed beautifully clean KYC data payload to webhook');
       } catch (err) {
-        // Fail open - redirect anyway even if webhook fails
         console.warn('Failed to push data to webhook URL:', err);
       }
     }
@@ -238,6 +271,7 @@ export function WebKYCEntry({
         liveness_checked: data.livenessCheckComplete || false,
       },
     });
+
     onComplete?.(data);
   }, [redirectToReturnUrl, urlParams, onComplete]);
 
@@ -311,6 +345,7 @@ export function WebKYCEntry({
   useEffect(() => {
     try {
       const params = parseUrlParams();
+
       setUrlParams(params);
 
       // Set language if provided
@@ -447,4 +482,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default WebKYCEntry;
+export default WebKYCEntry;