diff --git a/apps/red-ui/src/app/app.component.html b/apps/red-ui/src/app/app.component.html
index 7115e458f..3ac47a12a 100644
--- a/apps/red-ui/src/app/app.component.html
+++ b/apps/red-ui/src/app/app.component.html
@@ -1,4 +1,4 @@
 <router-outlet></router-outlet>
 <redaction-full-page-loading-indicator
-    [displayed]="appLoadStateService.loading | async"
+    [displayed]="loadingService.isLoading | async"
 ></redaction-full-page-loading-indicator>
diff --git a/apps/red-ui/src/app/app.component.ts b/apps/red-ui/src/app/app.component.ts
index 711e2bffb..8660f6cb6 100644
--- a/apps/red-ui/src/app/app.component.ts
+++ b/apps/red-ui/src/app/app.component.ts
@@ -1,6 +1,5 @@
 import { Component } from '@angular/core';
-import { AppLoadStateService } from '@services/app-load-state.service';
-import { RouterHistoryService } from '@services/router-history.service';
+import { LoadingService } from '@services/loading.service';
 
 @Component({
     selector: 'redaction-root',
@@ -8,8 +7,5 @@ import { RouterHistoryService } from '@services/router-history.service';
     styleUrls: ['./app.component.scss']
 })
 export class AppComponent {
-    constructor(
-        public appLoadStateService: AppLoadStateService,
-        private readonly _routerHistoryService: RouterHistoryService
-    ) {}
+    constructor(readonly loadingService: LoadingService) {}
 }
diff --git a/apps/red-ui/src/app/guards/composite-route.guard.ts b/apps/red-ui/src/app/guards/composite-route.guard.ts
index 131502de7..174b2632c 100644
--- a/apps/red-ui/src/app/guards/composite-route.guard.ts
+++ b/apps/red-ui/src/app/guards/composite-route.guard.ts
@@ -1,26 +1,19 @@
-import {
-    ActivatedRouteSnapshot,
-    CanActivate,
-    Router,
-    RouterStateSnapshot,
-    UrlTree
-} from '@angular/router';
+import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot, UrlTree } from '@angular/router';
 import { Injectable, Injector } from '@angular/core';
 import { from, of } from 'rxjs';
-import { AppLoadStateService } from '@services/app-load-state.service';
+import { LoadingService } from '@services/loading.service';
 
 @Injectable({
     providedIn: 'root'
 })
 export class CompositeRouteGuard implements CanActivate {
     constructor(
-        protected readonly _router: Router,
         protected readonly _injector: Injector,
-        private readonly _appLoadStateService: AppLoadStateService
+        private readonly _loadingService: LoadingService
     ) {}
 
     async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
-        this._appLoadStateService.pushLoadingEvent(true);
+        this._loadingService.start();
 
         const routeGuards = route.data.routeGuards;
 
@@ -40,13 +33,13 @@ export class CompositeRouteGuard implements CanActivate {
 
                 const result = await canActivateResult.toPromise();
                 if (!result) {
-                    this._appLoadStateService.pushLoadingEvent(false);
+                    this._loadingService.stop();
                     return false;
                 }
             }
         }
 
-        this._appLoadStateService.pushLoadingEvent(false);
+        this._loadingService.stop();
 
         return true;
     }
diff --git a/apps/red-ui/src/app/modules/auth/auth.guard.ts b/apps/red-ui/src/app/modules/auth/auth.guard.ts
index e680cd274..b073f9500 100644
--- a/apps/red-ui/src/app/modules/auth/auth.guard.ts
+++ b/apps/red-ui/src/app/modules/auth/auth.guard.ts
@@ -2,7 +2,6 @@ import { Inject, Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
 import { KeycloakAuthGuard, KeycloakService } from 'keycloak-angular';
 import { UserService } from '@services/user.service';
-import { AppLoadStateService } from '@services/app-load-state.service';
 import { AppConfigKey, AppConfigService } from '@app-config/app-config.service';
 import { BASE_HREF } from '../../tokens';
 
@@ -15,7 +14,6 @@ export class AuthGuard extends KeycloakAuthGuard {
         protected readonly _router: Router,
         protected readonly _keycloak: KeycloakService,
         private readonly _appConfigService: AppConfigService,
-        private readonly _appLoadStateService: AppLoadStateService,
         private readonly _userService: UserService
     ) {
         super(_router, _keycloak);
diff --git a/apps/red-ui/src/app/modules/auth/red-role.guard.ts b/apps/red-ui/src/app/modules/auth/red-role.guard.ts
index 5935ff6f6..6ce704eb7 100644
--- a/apps/red-ui/src/app/modules/auth/red-role.guard.ts
+++ b/apps/red-ui/src/app/modules/auth/red-role.guard.ts
@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
 import { UserService } from '@services/user.service';
-import { AppLoadStateService } from '@services/app-load-state.service';
+import { LoadingService } from '@services/loading.service';
 import { Observable } from 'rxjs';
 
 @Injectable({
@@ -10,7 +10,7 @@ import { Observable } from 'rxjs';
 export class RedRoleGuard implements CanActivate {
     constructor(
         protected readonly _router: Router,
-        private readonly _appLoadStateService: AppLoadStateService,
+        private readonly _loadingService: LoadingService,
         private readonly _userService: UserService
     ) {}
 
@@ -18,7 +18,7 @@ export class RedRoleGuard implements CanActivate {
         return new Observable(obs => {
             if (!this._userService.user.hasAnyREDRoles) {
                 this._router.navigate(['/auth-error']);
-                this._appLoadStateService.pushLoadingEvent(false);
+                this._loadingService.stop();
                 obs.next(false);
                 obs.complete();
             } else {
diff --git a/apps/red-ui/src/app/services/app-load-state.service.ts b/apps/red-ui/src/app/services/app-load-state.service.ts
deleted file mode 100644
index 2647e5699..000000000
--- a/apps/red-ui/src/app/services/app-load-state.service.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { EventEmitter, Injectable } from '@angular/core';
-import { Observable } from 'rxjs';
-
-@Injectable({
-    providedIn: 'root'
-})
-export class AppLoadStateService {
-    private _loadingEvent = new EventEmitter();
-
-    get loading(): Observable<boolean> {
-        return this._loadingEvent;
-    }
-
-    pushLoadingEvent(event: boolean) {
-        this._loadingEvent.next(event);
-    }
-}
diff --git a/apps/red-ui/src/app/services/loading.service.ts b/apps/red-ui/src/app/services/loading.service.ts
new file mode 100644
index 000000000..c7839115d
--- /dev/null
+++ b/apps/red-ui/src/app/services/loading.service.ts
@@ -0,0 +1,21 @@
+import { EventEmitter, Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class LoadingService {
+    private readonly _loadingEvent = new EventEmitter();
+
+    get isLoading(): Observable<boolean> {
+        return this._loadingEvent;
+    }
+
+    start(): void {
+        this._loadingEvent.next(true);
+    }
+
+    stop(): void {
+        this._loadingEvent.next(false);
+    }
+}