From 96c1ddbb0ec94209422b3c91dd7cebeb066deca2 Mon Sep 17 00:00:00 2001
From: Fahmi Kudo <fahmi.hidayatullah12@gmail.com>
Date: Tue, 9 Jan 2024 07:40:02 +0700
Subject: [PATCH] feat: add snackbar pop-up after submit button

---
 .../example/example-dialog/example-dialog.component.html  | 4 +++-
 .../example/example-dialog/example-dialog.component.ts    | 8 +++++++-
 src/app/pages/example/example.module.ts                   | 4 +++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/app/pages/example/example-dialog/example-dialog.component.html b/src/app/pages/example/example-dialog/example-dialog.component.html
index 2b99059..7f4f7d5 100644
--- a/src/app/pages/example/example-dialog/example-dialog.component.html
+++ b/src/app/pages/example/example-dialog/example-dialog.component.html
@@ -26,4 +26,6 @@ <h1 class="mat-dialog-title">Add Periodic</h1>
 <div mat-dialog-action [align]="'end'">
   <button mat-raised-button mat-dialog-close>Close</button>
   <button style="margin-left: 8px;" mat-raised-button color="primary" [disabled]="periodicForm.invalid" (click)="addPeriodic()">Save</button>
-</div>
\ No newline at end of file
+</div>
+<button mat-stroked-button aria-label="Success Message">
+</button>
\ No newline at end of file
diff --git a/src/app/pages/example/example-dialog/example-dialog.component.ts b/src/app/pages/example/example-dialog/example-dialog.component.ts
index 3fc74de..ea7b369 100644
--- a/src/app/pages/example/example-dialog/example-dialog.component.ts
+++ b/src/app/pages/example/example-dialog/example-dialog.component.ts
@@ -1,7 +1,7 @@
 import { Component, Inject, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
-
+import { MatSnackBar } from '@angular/material/snack-bar';
 
 @Component({
   selector: 'app-example-dialog',
@@ -15,6 +15,7 @@ export class ExampleDialogComponent implements OnInit {
   constructor(
     private formBuilder: FormBuilder, 
     private dialogRef: MatDialogRef<ExampleDialogComponent>,
+    private snackBar: MatSnackBar,
     @Inject(MAT_DIALOG_DATA) public editData : any ){}
 
   ngOnInit(): void {
@@ -43,6 +44,11 @@ export class ExampleDialogComponent implements OnInit {
   }
 
   addPeriodic(): void {
+    this.snackBar.open("Success!!!", "Dismiss", {
+      duration: 2000,
+      verticalPosition: "top",
+      horizontalPosition: "center" 
+    });
     this.dialogRef.close();
   }
 
diff --git a/src/app/pages/example/example.module.ts b/src/app/pages/example/example.module.ts
index 74e1a7f..42ba83c 100644
--- a/src/app/pages/example/example.module.ts
+++ b/src/app/pages/example/example.module.ts
@@ -14,6 +14,7 @@ import { MatDialogModule } from "@angular/material/dialog";
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from "@angular/material/input";
 import { FormsModule, ReactiveFormsModule } from "@angular/forms";
+import { MatSnackBarModule } from '@angular/material/snack-bar';
 
 
 @NgModule({
@@ -31,7 +32,8 @@ import { FormsModule, ReactiveFormsModule } from "@angular/forms";
     MatInputModule,
     MatButtonModule,
     FormsModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    MatSnackBarModule
   ],
   declarations: [
     ExampleComponent,