replacing ng2-slim-loading-bar with @ngx-loading-bar to make prod compilation pass (previous bar was not compatible with angular 6 and above)

package-lock.json

@@ -2804,6 +2804,15 @@
         "webpack-sources": "2.2.0"
       }
     },
+    "@ngx-loading-bar/core": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/@ngx-loading-bar/core/-/core-5.1.1.tgz",
+      "integrity": "sha512-ODXZ+Op1NtRiEKqh1CU2nwmb5GgI7iGMuT2uji8e6dgfKIEgIl5/BhYyKszlTmttID/tU25FdKFnv0RtAL4KUA==",
+      "dev": true,
+      "requires": {
+        "tslib": ">=1.7.1"
+      }
+    },
     "@ngx-translate/i18n-polyfill": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@ngx-translate/i18n-polyfill/-/i18n-polyfill-1.0.0.tgz",
@@ -14520,12 +14529,6 @@
       "integrity": "sha1-Pz5hPgE3sGSbcFxngHS0vQgUnMw=",
       "dev": true
     },
-    "ng2-slim-loading-bar": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/ng2-slim-loading-bar/-/ng2-slim-loading-bar-4.0.0.tgz",
-      "integrity": "sha1-clb93nwFjxSVWj7y5lr6+1tmRgM=",
-      "dev": true
-    },
     "ngx-bootstrap": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/ngx-bootstrap/-/ngx-bootstrap-5.2.0.tgz",

package.json

@@ -69,6 +69,7 @@
     "@angular/platform-browser": "11.2.9",
     "@angular/platform-browser-dynamic": "11.2.9",
     "@angular/router": "11.2.9",
+    "@ngx-loading-bar/core": "^5.1.1",
     "@ngx-translate/i18n-polyfill": "1.0.0",
     "@types/bcrypt": "3.0.1",
     "@types/bcryptjs": "2.4.2",
@@ -119,7 +120,6 @@
     "mocha": "8.3.2",
     "natural-orderby": "2.0.3",
     "ng2-cookies": "1.0.12",
-    "ng2-slim-loading-bar": "4.0.0",
     "ngx-bootstrap": "5.2.0",
     "ngx-clipboard": "14.0.1",
     "ngx-toastr": "13.2.1",

src/backend/model/jobs/jobs/FileJob.ts

@@ -55,9 +55,9 @@ export abstract class FileJob<S extends { indexedOnly: boolean } = { indexedOnly
     return files;
   }
 
-  protected abstract async shouldProcess(filePath: string): Promise<boolean>;
+  protected abstract shouldProcess(filePath: string): Promise<boolean>;
 
-  protected abstract async processFile(filePath: string): Promise<void>;
+  protected abstract processFile(filePath: string): Promise<void>;
 
   protected async step(): Promise<boolean> {
     if (this.directoryQueue.length === 0 && this.fileQueue.length === 0) {

src/backend/model/jobs/jobs/Job.ts

@@ -77,9 +77,9 @@ export abstract class Job<T = void> implements IJob<T> {
     };
   }
 
-  protected abstract async step(): Promise<boolean>;
+  protected abstract step(): Promise<boolean>;
 
-  protected abstract async init(): Promise<void>;
+  protected abstract init(): Promise<void>;
 
   private onFinish(): void {
     if (this.InProgress === false) {

src/backend/model/threading/MetadataLoader.ts

@@ -50,8 +50,8 @@ export class MetadataLoader {
                 metadata.size.width = data.streams[i].width;
                 metadata.size.height = data.streams[i].height;
 
-                if (Utils.isInt32(parseInt(data.streams[i].rotation, 10)) &&
-                  (Math.abs(parseInt(data.streams[i].rotation, 10)) / 90) % 2 === 1) {
+                if (Utils.isInt32(parseInt('' + data.streams[i].rotation, 10)) &&
+                  (Math.abs(parseInt('' + data.streams[i].rotation, 10)) / 90) % 2 === 1) {
                   // noinspection JSSuspiciousNameCombination
                   metadata.size.width = data.streams[i].height;
                   // noinspection JSSuspiciousNameCombination

src/frontend/app/app.module.ts

@@ -12,6 +12,7 @@ import {AuthenticationService} from './model/network/authentication.service';
 import {UserMangerSettingsComponent} from './ui/settings/usermanager/usermanager.settings.component';
 import {FrameComponent} from './ui/frame/frame.component';
 import {YagaModule} from '@yaga/leaflet-ng2';
+import { LoadingBarModule } from '@ngx-loading-bar/core';
 import {GalleryLightboxMediaComponent} from './ui/gallery/lightbox/media/media.lightbox.gallery.component';
 import {GalleryPhotoLoadingComponent} from './ui/gallery/grid/photo/loading/loading.photo.grid.gallery.component';
 import {GalleryNavigatorComponent} from './ui/gallery/navigator/navigator.gallery.component';
@@ -29,7 +30,6 @@ import {GalleryMapComponent} from './ui/gallery/map/map.gallery.component';
 import {GalleryMapLightboxComponent} from './ui/gallery/map/lightbox/lightbox.map.gallery.component';
 import {ThumbnailManagerService} from './ui/gallery/thumbnailManager.service';
 import {OverlayService} from './ui/gallery/overlay.service';
-import {SlimLoadingBarModule} from 'ng2-slim-loading-bar';
 import {GalleryShareComponent} from './ui/gallery/share/share.gallery.component';
 import {ShareLoginComponent} from './ui/sharelogin/share-login.component';
 import {ShareService} from './ui/gallery/share.service';
@@ -154,10 +154,10 @@ export function translationsFactory(locale: string) {
     CollapseModule.forRoot(),
     PopoverModule.forRoot(),
     BsDropdownModule.forRoot(),
-    SlimLoadingBarModule.forRoot(),
     BsDatepickerModule.forRoot(),
     YagaModule,
-    TimepickerModule.forRoot()
+    TimepickerModule.forRoot(),
+    LoadingBarModule
   ],
   declarations: [AppComponent,
     LoginComponent,

src/frontend/app/model/network/network.service.spec.ts

@@ -2,7 +2,7 @@ import {getTestBed, inject, TestBed} from '@angular/core/testing';
 import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
 import {NetworkService} from './network.service';
 import {Message} from '../../../../common/entities/Message';
-import {SlimLoadingBarService} from 'ng2-slim-loading-bar';
+import {LoadingBarService} from '@ngx-loading-bar/core';
 import {VersionService} from '../version.service';
 
 
@@ -20,7 +20,7 @@ describe('NetworkService Success tests', () => {
       imports: [HttpClientTestingModule],
       providers: [
         VersionService,
-        SlimLoadingBarService,
+        LoadingBarService,
         NetworkService
       ]
     });
@@ -133,7 +133,7 @@ describe('NetworkService Fail tests', () => {
       imports: [HttpClientTestingModule],
       providers: [
         VersionService,
-        SlimLoadingBarService,
+        LoadingBarService,
         NetworkService
       ]
     });

src/frontend/app/model/network/network.service.ts

@@ -1,7 +1,7 @@
 import {Injectable} from '@angular/core';
 import {HttpClient, HttpResponse} from '@angular/common/http';
 import {Message} from '../../../../common/entities/Message';
-import {SlimLoadingBarService} from 'ng2-slim-loading-bar';
+import {LoadingBarService} from '@ngx-loading-bar/core';
 import {ErrorCodes, ErrorDTO} from '../../../../common/entities/Error';
 import {Config} from '../../../../common/config/public/Config';
 import {Utils} from '../../../../common/Utils';
@@ -15,7 +15,7 @@ export class NetworkService {
   private globalErrorHandlers: Array<(error: ErrorDTO) => boolean> = [];
 
   constructor(private _http: HttpClient,
-              private slimLoadingBarService: SlimLoadingBarService,
+              private loadingBarService: LoadingBarService,
               private versionService: VersionService) {
   }
 
@@ -37,19 +37,17 @@ export class NetworkService {
 
   public getXML<T>(url: string): Promise<Document> {
 
-    this.slimLoadingBarService.visible = true;
-    this.slimLoadingBarService.start(() => {
-      this.slimLoadingBarService.visible = false;
-    });
+
+    this.loadingBarService.useRef().start();
 
     const process = (res: string): Document => {
-      this.slimLoadingBarService.complete();
+      this.loadingBarService.useRef().complete();
       const parser = new DOMParser();
       return parser.parseFromString(res, 'text/xml');
     };
 
     const err = (error: any) => {
-      this.slimLoadingBarService.complete();
+      this.loadingBarService.useRef().complete();
       return this.handleError(error);
     };
 
@@ -82,13 +80,10 @@ export class NetworkService {
   private callJson<T>(method: 'get' | 'post' | 'delete' | 'put', url: string, data: any = {}): Promise<T> {
     const body = data;
 
-    this.slimLoadingBarService.visible = true;
-    this.slimLoadingBarService.start(() => {
-      this.slimLoadingBarService.visible = false;
-    });
+    this.loadingBarService.useRef().start();
 
     const process = (res: HttpResponse<Message<T>>): T => {
-      this.slimLoadingBarService.complete();
+      this.loadingBarService.useRef().complete();
       const msg = res.body;
       if (res.headers.has(CustomHeaders.dataVersion)) {
         this.versionService.onNewVersion(res.headers.get(CustomHeaders.dataVersion));
@@ -103,7 +98,7 @@ export class NetworkService {
     };
 
     const err = (error: any) => {
-      this.slimLoadingBarService.complete();
+      this.loadingBarService.useRef().complete();
       return this.handleError(error);
     };
 

src/frontend/app/model/network/user.service.spec.ts

@@ -3,7 +3,7 @@ import {HttpClientTestingModule} from '@angular/common/http/testing';
 import {NetworkService} from './network.service';
 import {UserService} from './user.service';
 import {LoginCredential} from '../../../../common/entities/LoginCredential';
-import {SlimLoadingBarService} from 'ng2-slim-loading-bar';
+import {LoadingBarService} from '@ngx-loading-bar/core';
 import {ShareService} from '../../ui/gallery/share.service';
 import {VersionService} from '../version.service';
 
@@ -26,7 +26,7 @@ describe('UserService', () => {
       providers: [
         VersionService,
         UserService,
-        SlimLoadingBarService,
+        LoadingBarService,
         NetworkService,
         {provide: ShareService, useClass: MockShareService}
       ]

src/frontend/app/ui/faces/faces.component.ts

@@ -3,7 +3,7 @@ import {FacesService} from './faces.service';
 import {QueryService} from '../../model/query.service';
 import {map} from 'rxjs/operators';
 import {PersonDTO} from '../../../../common/entities/PersonDTO';
-import {Observable} from 'rxjs/Observable';
+import {Observable} from 'rxjs';
 
 @Component({
   selector: 'app-faces',

src/frontend/app/ui/frame/frame.component.html

@@ -1,4 +1,4 @@
-<ng2-slim-loading-bar color="#337ab7" height="3px"></ng2-slim-loading-bar>
+<ngx-loading-bar [includeSpinner]="false" color="#337ab7" height="3px"></ngx-loading-bar>
 <nav class="navbar  navbar-dark bg-dark  navbar-expand-md">
   <a class="navbar-brand" [routerLink]="['/gallery','/']"
      [queryParams]="queryService.getParams()">

test/backend/unit/middlewares/user/AuthenticationMWs.ts

@@ -1,3 +1,4 @@
+/* tslint:disable:no-unused-expression */
 import {expect} from 'chai';
 import {AuthenticationMWs} from '../../../../../src/backend/middlewares/user/AuthenticationMWs';
 import {ErrorCodes, ErrorDTO} from '../../../../../src/common/entities/Error';
@@ -80,7 +81,6 @@ describe('Authentication middleware', () => {
         authoriseDirPath(<any>req, <any>{sendStatus: resolve}, () => {
           resolve('ok');
         });
-        resolve();
       });
     };