Merge pull request #53 from linkfang/dev

Improved upload process to fix a bug on prod
linkfang · Jan 20, 2024 · 21d44eb · 21d44eb
2 parents 638756e + e1008de
commit 21d44eb
Showing 1 changed file with 61 additions and 65 deletions.
diff --git a/src/components/employee/UploadEmployeeModal.tsx b/src/components/employee/UploadEmployeeModal.tsx
@@ -62,77 +62,73 @@ const UploadEmployeeModal = ({ openUpload, setOpenUpload }: TUploadEmployeeModal
     maxCount: 1,
     accept: '.csv',
     style: { marginTop: 20 },
-    onChange: (info) => {
-      if (!existingData) return
-
-      const { status, error, originFileObj } = info.file
-
-      if (error) {
-        notification.error({ message: `${error}` })
-        return
-      }
-
-      if (status === 'done' && originFileObj)
-        parse(originFileObj, {
-          header: true,
-          skipEmptyLines: true,
-          complete: ({ data: uploadData }: { data: TUploadPersonData[] }) => {
-            // check if all required column/headers are included
-            const missingColumns = requiredColumns.filter((field) => !uploadData[0].hasOwnProperty(field))
-            const missingColumnsLength = missingColumns.length
-            const moreThanOneMissing = missingColumnsLength > 1
-
-            if (missingColumnsLength > 0) {
-              setUploadingItems(undefined)
-              notification.error({
-                message: `${missingColumns.join(', ')} column${moreThanOneMissing ? 's are' : ' is'} missing`,
-              })
-              return
+    onDrop: (info) => {
+      if (info.dataTransfer.files[0].type !== 'text/csv') notification.error({ message: 'Only supports .csv files' })
+    },
+    beforeUpload: (file) => {
+      if (!existingData) return false
+
+      parse(file, {
+        header: true,
+        skipEmptyLines: true,
+        complete: ({ data: uploadData }: { data: TUploadPersonData[] }) => {
+          // check if all required column/headers are included
+          const missingColumns = requiredColumns.filter((field) => !uploadData[0].hasOwnProperty(field))
+          const missingColumnsLength = missingColumns.length
+          const moreThanOneMissing = missingColumnsLength > 1
+
+          if (missingColumnsLength > 0) {
+            setUploadingItems(undefined)
+            notification.error({
+              message: `${missingColumns.join(', ')} column${moreThanOneMissing ? 's are' : ' is'} missing`,
+            })
+            setUploadingItems(undefined)
+            setInvalidItem(undefined)
+            return false
+          }
+
+          if (uploadData.length > 6) {
+            notification.error({ message: 'Demo version can only upload 6 or less employees at a time' })
+            return false
+          }
+
+          const invalidItems: TUploadPersonData[] = []
+          uploadData.forEach((item, index) => {
+            if (!isValidEmail(item.email)) {
+              invalidItems.push({ ...item, errorType: 'Invalid Email' })
+              return false
             }
 
-            if (uploadData.length > 6) {
-              notification.error({ message: 'Demo version can only upload 6 or less employees at a time' })
-              return
+            const isFieldEmpty = requiredColumns.some((field) =>
+              field === 'preferredName' ? false : !item[field].replaceAll(' ', '')
+            )
+            if (isFieldEmpty) {
+              invalidItems.push({ ...item, errorType: 'Empty Field' })
+              return false
             }
 
-            const invalidItems: TUploadPersonData[] = []
-            uploadData.forEach((item, index) => {
-              if (!isValidEmail(item.email)) {
-                invalidItems.push({ ...item, errorType: 'Invalid Email' })
-                return
-              }
-
-              const isFieldEmpty = requiredColumns.some((field) =>
-                field === 'preferredName' ? false : !item[field].replaceAll(' ', '')
-              )
-              if (isFieldEmpty) {
-                invalidItems.push({ ...item, errorType: 'Empty Field' })
-                return
-              }
-
-              const isExist = existingData.find((current) => current.email === item.email.replaceAll(' ', ''))
-              if (isExist) {
-                invalidItems.push({ ...item, errorType: 'Email Already Exists' })
-                return
-              }
-
-              const isDuplicated = uploadData.findIndex((ele) => ele.email === item.email) !== index
-              if (isDuplicated) invalidItems.push({ ...item, errorType: 'Duplicated Email' })
-            })
-
-            if (invalidItems.length > 0) {
-              setUploadingItems(undefined)
-              setInvalidItem(invalidItems)
-              return
+            const isExist = existingData.find((current) => current.email === item.email.replaceAll(' ', ''))
+            if (isExist) {
+              invalidItems.push({ ...item, errorType: 'Email Already Exists' })
+              return false
             }
 
-            setInvalidItem(undefined)
-            setUploadingItems(uploadData)
-          },
-        })
-    },
-    onDrop: (info) => {
-      if (info.dataTransfer.files[0].type !== 'text/csv') notification.error({ message: 'Only supports .csv files' })
+            const isDuplicated = uploadData.findIndex((ele) => ele.email === item.email) !== index
+            if (isDuplicated) invalidItems.push({ ...item, errorType: 'Duplicated Email' })
+          })
+
+          if (invalidItems.length > 0) {
+            setUploadingItems(undefined)
+            setInvalidItem(invalidItems)
+            return false
+          }
+
+          setInvalidItem(undefined)
+          setUploadingItems(uploadData)
+        },
+      })
+
+      return false
     },
   }