Add isLoading considerations, add event handler for Cancel btn

src/sections/create-dataset/CreateDatasetForm.tsx

@@ -1,13 +1,16 @@
-import { ChangeEvent, FormEvent } from 'react'
+import { ChangeEvent, FormEvent, MouseEvent, useEffect } from 'react'
 import { Alert, Button, Col, Form, Row } from '@iqss/dataverse-design-system'
 import { useTranslation } from 'react-i18next'
 import { RequiredFieldText } from '../shared/form/RequiredFieldText/RequiredFieldText'
 import { SeparationLine } from '../shared/layout/SeparationLine/SeparationLine'
 import { useCreateDatasetForm, SubmissionStatusEnums } from './useCreateDatasetForm'
 import styles from '/src/sections/dataset/Dataset.module.scss'
+import { useLoading } from '../loading/LoadingContext'
 
 export function CreateDatasetForm() {
-  const { formErrors, submissionStatus, updateFormData, submitFormData } = useCreateDatasetForm()
+  const { isLoading, setIsLoading } = useLoading()
+  const { formErrors, submissionStatus, updateFormData, submitFormData, cancelFormSubmit } =
+    useCreateDatasetForm()
 
   const { t } = useTranslation('createDataset')
 
@@ -21,6 +24,14 @@ export function CreateDatasetForm() {
     submitFormData()
   }
 
+  const handleFormCancel = (event: MouseEvent<HTMLButtonElement>) => {
+    event.preventDefault()
+    cancelFormSubmit()
+  }
+  useEffect(() => {
+    setIsLoading(false)
+  }, [isLoading])
+
   return (
     <article>
       <header className={styles.header}>
@@ -66,7 +77,7 @@ export function CreateDatasetForm() {
           <Button type="submit" disabled={submissionStatus === SubmissionStatusEnums.IsSubmitting}>
             {t('saveButton')}
           </Button>
-          <Button withSpacing variant="secondary">
+          <Button withSpacing variant="secondary" type="button" onClick={handleFormCancel}>
             {t('cancelButton')}
           </Button>
         </Form>

src/sections/create-dataset/useCreateDatasetForm.tsx

@@ -3,6 +3,8 @@ import { DatasetFormFields } from '../../dataset/domain/models/DatasetFormFields
 import { createDataset } from '../../dataset/domain/useCases/createDataset'
 import { validateDataset } from '../../dataset/domain/useCases/validateDataset'
 import { DatasetValidationResponse } from '../../dataset/domain/models/DatasetValidationResponse'
+import { useNavigate } from 'react-router-dom'
+import { Route } from '../Route.enum'
 interface FormContextInterface {
   fields: DatasetFormFields
 }
@@ -52,12 +54,18 @@ export function useCreateDatasetForm() {
       setSubmissionStatus(SubmissionStatusEnums.Errored)
     }
   }
+  const navigate = useNavigate()
+  const cancelFormSubmit = () => {
+    const path = Route.HOME
+    navigate(path)
+  }
 
   return {
     formState,
     formErrors,
     submissionStatus,
     updateFormData,
-    submitFormData
+    submitFormData,
+    cancelFormSubmit
   }
 }