@kernaq/verify-react-native 2.0.1 → 2.0.2

package/README.md

@@ -159,7 +159,7 @@ Never expose a live API key in your app. Instead, forward requests through your
 />
 ```
 
-Your backend endpoint receives a `multipart/form-data` POST with `document`, `selfie`, `video`, `document_type`, `country`, and `reference` fields. Forward it to `https://api.identity.kernaq.com/v1/verify` with your secret key.
+Your backend endpoint receives a `multipart/form-data` POST with `doc_front`, `doc_back`, `selfie`, `video`, `document_type`, `country`, and `reference` fields. Forward it to `https://api.identity.kernaq.com/v1/verify` with your secret key.
 
 ## Result object
 

package/dist/index.esm.js

@@ -954,6 +954,13 @@ function LivenessStep({ theme, locale, duration, taskCount = 2, onCapture }) {
     ;
     const [complete, setComplete] = useState(false);
     const [recording, setRecording] = useState(false);
+    // Keep a ref in sync with taskIdx so setTimeout/setInterval closures always
+    // read the latest value and don't stall on a stale snapshot.
+    const taskIdxRef = useRef(0);
+    const setTaskIdxSynced = (n)=>{
+        taskIdxRef.current = n;
+        setTaskIdx(n);
+    };
     const progressTimer = useRef(null);
     const taskTimer = useRef(null);
     const pulseAnim = useRef(new Animated.Value(1)).current;
@@ -982,13 +989,12 @@ function LivenessStep({ theme, locale, duration, taskCount = 2, onCapture }) {
     ]);
     const startTask = ()=>{
         if (!recording) {
-            // Begin recording when first task starts
             startRecording((video)=>{
                 onCapture(video.uri);
             }, ()=>{});
             setRecording(true);
         }
-        const task = tasks[taskIdx];
+        const task = tasks[taskIdxRef.current];
         if (!task) return;
         setStarted(true);
         setProgress(0);
@@ -1005,16 +1011,16 @@ function LivenessStep({ theme, locale, duration, taskCount = 2, onCapture }) {
         }, 80);
     };
     const nextTask = ()=>{
-        const next = taskIdx + 1;
+        const next = taskIdxRef.current + 1;
         setTaskDone((prev)=>prev + 1);
         if (next >= tasks.length) {
             finishLiveness();
             return;
         }
-        setTaskIdx(next);
+        setTaskIdxSynced(next);
         setStarted(false);
         setProgress(0);
-        // Short pause then auto-start next task
+        // Use the ref-based startTask via the timer so it reads the fresh taskIdx
         taskTimer.current = setTimeout(()=>startTask(), 500);
     };
     const finishLiveness = ()=>{
@@ -1490,6 +1496,16 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
     const [capture, setCapture] = useState({});
     const [result, setResult] = useState(null);
     const [error, setError] = useState(null);
+    // Mirror capture in a ref so submit() always reads the latest value even
+    // when called from inside a stale closure (e.g. goto → submit chain).
+    const captureRef = useRef({});
+    const setCaptureSync = (updater)=>{
+        setCapture((prev)=>{
+            const next = updater(prev);
+            captureRef.current = next;
+            return next;
+        });
+    };
     const theme = useMemo(()=>resolveTheme(themeProp), [
         themeProp
     ]);
@@ -1538,30 +1554,55 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         }
         setStep(s);
         if (s === 'processing') submit();
+    // submit is stable (no deps that change); locale/requestPermissions are stable refs
     // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [
-        capture,
         locale
     ]);
     const reset = useCallback(()=>{
         setStep('intro');
+        captureRef.current = {};
         setCapture({});
         setResult(null);
         setError(null);
     }, []);
     const submit = useCallback(async ()=>{
-        const { docFrontUri, docBackUri, selfieUri, videoUri } = capture;
+        const { docFrontUri, docBackUri, selfieUri, videoUri } = captureRef.current;
+        const steps = stepsProp ?? [
+            'document',
+            'selfie',
+            'liveness'
+        ];
+        if (steps.includes('document') && !docFrontUri) {
+            setError('Document capture is missing — please restart.');
+            setStep('result');
+            onError?.({
+                code: 'capture_missing',
+                message: 'Document capture missing'
+            });
+            return;
+        }
+        if (steps.includes('selfie') && !selfieUri) {
+            setError('Selfie capture is missing — please restart.');
+            setStep('result');
+            onError?.({
+                code: 'capture_missing',
+                message: 'Selfie capture missing'
+            });
+            return;
+        }
         const base = (backendUrl ?? 'https://api.identity.kernaq.com/v1').replace(/\/$/, '');
+        const endpoint = sandbox ? '/verify/sandbox' : '/verify';
         const form = new FormData();
         if (docFrontUri) {
-            form.append('document', {
+            form.append('doc_front', {
                 uri: docFrontUri,
                 name: 'doc_front.jpg',
                 type: 'image/jpeg'
             });
         }
         if (docBackUri) {
-            form.append('document_back', {
+            form.append('doc_back', {
                 uri: docBackUri,
                 name: 'doc_back.jpg',
                 type: 'image/jpeg'
@@ -1584,13 +1625,14 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         form.append('document_type', documentType);
         form.append('country', country);
         form.append('reference', reference ?? `kq_${Date.now()}`);
-        if (sandbox) form.append('sandbox', 'true');
-        const headers = {
-            'Content-Type': 'multipart/form-data'
-        };
+        // sandbox is handled via URL routing above — no form field needed
+        // Do NOT set Content-Type manually — RN fetch will set multipart/form-data with
+        // the correct boundary automatically. Setting it manually omits the boundary and
+        // causes the server to reject the request.
+        const headers = {};
         if (apiKey) headers['X-API-Key'] = apiKey;
         try {
-            const res = await fetch(`${base}/verify`, {
+            const res = await fetch(`${base}${endpoint}`, {
                 method: 'POST',
                 headers,
                 body: form
@@ -1620,9 +1662,8 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
             });
         }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        capture
-    ]);
+    }, []) // no deps — always reads from captureRef.current, never from stale closure
+    ;
     return /*#__PURE__*/ React.createElement(Modal, {
         visible: visible,
         animationType: "slide",
@@ -1649,7 +1690,7 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         locale: locale,
         side: "front",
         onCapture: (uri)=>{
-            setCapture((c)=>({
+            setCaptureSync((c)=>({
                     ...c,
                     docFrontUri: uri
                 }));
@@ -1661,14 +1702,14 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         side: "back",
         frontUri: capture.docFrontUri,
         onCapture: (uri)=>{
-            setCapture((c)=>({
+            setCaptureSync((c)=>({
                     ...c,
                     docBackUri: uri
                 }));
             next('doc-back');
         },
         onRetakeFront: ()=>{
-            setCapture((c)=>({
+            setCaptureSync((c)=>({
                     ...c,
                     docFrontUri: undefined
                 }));
@@ -1678,7 +1719,7 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         theme: theme,
         locale: locale,
         onCapture: (uri)=>{
-            setCapture((c)=>({
+            setCaptureSync((c)=>({
                     ...c,
                     selfieUri: uri
                 }));
@@ -1690,7 +1731,7 @@ function KernaqVerify({ visible, apiKey, backendUrl, country = 'KEN', reference,
         duration: livenessDuration,
         taskCount: livenessTaskCount,
         onCapture: (uri)=>{
-            setCapture((c)=>({
+            setCaptureSync((c)=>({
                     ...c,
                     videoUri: uri
                 }));