@transfergratis/react-native-sdk 0.1.24 → 0.1.26

package/src/components/TemplateKYCFlowRefactored.tsx

@@ -14,6 +14,12 @@ import { ReviewSubmitTemplate } from './KYCElements/ReviewSubmitTemplate';
 import { VerificationProgressTemplate } from './KYCElements/VerificationProgressTemplate';
 import { useTemplateLoader } from '../hooks/useTemplateLoader';
 import { WelcomeTemplate } from './KYCElements/WelcomeTemplate';
+import { EmailVerificationTemplate } from './KYCElements/EmailVerificationTemplate';
+import { PhoneVerificationTemplate } from './KYCElements/PhoneVerificationTemplate';
+import { PersonalInformationTemplate } from './KYCElements/PersonalInformationTemplate';
+import { AdditionalDocumentsTemplate } from './KYCElements/AdditionalDocumentsTemplate';
+import { KycEnvironment, BackendEnvironment } from '../types/env.types';
+import KYCConfig from '../config/KYCConfig';
 
 interface TemplateKYCFlowProps {
   template?: KYCTemplate;        // Format SDK direct (existing, now optional)
@@ -23,6 +29,13 @@ interface TemplateKYCFlowProps {
   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)
+  existingSessionId?: string;
+  /** Index in template.components (0-based) to resume at — e.g. from URL component_index or template table */
+  initialComponentIndex?: number;
+  /** Pays / type de document depuis l'URL de reprise (reprise multi-appareil) */
+  initialCountryResume?: { code: string; documentType: string; region?: string };
 }
 
 export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
@@ -33,10 +46,22 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
   language = 'fr',
   onCancel,
   API_KEY,
+  env = 'PRODUCTION',
+  serverEnv,
+  existingSessionId,
+  initialComponentIndex,
+  initialCountryResume,
 }) => {
   const { t } = useI18n();
   const { template: loadedTemplate, isLoading, error, loadTemplate } = useTemplateLoader();
 
+  // Which backend URL to call (independent from flow env)
+  useEffect(() => {
+    if (serverEnv !== undefined) {
+      KYCConfig.setBackendEnvironment(serverEnv);
+    }
+  }, [serverEnv]);
+
   // Validate props
   useEffect(() => {
     if (!providedTemplate && !templateId) {
@@ -123,6 +148,10 @@ export const TemplateKYCFlow: React.FC<TemplateKYCFlowProps> = ({
       onCancel={OnCancel}
       initialLanguage={language}
       apiKey={API_KEY}
+      env={env}
+      existingSessionId={existingSessionId}
+      initialComponentIndex={initialComponentIndex}
+      initialCountryResume={initialCountryResume}
     >
       <TemplateKYCFlowContent onCancel={OnCancel} />
     </TemplateKYCFlowProvider>
@@ -187,6 +216,18 @@ const TemplateKYCFlowContent: React.FC<{ onCancel?: () => void }> = ({ onCancel
       case 'review_submit':
         return <ReviewSubmitTemplate {...commonProps} />;
 
+      case 'email_verification':
+        return <EmailVerificationTemplate {...commonProps} />;
+
+      case 'phone_verification':
+        return <PhoneVerificationTemplate {...commonProps} />;
+
+      case 'personal_information':
+        return <PersonalInformationTemplate {...commonProps} />;
+
+      case 'additional_documents':
+        return <AdditionalDocumentsTemplate {...commonProps} />;
+
       case 'verification_progress':
         return <VerificationProgressTemplate {...commonProps} />;
 
@@ -215,7 +256,10 @@ const TemplateKYCFlowContent: React.FC<{ onCancel?: () => void }> = ({ onCancel
         {(state.showCustomStepper && state.session.isInitialized) ? (
           <View style={styles.header}>
             <Text style={styles.progressText}>
-              {t('kyc.step', { current: state.currentComponentIndex + 1, total: state.template.components.length })}
+              {t('kyc.step', {
+                current: (state.template.components.findIndex(c => c.id === currentComponent.id) + 1) || (state.currentComponentIndex + 1),
+                total: state.template.components.length,
+              })}
             </Text>
             <View style={styles.progressContainer}>
               <View style={styles.progressBar}>
@@ -238,7 +282,7 @@ const TemplateKYCFlowContent: React.FC<{ onCancel?: () => void }> = ({ onCancel
         ) : null}
 
         {/* Contenu principal */}
-        <ScrollView 
+        <ScrollView
           style={styles.scrollView}
           contentContainerStyle={styles.content}
           showsVerticalScrollIndicator={Platform.OS === 'web'}

package/src/config/KYCConfig.ts

@@ -0,0 +1,34 @@
+import { BackendEnvironment } from '../types/env.types';
+
+class KYCConfig {
+    private static instance: KYCConfig;
+    private backendEnvironment: BackendEnvironment = 'PRODUCTION';
+
+    private backendUrls: Record<BackendEnvironment, string> = {
+        PRODUCTION: 'https://service.sanctumkey.com/api/v1',
+        TEST: 'https://kyc-backend.transfergratis.net/api/v1', // Placeholder URL
+    };
+
+    private constructor() { }
+
+    public static getInstance(): KYCConfig {
+        if (!KYCConfig.instance) {
+            KYCConfig.instance = new KYCConfig();
+        }
+        return KYCConfig.instance;
+    }
+
+    public setBackendEnvironment(env: BackendEnvironment) {
+        this.backendEnvironment = env;
+    }
+
+    public getBackendUrl(): string {
+        return this.backendUrls[this.backendEnvironment];
+    }
+
+    public getBackendEnvironment(): BackendEnvironment {
+        return this.backendEnvironment;
+    }
+}
+
+export default KYCConfig.getInstance();

package/src/config/allowedDomains.ts

@@ -16,6 +16,7 @@ const DEFAULT_CONFIG: AllowedDomainConfig = {
     'www.transfergratis.com',
     'admin.transfergratis.com',
     'dashboard.transfergratis.com',
+    'preweb.transfergratis.net',
     // Add other trusted domains here
   ],
   enforceHttps: true,
@@ -45,7 +46,7 @@ export const getAllowedDomainsConfig = (): AllowedDomainConfig => {
  */
 export const isDomainAllowed = (domain: string): boolean => {
   const config = getAllowedDomainsConfig();
-  
+
   // Allow localhost in development
   if (config.allowLocalhost && (domain === 'localhost' || domain.startsWith('127.0.0.1'))) {
     return true;
@@ -57,12 +58,12 @@ export const isDomainAllowed = (domain: string): boolean => {
     if (domain === allowedDomain) {
       return true;
     }
-    
+
     // Subdomain match (e.g., app.transfergratis.com matches transfergratis.com)
     if (domain.endsWith('.' + allowedDomain)) {
       return true;
     }
-    
+
     return false;
   });
 };
@@ -71,30 +72,10 @@ export const isDomainAllowed = (domain: string): boolean => {
  * Validate if a URL is allowed for callback
  */
 export const isCallbackUrlAllowed = (url: string): { allowed: boolean; reason?: string } => {
-  const config = getAllowedDomainsConfig();
-
   try {
-    const urlObj = new URL(url);
-
-    // Check protocol
-    if (config.enforceHttps && urlObj.protocol !== 'https:') {
-      // Allow http for localhost in development
-      if (!(config.allowLocalhost && (urlObj.hostname === 'localhost' || urlObj.hostname.startsWith('127.0.0.1')))) {
-        return {
-          allowed: false,
-          reason: 'HTTPS required for callback URLs',
-        };
-      }
-    }
-
-    // Check domain
-    if (!isDomainAllowed(urlObj.hostname)) {
-      return {
-        allowed: false,
-        reason: `Domain '${urlObj.hostname}' is not in the allowed list`,
-      };
-    }
-
+    // Check if valid URL
+    new URL(url);
+    // Allow all URLs for redirection as requested
     return { allowed: true };
   } catch (error) {
     return {

package/src/hooks/useOrientationVideo.ts

@@ -6,6 +6,7 @@ import {
   OrientationVideoResult,
   OrientationType 
 } from '../types/KYC.types';
+import { KycEnvironment } from '../types/env.types';
 import kycService from '../modules/api/KYCService';
 
 export interface UseOrientationVideoReturn {
@@ -15,8 +16,8 @@ export interface UseOrientationVideoReturn {
 }
 
 export const useOrientationVideo = (
-  
-  config?: Partial<OrientationVideoConfig>
+  config?: Partial<OrientationVideoConfig>,
+  env: KycEnvironment = 'PRODUCTION'
 ): UseOrientationVideoReturn => {
   const defaultConfig: OrientationVideoConfig = {
     duration: 10,
@@ -66,7 +67,7 @@ export const useOrientationVideo = (
     setState(prev => ({ ...prev, isProcessing: true, error: null }));
 
     try {
-      const result = await kycService.processOrientationVideo(state.recordedVideo);
+      const result = await kycService.processOrientationVideo(state.recordedVideo, env);
       
       if (result.success && result.data) {
         setState(prev => ({ 
@@ -93,7 +94,7 @@ export const useOrientationVideo = (
       }));
       throw error;
     }
-  }, [state.recordedVideo, state.isProcessing, kycService]);
+  }, [state.recordedVideo, state.isProcessing, env]);
 
   const retake = useCallback(() => {
     if (state.retakeCount >= finalConfig.maxRetakes) {