From 4e7b8bdc95970f51cfd9e50947312e0e7899c886 Mon Sep 17 00:00:00 2001
From: nsemets <nsemets@exoft.net>
Date: Wed, 19 Nov 2025 12:51:36 +0200
Subject: [PATCH 1/2] feat(navigation): added loader service on navigation

---
 src/app/app.component.ts | 42 ++++++++++++++++++++++++++--------------
 1 file changed, 28 insertions(+), 14 deletions(-)

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index d51395bcc..d002a68fa 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,10 +1,17 @@
 import { Actions, createDispatchMap, ofActionSuccessful, select } from '@ngxs/store';
 
-import { filter, take } from 'rxjs';
+import { take } from 'rxjs';
 
 import { ChangeDetectionStrategy, Component, DestroyRef, effect, inject, OnInit } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { NavigationEnd, Router, RouterOutlet } from '@angular/router';
+import {
+  NavigationCancel,
+  NavigationEnd,
+  NavigationError,
+  NavigationStart,
+  Router,
+  RouterOutlet,
+} from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
 import { GetCurrentUser } from '@core/store/user';
@@ -14,6 +21,7 @@ import { ConfirmEmailComponent } from './shared/components/confirm-email/confirm
 import { FullScreenLoaderComponent } from './shared/components/full-screen-loader/full-screen-loader.component';
 import { ToastComponent } from './shared/components/toast/toast.component';
 import { CustomDialogService } from './shared/services/custom-dialog.service';
+import { LoaderService } from './shared/services/loader.service';
 
 import { GoogleTagManagerService } from 'angular-google-tag-manager';
 
@@ -32,6 +40,7 @@ export class AppComponent implements OnInit {
   private readonly environment = inject(ENVIRONMENT);
   private readonly actions$ = inject(Actions);
   private readonly actions = createDispatchMap({ getCurrentUser: GetCurrentUser, getEmails: GetEmails });
+  private readonly loaderService = inject(LoaderService);
 
   unverifiedEmails = select(UserEmailsSelectors.getUnverifiedEmails);
 
@@ -50,19 +59,24 @@ export class AppComponent implements OnInit {
       this.actions.getEmails();
     });
 
-    if (this.environment.googleTagManagerId) {
-      this.router.events
-        .pipe(
-          filter((event) => event instanceof NavigationEnd),
-          takeUntilDestroyed(this.destroyRef)
-        )
-        .subscribe((event: NavigationEnd) => {
-          this.googleTagManagerService.pushTag({
-            event: 'page',
-            pageName: event.urlAfterRedirects,
-          });
+    this.router.events.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((event) => {
+      if (event instanceof NavigationStart) {
+        this.loaderService.show();
+      } else if (
+        event instanceof NavigationEnd ||
+        event instanceof NavigationCancel ||
+        event instanceof NavigationError
+      ) {
+        this.loaderService.hide();
+      }
+
+      if (this.environment.googleTagManagerId && event instanceof NavigationEnd) {
+        this.googleTagManagerService.pushTag({
+          event: 'page',
+          pageName: event.urlAfterRedirects,
         });
-    }
+      }
+    });
   }
 
   private showEmailDialog() {

From b106b7c1949d4e66219ad0b56bcf896b23c403cc Mon Sep 17 00:00:00 2001
From: nsemets <nsemets@exoft.net>
Date: Wed, 19 Nov 2025 17:01:14 +0200
Subject: [PATCH 2/2] feat(navigation): added delay for loader hide

---
 src/app/app.component.ts | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index d002a68fa..f40b224ab 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,6 +1,6 @@
 import { Actions, createDispatchMap, ofActionSuccessful, select } from '@ngxs/store';
 
-import { take } from 'rxjs';
+import { take, timer } from 'rxjs';
 
 import { ChangeDetectionStrategy, Component, DestroyRef, effect, inject, OnInit } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -67,7 +67,9 @@ export class AppComponent implements OnInit {
         event instanceof NavigationCancel ||
         event instanceof NavigationError
       ) {
-        this.loaderService.hide();
+        timer(500)
+          .pipe(takeUntilDestroyed(this.destroyRef))
+          .subscribe(() => this.loaderService.hide());
       }
 
       if (this.environment.googleTagManagerId && event instanceof NavigationEnd) {