Merge pull request #1550 from Vizzuality/MRXN23-484-fe-consider-wheth…

…er-to [MRXN23-484]: notifies user about project creation ongoing
Vizzuality · Oct 17, 2023 · d3e6e3c · d3e6e3c · vercel · Oct 17, 2023
2 parents a593a57 + ca92321
commit d3e6e3c
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 3 deletions.
diff --git a/app/components/modal/component.tsx b/app/components/modal/component.tsx
@@ -22,7 +22,7 @@ const CONTENT_CLASSES = {
   wide: `w-full sm:w-10/12 md:w-10/12 lg:w-10/12 xl:w-9/12 2xl:w-6/12 ${COMMON_CONTENT_CLASSES}`,
 };
 
-const OVERLAY_CLASSES = 'z-50 fixed inset-0 bg-black bg-blur';
+const OVERLAY_CLASSES = 'z-40 fixed inset-0 bg-black bg-blur';
 
 export const Modal: React.FC<ModalProps> = ({
   id,

diff --git a/app/layout/projects/new/form/component.tsx b/app/layout/projects/new/form/component.tsx
@@ -92,15 +92,26 @@ const ProjectForm = ({ onFormUpdate }: ProjectFormProps): JSX.Element => {
       organizationId: organizationsData[0].id || '7f1fb7f8-1246-4509-89b9-f48b6f976e3f',
     } satisfies NewProjectFields & { organizationId: string };
 
+    addToast(
+      'info-project-creation',
+      <>
+        <h2 className="font-medium">Your project is being created.</h2>
+        <p className="text-sm">This might take a few seconds.</p>
+      </>,
+      {
+        level: 'info',
+      }
+    );
+
     saveProjectMutation.mutate(
       { data },
       {
         onSuccess: ({ data: { data: p } }) => {
           addToast(
             'success-project-creation',
             <>
-              <h2 className="font-medium">Success!</h2>
-              <p className="text-sm">Project saved successfully</p>
+              <h2 className="font-medium">Your project has been created.</h2>
+              <p className="text-sm">You will be redirected to the dashboard.</p>
             </>,
             {
               level: 'success',

diff --git a/app/layout/projects/new/form/planning-area-grid-uploader/component.tsx b/app/layout/projects/new/form/planning-area-grid-uploader/component.tsx
@@ -309,6 +309,7 @@ export const PlanningAreaGridUploader: React.FC<PlanningAreaGridUploaderProps> =
                         size="xl"
                         type="submit"
                         onClick={() => setOpened(false)}
+                        disabled={loading}
                       >
                         Save
                       </Button>