From ca923217127b5347c1f3c68c6072dcb2a7f54b40 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez=20Mu=C3=B1oz?=
 <andres.gonzalez@vizzuality.com>
Date: Mon, 16 Oct 2023 17:12:55 +0200
Subject: [PATCH] notifies user about project creation ongoing

---
 app/components/modal/component.tsx                |  2 +-
 app/layout/projects/new/form/component.tsx        | 15 +++++++++++++--
 .../planning-area-grid-uploader/component.tsx     |  1 +
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/app/components/modal/component.tsx b/app/components/modal/component.tsx
index 7688938e14..234b97e832 100644
--- 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
index 15f3418606..57f40f0a91 100644
--- a/app/layout/projects/new/form/component.tsx
+++ b/app/layout/projects/new/form/component.tsx
@@ -92,6 +92,17 @@ 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 },
       {
@@ -99,8 +110,8 @@ const ProjectForm = ({ onFormUpdate }: ProjectFormProps): JSX.Element => {
           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
index 3748bf309d..3f28ab992e 100644
--- 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>