import {Component, Inject} from '@angular/core'; import {MatIcon} from "@angular/material/icon"; import {MatProgressBar} from "@angular/material/progress-bar"; import {MAT_SNACK_BAR_DATA, MatSnackBarRef} from "@angular/material/snack-bar"; import {MatIconButton} from "@angular/material/button"; @Component({ selector: 'app-notification', standalone: true, imports: [ MatIconButton, MatIcon, MatProgressBar ], templateUrl: './notification.component.html', styleUrl: './notification.component.css' }) export class NotificationComponent { showProgressBar: boolean = false; progress: number = 100; color: string = "primary"; constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any, private snackBarRef: MatSnackBarRef) { if (data.duration) { this.startProgress(data.duration); this.showProgressBar = true; } if (data.color) { this.color = data.color; } } dismiss(): void { this.snackBarRef.dismiss(); } private startProgress(duration: number): void { const interval: number = duration / 100; const progressInterval = setInterval(async () => { this.progress--; if (this.progress === 0) { clearInterval(progressInterval); setTimeout(() => { this.dismiss(); }, 1000); } }, interval); } }