fix: clean image_url when mention type is not highlight

research-software-directory · Oct 24, 2022 · 160f65b · 160f65b
1 parent 0b08e2b
commit 160f65b
Showing 1 changed file with 16 additions and 7 deletions.
diff --git a/frontend/components/mention/EditMentionModal.tsx b/frontend/components/mention/EditMentionModal.tsx
@@ -60,14 +60,16 @@ export default function EditMentionModal({open, onCancel, onSubmit, item, pos, t
   // console.group('EditMentionModal')
   // console.log('isValid...', isValid)
   // console.log('isDirty...', isDirty)
+  // console.log('errors...', errors)
+  // console.log('formData...', formData)
   // console.groupEnd()
 
   useEffect(() => {
     if (item) {
       //(re)set form to item values
       reset(item)
     }
-  }, [item,reset])
+  }, [item, reset])
 
   function handleCancel(reason:any) {
     if (reason === 'backdropClick') {
@@ -81,6 +83,14 @@ export default function EditMentionModal({open, onCancel, onSubmit, item, pos, t
     onCancel()
   }
 
+  function onSubmitForm(data: MentionItemProps) {
+    // we need to clean image_url data
+    if (data.mention_type !== 'highlight') {
+      data.image_url = null
+    }
+    onSubmit({data, pos})
+  }
+
   return (
      <Dialog
       // use fullScreen modal for small screens (< 600px)
@@ -100,7 +110,7 @@ export default function EditMentionModal({open, onCancel, onSubmit, item, pos, t
       </DialogTitle>
       <form
         id={formId}
-        onSubmit={handleSubmit((data: MentionItemProps) => onSubmit({data, pos}))}
+        onSubmit={handleSubmit(onSubmitForm)}
         autoComplete="off"
       >
         {/* hidden inputs */}
@@ -204,7 +214,7 @@ export default function EditMentionModal({open, onCancel, onSubmit, item, pos, t
             rules={config.url.validation}
           />
           <div className="py-2"></div>
-          {formData.mention_type === 'highlight' &&
+          {formData.mention_type === 'highlight' ?
             <ControlledTextField
               control={control}
               options={{
@@ -213,16 +223,15 @@ export default function EditMentionModal({open, onCancel, onSubmit, item, pos, t
                 useNull: true,
                 defaultValue: formData?.image_url,
                 helperTextMessage: config.image_url.help,
-                helperTextCnt: `${formData?.image_url?.length || 0}/${config.image_url.validation.maxLength.value}`,
-                disabled: formData.mention_type !== 'highlight'
+                helperTextCnt: `${formData?.image_url?.length || 0}/${config.image_url.validation.maxLength.value}`
               }}
-              rules={formData.mention_type === 'highlight' ? config.image_url.validation : undefined}
+              rules={config.image_url.validation}
             />
+            :null
           }
           <Alert severity="warning" sx={{marginTop: '1.5rem'}}>
             {/* <AlertTitle sx={{fontWeight: 500}}>Validate entered information</AlertTitle> */}
             Please double check the data because this entry <strong>cannot be edited after it has been created</strong>.
-            {/* You can only delete it and create new one. */}
           </Alert>
         </DialogContent>
         <DialogActions sx={{