From 3ea9c2285d1633e78e6c0ab528b84fbedf95e588 Mon Sep 17 00:00:00 2001
From: bramjanssen <bram.janssen@vito.be>
Date: Thu, 5 Oct 2023 20:35:28 +0200
Subject: [PATCH] feat: added loading indicator to the screen

---
 src/app/map/map.page.html            |  2 ++
 src/app/map/map.page.scss            |  6 +++++-
 src/app/services/vineyard.service.ts | 10 ++++++++++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/app/map/map.page.html b/src/app/map/map.page.html
index e7535b8..18c1829 100644
--- a/src/app/map/map.page.html
+++ b/src/app/map/map.page.html
@@ -5,6 +5,8 @@
   <app-search [class.mobile]="utilService.isMobile()" (setLocation)="zoomToLocation($event)"></app-search>
 </ion-content>
 
+<ion-progress-bar type="indeterminate"  *ngIf="vineyardService.getIsVineyardsLoading() | async"></ion-progress-bar>
+
 <div id="legend">
   <div class="legend-item">
     <div class="color" [style.background-color]="getFeatureColors(true)[0]" [style.border-color]="getFeatureColors(true)[1]"></div>
diff --git a/src/app/map/map.page.scss b/src/app/map/map.page.scss
index 5c93b2e..ef5ad2f 100644
--- a/src/app/map/map.page.scss
+++ b/src/app/map/map.page.scss
@@ -126,4 +126,8 @@ ion-fab-button {
     }
 
   }
-}
\ No newline at end of file
+}
+
+ion-progress-bar {
+  height: 5px;
+}
diff --git a/src/app/services/vineyard.service.ts b/src/app/services/vineyard.service.ts
index 703199e..09339dc 100644
--- a/src/app/services/vineyard.service.ts
+++ b/src/app/services/vineyard.service.ts
@@ -27,6 +27,8 @@ export class VineyardService {
 
   private _activeSeasons$: BehaviorSubject<number[]>;
 
+  private _vineyardsLoading$: BehaviorSubject<boolean>;
+
   private _vineyardCollection: AngularFirestoreCollection<VineyardDoc>;
 
   private _sharedVineyardCollection: AngularFirestoreCollection<SharedVineyardDoc>;
@@ -37,6 +39,7 @@ export class VineyardService {
     this._vineyards$ = new BehaviorSubject<Vineyard[]>([]);
     this._activeVineyard$ = new BehaviorSubject<Vineyard>(null);
     this._activeSeasons$ = new BehaviorSubject<number[]>([new Date().getFullYear()]);
+    this._vineyardsLoading$ = new BehaviorSubject<boolean>(false);
 
     this.authService.getUser().subscribe((user: User) => {
       if (user) {
@@ -53,6 +56,10 @@ export class VineyardService {
     });
   }
 
+  getIsVineyardsLoading(): Observable<boolean> {
+    return this._vineyardsLoading$;
+  }
+
   getVineyardsListener(): Observable<Vineyard[]> {
     return this._vineyards$;
   }
@@ -70,6 +77,7 @@ export class VineyardService {
   }
 
   getVineyards(): void {
+    this._vineyardsLoading$.next(true);
     combineLatest(this.getUserVineyards(), this.getSharedVineyards())
       .pipe(
         map(([owned, shared]) => [...owned, ...shared]),
@@ -89,9 +97,11 @@ export class VineyardService {
       .subscribe({
         next: (vineyards: Vineyard[]) => {
           this._vineyards$.next(vineyards);
+          this._vineyardsLoading$.next(false);
         },
         error: (error: any) => {
           console.error(`Something went wrong while fetching vineyards for user ${this._userId}`, error);
+          this._vineyardsLoading$.next(false);
         },
       });
   }