diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 2f8e1adf4..dae6e769b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -10,6 +10,7 @@ import { MatInputModule } from '@angular/material/input'; import { MatButtonToggleModule } from '@angular/material/button-toggle'; import { MatCardModule } from '@angular/material/card'; import { MatProgressBarModule } from '@angular/material/progress-bar'; +import { MatDialogModule } from '@angular/material/dialog'; import { FlexLayoutModule } from '@angular/flex-layout'; import { httpInterceptorProviders } from './http-interceptors'; @@ -56,6 +57,7 @@ import { DialogComponent } from './dialog/dialog.component'; MatButtonToggleModule, MatCardModule, MatProgressBarModule, + MatDialogModule, FlexLayoutModule, HttpClientModule, HttpClientXsrfModule.withOptions({ diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts index d44dd3c8d..86f8b48f5 100644 --- a/src/app/dashboard/dashboard.component.ts +++ b/src/app/dashboard/dashboard.component.ts @@ -11,6 +11,9 @@ import { StType } from '../type'; import { FilterService } from '../services/filter.service'; import { ProgressService } from '../services/progress.service'; import { MatProgressBar } from '@angular/material/progress-bar'; +import { MessageService } from '../services/message.service'; +import { MatDialog, MatDialogRef } from '@angular/material/dialog'; +import { DialogComponent } from '../dialog/dialog.component'; @Component({ selector: 'app-dashboard', @@ -56,11 +59,14 @@ export class DashboardComponent implements OnInit, AfterViewInit { deviceChart: StType = StType.Device; progressValue: number = 0; isLoading = true; + private dialogRef: MatDialogRef; constructor( private systemConfigService: SystemConfigService, private progressService: ProgressService, + private messageService: MessageService, + public dialog: MatDialog ) { } ngOnInit() { @@ -85,5 +91,20 @@ export class DashboardComponent implements OnInit, AfterViewInit { this.progressValue = this.progressService.percentValue; }, 100); + // Listen for messages from other services/components + this.messageService.messageAdded$ + .subscribe( + _ => { + // Open dialog + if (!this.dialogRef) + this.dialogRef = this.dialog.open(DialogComponent); + + this.dialogRef.afterClosed().subscribe( + _ => { + this.dialogRef = null; + this.messageService.clear(); + } + ); + }); } } \ No newline at end of file diff --git a/src/app/dialog/dialog.component.html b/src/app/dialog/dialog.component.html index 7bc436517..a7ba9830d 100644 --- a/src/app/dialog/dialog.component.html +++ b/src/app/dialog/dialog.component.html @@ -1,3 +1,6 @@

Error

+
\ No newline at end of file diff --git a/src/app/dialog/dialog.component.ts b/src/app/dialog/dialog.component.ts index 0e7635f6d..de6be2fcd 100644 --- a/src/app/dialog/dialog.component.ts +++ b/src/app/dialog/dialog.component.ts @@ -15,7 +15,5 @@ export class DialogComponent implements OnInit { constructor(public messageService: MessageService) { } - ngOnInit(): void { - } - + ngOnInit(): void { } } diff --git a/src/app/http-interceptors/error.interceptor.ts b/src/app/http-interceptors/error.interceptor.ts index 31288b613..d5dfb21ad 100644 --- a/src/app/http-interceptors/error.interceptor.ts +++ b/src/app/http-interceptors/error.interceptor.ts @@ -9,11 +9,12 @@ import { import { Observable, throwError } from 'rxjs'; import { apiRetry } from '../api-utils'; import { retry, catchError } from 'rxjs/operators'; +import { MessageService } from '../services/message.service'; @Injectable() export class ErrorInterceptor implements HttpInterceptor { - constructor() { } + constructor(private messageService: MessageService) { } intercept(request: HttpRequest, next: HttpHandler): Observable> { return next.handle(request) @@ -29,6 +30,8 @@ export class ErrorInterceptor implements HttpInterceptor { errorMsg = `Error Status: ${error.status}\nMessage: ${error.message}`; } console.log(errorMsg); + + this.messageService.add(errorMsg); return throwError(errorMsg); }) ) diff --git a/src/app/services/message.service.ts b/src/app/services/message.service.ts index e10baf7ac..39dc5d954 100644 --- a/src/app/services/message.service.ts +++ b/src/app/services/message.service.ts @@ -1,11 +1,17 @@ import { Injectable } from '@angular/core'; +import { Subject } from 'rxjs'; -@Injectable() +@Injectable({ + providedIn: 'root' +}) export class MessageService { messages: string[] = []; + private messageAddedSource = new Subject(); + messageAdded$ = this.messageAddedSource.asObservable(); add(message: string) { this.messages.push(message); + this.messageAddedSource.next(message); } clear() {