From a2bbd88df7c9d051a94abfde895b7ab2141bc709 Mon Sep 17 00:00:00 2001
From: Rizqika <rizqikaibnu@gmail.com>
Date: Mon, 9 Dec 2024 11:43:11 +0700
Subject: [PATCH] Solve - KTP

---
 src/screens/Biometric/OcrKtp/Verify.jsx | 56 ++++++++++++++++---------
 1 file changed, 36 insertions(+), 20 deletions(-)

diff --git a/src/screens/Biometric/OcrKtp/Verify.jsx b/src/screens/Biometric/OcrKtp/Verify.jsx
index d4bdaeb..b6dacd7 100644
--- a/src/screens/Biometric/OcrKtp/Verify.jsx
+++ b/src/screens/Biometric/OcrKtp/Verify.jsx
@@ -142,41 +142,51 @@ const Verify = () => {
     
     // Update handleImageUpload to include dimension checking
     const handleImageUpload = async (file) => {
+        // Clear previous states
         setErrorMessage('');
-        setFile(file);
-        setSelectedImageName(file.name);
-    
+        setImageError('');
+        
         try {
-            // Check if file is PNG
+            // Validate file existence
+            if (!file) {
+                throw new Error('Please select a file');
+            }
+    
+            // Check file type
             if (file.type === 'image/png') {
-                setImageError('The image format is not suitable. Only JPG and JPEG files are allowed.');
-                setFile(null);
-                setSelectedImageName('');
-                return;
+                throw new Error('The image format is not suitable. Only JPG and JPEG files are allowed.');
             }
     
-            // Validate file type
             if (!fileTypes.includes(file.type)) {
-                setImageError('Invalid file type. Only JPG and JPEG are allowed.');
-                return;
+                throw new Error('Invalid file type. Only JPG and JPEG are allowed.');
             }
     
-            // Validate file size
-            if (file.size > 2 * 1024 * 1024) {
-                setImageError('File size exceeds 2MB.');
-                return;
+            // Check file size (2MB = 2 * 1024 * 1024 bytes)
+            const maxSize = 2 * 1024 * 1024;
+            if (file.size > maxSize) {
+                throw new Error('File size exceeds 2MB.');
             }
     
+            // If all validations pass, then set the file states
+            setFile(file);
+            setSelectedImageName(file.name);
+            
             // Validate image dimensions
             await checkImageDimensions(file);
-            setImageError('');
-            
+    
         } catch (error) {
-            setImageError(error);
+            // Clear all file-related states when validation fails
             setFile(null);
             setSelectedImageName('');
+            setImageError(error.message);
+            
+            // Reset file input
+            if (fileInputRef.current) {
+                fileInputRef.current.value = '';
+            }
         }
-    };    
+    };
+      
 
     const handleImageCancel = () => {
         setFile(null);
@@ -605,9 +615,15 @@ const Verify = () => {
                                 className="form-control"
                                 style={{ display: 'none' }}
                                 accept="image/jpeg, image/jpg"
-                                onChange={(e) => handleImageUpload(e.target.files[0])}
+                                onChange={(e) => {
+                                    const selectedFile = e.target.files[0];
+                                    handleImageUpload(selectedFile);
+                                    // Reset input value to allow selecting the same file again
+                                    e.target.value = '';
+                                }}
                             />
 
+
                             {/* Display selected file info */}
                             {selectedImageName && (
                                 <div className="mt-3">