feat: add notification

src/components/notification/notification.component.ts

@@ -0,0 +1,46 @@
+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;
+
+  constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any, private snackBarRef: MatSnackBarRef<NotificationComponent>) {
+    if (data.duration) {
+      this.startProgress(data.duration);
+      this.showProgressBar = true;
+    }
+  }
+
+  dismiss(): void {
+    this.snackBarRef.dismiss();
+  }
+
+  private startProgress(duration: number): void {
+    const interval: number = duration / 100;
+    const progressInterval: number = setInterval(() => {
+      this.progress--;
+      if (this.progress === 0) {
+        clearInterval(progressInterval);
+        setTimeout(() => {
+          this.dismiss();
+        }, 1000);
+      }
+    }, interval);
+  }
+}