From a89eaafed790c536ea094d4c35f85f56de95386d Mon Sep 17 00:00:00 2001 From: Jonas Winkler Date: Thu, 29 Oct 2020 14:35:36 +0100 Subject: [PATCH] toast changes --- .../edit-dialog/edit-dialog.component.ts | 2 +- .../common/toasts/toasts.component.html | 1 + .../dashboard/dashboard.component.ts | 9 ++++----- .../app/components/login/login.component.ts | 2 +- src-ui/src/app/services/auth.interceptor.ts | 19 +++++++++++++++---- src-ui/src/app/services/toast.service.ts | 19 +++++++++++++------ 6 files changed, 35 insertions(+), 17 deletions(-) diff --git a/src-ui/src/app/components/common/edit-dialog/edit-dialog.component.ts b/src-ui/src/app/components/common/edit-dialog/edit-dialog.component.ts index 190302394..153f588a3 100644 --- a/src-ui/src/app/components/common/edit-dialog/edit-dialog.component.ts +++ b/src-ui/src/app/components/common/edit-dialog/edit-dialog.component.ts @@ -66,7 +66,7 @@ export abstract class EditDialogComponent implements OnI this.activeModal.close() this.success.emit(result) }, error => { - this.toastService.showToast(Toast.make("Error", `Could not save ${this.entityName}: ${error.error.name}`)) + this.toastService.showToast(Toast.makeError(`Could not save ${this.entityName}: ${error.error.name}`)) }) } diff --git a/src-ui/src/app/components/common/toasts/toasts.component.html b/src-ui/src/app/components/common/toasts/toasts.component.html index 1c51febdb..04aa15a67 100644 --- a/src-ui/src/app/components/common/toasts/toasts.component.html +++ b/src-ui/src/app/components/common/toasts/toasts.component.html @@ -1,6 +1,7 @@ {{toast.content}} \ No newline at end of file diff --git a/src-ui/src/app/components/dashboard/dashboard.component.ts b/src-ui/src/app/components/dashboard/dashboard.component.ts index f929459e3..68173cefc 100644 --- a/src-ui/src/app/components/dashboard/dashboard.component.ts +++ b/src-ui/src/app/components/dashboard/dashboard.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { FileSystemDirectoryEntry, FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop'; import { DocumentService } from 'src/app/services/rest/document.service'; +import { Toast, ToastService } from 'src/app/services/toast.service'; @Component({ selector: 'app-dashboard', @@ -9,7 +10,7 @@ import { DocumentService } from 'src/app/services/rest/document.service'; }) export class DashboardComponent implements OnInit { - constructor(private documentService: DocumentService) { } + constructor(private documentService: DocumentService, private toastService: ToastService) { } ngOnInit(): void { } @@ -24,8 +25,6 @@ export class DashboardComponent implements OnInit { public dropped(files: NgxFileDropEntry[]) { for (const droppedFile of files) { - - // Is it a file? if (droppedFile.fileEntry.isFile) { const fileEntry = droppedFile.fileEntry as FileSystemFileEntry; console.log(fileEntry) @@ -34,9 +33,9 @@ export class DashboardComponent implements OnInit { const formData = new FormData() formData.append('document', file, file.name) this.documentService.uploadDocument(formData).subscribe(result => { - console.log(result) + this.toastService.showToast(Toast.make("Information", "The document has been uploaded and will be processed by the consumer shortly.")) }, error => { - console.error(error) + this.toastService.showToast(Toast.makeError("An error has occured while uploading the document. Sorry!")) }) }); } diff --git a/src-ui/src/app/components/login/login.component.ts b/src-ui/src/app/components/login/login.component.ts index de6b9f216..e74dcfb7f 100644 --- a/src-ui/src/app/components/login/login.component.ts +++ b/src-ui/src/app/components/login/login.component.ts @@ -26,7 +26,7 @@ export class LoginComponent implements OnInit { this.auth.login(this.loginForm.value.username, this.loginForm.value.password, this.loginForm.value.rememberMe).subscribe(result => { this.router.navigate(['']) }, (error) => { - this.toastService.showToast(Toast.make("Error", "result: " + JSON.stringify(error.error))) + this.toastService.showToast(Toast.makeError("Unable to log in with provided credentials.")) } ) } diff --git a/src-ui/src/app/services/auth.interceptor.ts b/src-ui/src/app/services/auth.interceptor.ts index ed372865d..704b558ac 100644 --- a/src-ui/src/app/services/auth.interceptor.ts +++ b/src-ui/src/app/services/auth.interceptor.ts @@ -3,15 +3,18 @@ import { HttpRequest, HttpHandler, HttpEvent, - HttpInterceptor + HttpInterceptor, + HttpErrorResponse } from '@angular/common/http'; -import { Observable } from 'rxjs'; +import { Observable, throwError } from 'rxjs'; import { AuthService } from './auth.service'; +import { catchError } from 'rxjs/operators'; +import { Toast, ToastService } from './toast.service'; @Injectable() export class AuthInterceptor implements HttpInterceptor { - constructor(private authService: AuthService) {} + constructor(private authService: AuthService, private toastService: ToastService) {} intercept(request: HttpRequest, next: HttpHandler): Observable> { if (this.authService.isAuthenticated()) { @@ -21,6 +24,14 @@ export class AuthInterceptor implements HttpInterceptor { } }); } - return next.handle(request); + return next.handle(request).pipe( + catchError((error: HttpErrorResponse) => { + if (error.status == 401 && this.authService.isAuthenticated()) { + this.authService.logout() + this.toastService.showToast(Toast.makeError("Your session has expired. Please log in again.")) + } + return throwError(error) + }) + ); } } diff --git a/src-ui/src/app/services/toast.service.ts b/src-ui/src/app/services/toast.service.ts index ab0a7cee6..a3ce060a9 100644 --- a/src-ui/src/app/services/toast.service.ts +++ b/src-ui/src/app/services/toast.service.ts @@ -1,20 +1,27 @@ import { Injectable } from '@angular/core'; -import { Subject } from 'rxjs'; +import { Subject, zip } from 'rxjs'; export class Toast { - static make(title: string, content: string, delay?: number): Toast { + static make(title: string, content: string, classname?: string, delay?: number): Toast { let t = new Toast() t.title = title t.content = content + t.classname = classname if (delay) { t.delay = delay } return t } + static makeError(content: string) { + return Toast.make("Error", content, null, 10000) + } + title: string + classname: string + content: string delay: number = 5000 @@ -30,23 +37,23 @@ export class ToastService { private toasts: Toast[] = [] - private toastSubject: Subject = new Subject() + private toastsSubject: Subject = new Subject() showToast(toast: Toast) { this.toasts.push(toast) - this.toastSubject.next(this.toasts) + this.toastsSubject.next(this.toasts) } closeToast(toast: Toast) { let index = this.toasts.findIndex(t => t == toast) if (index > -1) { this.toasts.splice(index, 1) - this.toastSubject.next(this.toasts) + this.toastsSubject.next(this.toasts) } } getToasts() { - return this.toastSubject + return this.toastsSubject } }