toast changes

src-ui/src/app/components/common/edit-dialog/edit-dialog.component.ts

@@ -66,7 +66,7 @@ export abstract class EditDialogComponent<T extends ObjectWithId> 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}`))
     })
   }
 

src-ui/src/app/components/common/toasts/toasts.component.html

@@ -1,6 +1,7 @@
 <ngb-toast
   *ngFor="let toast of toasts"
   [header]="toast.title" [autohide]="true" [delay]="toast.delay"
+  [class]="toast.classname"
   (hide)="toastService.closeToast(toast)">
   {{toast.content}}
 </ngb-toast>

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!"))
           })
         });
       }

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."))
     }
     )
   }

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<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
     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)
+      })
+    );
   }
 }

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<Toast[]> = new Subject()
+  private toastsSubject: Subject<Toast[]> = 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
   }
 
 }