Improve error handler and fix search results issue (DSP-1826 / DSP-18…

…31) (#493)

* refactor: user error handler instead notification service

* refactor(results): remove redundant code

This code was already written in DSP-UI. No need here to rewrite

* refactor(project): display message instead notification in case of 0 metadata

* fix(authentication): logout user if an error has status 401

* test(error): fix test in error handler service

* refactor(resource): clean up test

* chore(deps): bump dsp-js and dsp-ui to latest version

* refactor(results): remove unused variable

package.json

@@ -22,22 +22,22 @@
   },
   "private": true,
   "dependencies": {
-    "3d-force-graph": "^1.60.12",
     "@angular/animations": "^11.2.9",
-    "@angular/cdk": "^11.2.5",
-    "@angular/common": "11.2.9",
+    "@angular/cdk": "^11.2.9",
+    "@angular/common": "^11.2.9",
     "@angular/compiler": "^11.2.9",
     "@angular/core": "^11.2.9",
     "@angular/forms": "^11.2.9",
-    "@angular/material": "^11.2.5",
+    "@angular/material": "^11.2.9",
     "@angular/platform-browser": "^11.2.9",
     "@angular/platform-browser-dynamic": "^11.2.9",
     "@angular/router": "^11.2.9",
     "@ckeditor/ckeditor5-angular": "^1.2.3",
-    "@dasch-swiss/dsp-js": "^2.7.0",
-    "@dasch-swiss/dsp-ui": "^1.7.2",
+    "@dasch-swiss/dsp-js": "^3.0.0",
+    "@dasch-swiss/dsp-ui": "^1.7.3",
     "@ngx-translate/core": "^12.1.2",
     "@ngx-translate/http-loader": "5.0.0",
+    "3d-force-graph": "^1.60.12",
     "angular-split": "^4.0.0",
     "ckeditor5-custom-build": "github:dasch-swiss/ckeditor_custom_build",
     "core-js": "^3.6.5",
@@ -64,7 +64,7 @@
   "devDependencies": {
     "@angular-devkit/build-angular": "^0.1102.12",
     "@angular-eslint/eslint-plugin": "^1.2.0",
-    "@angular/cli": "^11.2.8",
+    "@angular/cli": "^11.2.9",
     "@angular/compiler-cli": "^11.2.9",
     "@angular/language-service": "^11.2.9",
     "@types/d3": "^5.7.2",

src/app/main/cache/cache.service.spec.ts

@@ -2,16 +2,34 @@ import { TestBed } from '@angular/core/testing';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { DspActionModule, DspApiConnectionToken, DspCoreModule } from '@dasch-swiss/dsp-ui';
 import { CacheService } from './cache.service';
 
 describe('CacheService', () => {
-    beforeEach(() => TestBed.configureTestingModule({
-        imports: [
-            BrowserAnimationsModule,
-            MatDialogModule,
-            MatSnackBarModule
-        ]
-    }));
+    beforeEach(() => {
+
+        const apiEndpointSpyObj = {
+            v2: {
+                auth: jasmine.createSpyObj('auth', ['logout'])
+            }
+        };
+
+        TestBed.configureTestingModule({
+            imports: [
+                BrowserAnimationsModule,
+                DspCoreModule,
+                DspActionModule,
+                MatDialogModule,
+                MatSnackBarModule
+            ],
+            providers: [
+                {
+                    provide: DspApiConnectionToken,
+                    useValue: apiEndpointSpyObj
+                },
+            ]
+        });
+    });
 
     it('should be created', () => {
         const service: CacheService = TestBed.inject(CacheService);

src/app/main/error/error-handler.service.spec.ts

@@ -2,17 +2,33 @@ import { TestBed } from '@angular/core/testing';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { DspActionModule, DspApiConnectionToken, DspCoreModule } from '@dasch-swiss/dsp-ui';
 import { ErrorHandlerService } from './error-handler.service';
 
 describe('ErrorHandlerService', () => {
     let service: ErrorHandlerService;
 
     beforeEach(() => {
+
+        const apiEndpointSpyObj = {
+            v2: {
+                auth: jasmine.createSpyObj('auth', ['logout'])
+            }
+        };
+
         TestBed.configureTestingModule({
             imports: [
                 BrowserAnimationsModule,
+                DspActionModule,
+                DspCoreModule,
                 MatDialogModule,
                 MatSnackBarModule
+            ],
+            providers: [
+                {
+                    provide: DspApiConnectionToken,
+                    useValue: apiEndpointSpyObj
+                },
             ]
         });
         service = TestBed.inject(ErrorHandlerService);

src/app/main/error/error-handler.service.ts

@@ -1,7 +1,7 @@
-import { Injectable } from '@angular/core';
+import { Inject, Injectable } from '@angular/core';
 import { MatDialog, MatDialogConfig } from '@angular/material/dialog';
-import { ApiResponseError } from '@dasch-swiss/dsp-js';
-import { NotificationService } from '@dasch-swiss/dsp-ui';
+import { ApiResponseData, ApiResponseError, KnoraApiConnection, LogoutResponse } from '@dasch-swiss/dsp-js';
+import { DspApiConnectionToken, NotificationService, SessionService } from '@dasch-swiss/dsp-ui';
 import { DialogComponent } from '../dialog/dialog.component';
 
 @Injectable({
@@ -10,8 +10,10 @@ import { DialogComponent } from '../dialog/dialog.component';
 export class ErrorHandlerService {
 
     constructor(
+        @Inject(DspApiConnectionToken) private _dspApiConnection: KnoraApiConnection,
         private _notification: NotificationService,
-        private _dialog: MatDialog
+        private _dialog: MatDialog,
+        private _session: SessionService,
     ) { }
 
     showMessage(error: ApiResponseError) {
@@ -32,11 +34,27 @@ export class ErrorHandlerService {
                 disableClose: true
             };
 
-            const dialogRef = this._dialog.open(
+            this._dialog.open(
                 DialogComponent,
                 dialogConfig
             );
 
+        } else if (error.status === 401 && typeof(error.error) !== 'string') {
+            // logout if error status is a 401 error and comes from a DSP-JS request
+            this._dspApiConnection.v2.auth.logout().subscribe(
+                (logoutResponse: ApiResponseData<LogoutResponse>) => {
+
+                    // destroy (dsp-ui) session
+                    this._session.destroySession();
+
+                    // reload the page
+                    window.location.reload();
+                },
+                (logoutError: ApiResponseError) => {
+                    this._notification.openSnackBar(logoutError);
+                }
+            );
+
         } else {
             // in any other case
             // open snack bar from dsp-ui notification service

src/app/project/board/board.component.html

@@ -50,6 +50,10 @@ <h2 class="mat-title">
                 </span>
             </div>
         </div>
+
+        <section class="no-metadata" *ngIf="!metadataLoading && !selectedDataset">
+            No metadata defined for the selected project.
+        </section>
     </div>
 
     <div class="project-info-container flex-panel" *ngIf="!metadataLoading && selectedDataset">
@@ -219,4 +223,5 @@ <h2 class="mat-title">
         </div>
 
     </div>
+
 </div>