survey import: prevent starting multiple import jobs (#3024)

Co-authored-by: Stefano Ricci <[email protected]>
openforis · Sep 20, 2023 · d951fa5 · d951fa5
1 parent 478016d
commit d951fa5
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 6 deletions.
diff --git a/webapp/components/survey/SurveyCreate/SurveyCreate.js b/webapp/components/survey/SurveyCreate/SurveyCreate.js
@@ -50,6 +50,7 @@ const SurveyCreate = (props) => {
     cloneFromCycle,
     options,
     file,
+    uploading,
     uploadProgressPercent,
   } = newSurvey
 
@@ -62,6 +63,7 @@ const SurveyCreate = (props) => {
     <div className="home-survey-create">
       <div className="row">
         <ButtonGroup
+          disabled={uploading}
           groupName={template ? 'templateCreateType' : 'surveyCreateType'}
           selectedItemKey={createType}
           onChange={onCreateTypeUpdate}
@@ -89,6 +91,7 @@ const SurveyCreate = (props) => {
       </div>
       <FormItem label={i18n.t('common.name')}>
         <Input
+          disabled={uploading}
           id={TestId.surveyCreate.surveyName}
           value={name}
           validation={Validation.getFieldValidation('name')(validation)}
@@ -159,7 +162,7 @@ const SurveyCreate = (props) => {
 
       {createType === createTypes.import && showImport && (
         <>
-          {uploadProgressPercent >= 0 ? (
+          {uploading && uploadProgressPercent >= 0 ? (
             <div className="row">
               <ProgressBar indeterminate={false} progress={uploadProgressPercent} />
             </div>
@@ -204,7 +207,7 @@ const SurveyCreate = (props) => {
               <div className="row">
                 <Button
                   className="btn-primary"
-                  disabled={!file}
+                  disabled={!file || uploading}
                   label={'homeView.surveyCreate.startImport'}
                   onClick={onImport}
                   testId={TestId.surveyCreate.startImportBtn}

diff --git a/webapp/components/survey/SurveyCreate/store/actions/useOnImport.js b/webapp/components/survey/SurveyCreate/store/actions/useOnImport.js
@@ -24,17 +24,17 @@ export const useOnImport = ({ newSurvey, setNewSurvey }) => {
   return useCallback(async () => {
     const { file, source, ...surveyObj } = newSurvey
 
+    // reset upload progress (hide progress bar)
+    setNewSurvey({ ...newSurvey, uploadProgressPercent: -1, uploading: true })
+
     const formData = objectToFormData({ file, survey: JSON.stringify(surveyObj) })
 
     const onUploadProgress = (progressEvent) => {
       const uploadProgressPercent = Math.round((progressEvent.loaded / progressEvent.total) * 100)
-      setNewSurvey({ ...newSurvey, uploadProgressPercent })
+      setNewSurvey({ ...newSurvey, uploadProgressPercent, uploading: uploadProgressPercent < 100 })
     }
     const { data } = await axios.post(urlBasedOnSource[source], formData, { onUploadProgress })
 
-    // reset upload progress (hide progress bar)
-    setNewSurvey({ ...newSurvey, uploadProgressPercent: -1 })
-
     const { job, validation } = data
 
     if (job && (!validation || Validation.isValid(validation))) {
@@ -53,6 +53,7 @@ export const useOnImport = ({ newSurvey, setNewSurvey }) => {
       setNewSurvey({
         ...newSurvey,
         validation,
+        uploading: false,
       })
     }
   }, [dispatch, newSurvey, setNewSurvey])