From 38ca6f99ada02a99c03cb4b33b7f3649f6eb7cf2 Mon Sep 17 00:00:00 2001
From: Arno <u21457451@tuks.co.za>
Date: Sun, 10 Sep 2023 17:05:37 +0200
Subject: [PATCH] Added loading modal when saving floor layout

---
 .../floorplan-editor-page.component.html      | 29 +++++++++++--------
 .../floorplan-editor-page.component.ts        | 22 +++-----------
 2 files changed, 21 insertions(+), 30 deletions(-)

diff --git a/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.html b/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.html
index 9ca93668..279ac89e 100644
--- a/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.html
+++ b/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.html
@@ -460,17 +460,22 @@ <h1 class="text-2xl font-semibold text-center mt-5" [ngClass]="{'text-white': !l
     [failure]="false"
     [linking]="true"
 ></event-participation-trends-toast-modal>
-<event-participation-trends-toast-modal
-  *ngIf="showToast"
-  class="transition-opacity duration-100 hidden opacity-0"
-  id="toast-modal"
-  [toastHeading]="toastHeading"
-  [toastMessage]="toastMessage" 
-  [toastType]="''"
-  [success]="showToastSuccess"
-  [failure]="showToastError"
-  [linking]="false"
-  (closeModalEvent)="closeToast()"
-  [busyUploadingFloorplan]="true"
+<event-participation-trends-toast-modal 
+    *ngIf="showToastSuccess"
+    class="z-50"
+    [toastMessage]="'Floor layout saved successfully.'" 
+    [toastType]="'success'"
+    [success]="true"
+    [failure]="false"
+    [linking]="false"
+></event-participation-trends-toast-modal>
+<event-participation-trends-toast-modal 
+    *ngIf="showToastError"
+    class="z-50"
+    [toastMessage]="'Error saving floor layout.'" 
+    [toastType]="'success'"
+    [success]="false"
+    [failure]="true"
+    [linking]="false"
 ></event-participation-trends-toast-modal>
 
diff --git a/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.ts b/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.ts
index 43f67235..75e9f8ad 100644
--- a/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.ts
+++ b/libs/app/components/src/lib/floorplan-editor-page/floorplan-editor-page.component.ts
@@ -2585,32 +2585,18 @@ export class FloorplanEditorPageComponent implements OnInit, AfterViewInit{
 
         // save the JSON data to the database
         this.appApiService.updateFloorLayout(this.eventId, jsonString).then((res: any) => {
-          this.showToastUploading = false;
-          res ? this.showToastSuccess = true : this.showToastError = true; 
-
-          this.toastHeading = res ? 'Success' : 'Error';
-          this.toastMessage = res ? 'Floor Layout Saved' : 'Error Saving Floor Layout';
           console.log(res);
 
           setTimeout(() => {
-            this.showToast = false;            
-            const toast = document.getElementById('toast-modal');
-            toast?.classList.remove('hidden');
-            setTimeout(() => {
-              toast?.classList.remove('opacity-0');
-            }, 100);
+            this.showToastUploading = false;
+            res ? this.showToastSuccess = true : this.showToastError = true; 
 
             setTimeout(() => {
-              toast?.classList.add('opacity-0');
-              setTimeout(() => {
-                toast?.classList.add('hidden');
-              }, 100);
               this.showToastSuccess = false;
               this.showToastError = false;
-              this.showToast = true;
               if (res) this.router.navigate(['details'], { relativeTo: this.route.parent });
-            })
-          }, 1500);
+            }, 1000)
+          }, 2000);
         });
       }