add form to edit employee

Reviewed-on: #23
Reviewed-by: Get in my car i have candy <huydw@proton.me>

src/app/employee/table/table.component.ts

@@ -18,6 +18,7 @@ import {MatDialog} from "@angular/material/dialog";
 import {DeleteComponent} from "../delete/delete.component";
 import EmployeeApiService from "../../services/employee-api.service";
 import {CreateComponent} from "../create/create.component";
+import {EditComponent} from "../edit/edit.component";
 
 @Component({
   selector: 'app-employee-list',
@@ -41,8 +42,7 @@ import {CreateComponent} from "../create/create.component";
 export class TableComponent implements OnInit{
   private readonly apiService: EmployeeApiService = inject(EmployeeApiService);
   private readonly snackBar: MatSnackBar = inject(MatSnackBar);
-  private readonly deleteDialogue: MatDialog = inject(MatDialog);
-  private readonly createEmployeeDialogue: MatDialog = inject(MatDialog);
+  private readonly matDialog: MatDialog = inject(MatDialog);
 
   private static readonly MAX_RETRIES = 3;
   public employees$: Observable<Employee[]> = of([]);
@@ -73,7 +73,7 @@ export class TableComponent implements OnInit{
   }
 
   protected openDeleteDialogue(employee: Employee): void {
-    this.deleteDialogue.open(DeleteComponent, {data: employee})
+    this.matDialog.open(DeleteComponent, {data: employee})
       .afterClosed()
       .subscribe(() => {
         this.employees$ = this.fetchEmployees();
@@ -81,10 +81,18 @@ export class TableComponent implements OnInit{
   }
 
   protected showCreateEmployeeModal() {
-    this.createEmployeeDialogue.open(CreateComponent)
+    this.matDialog.open(CreateComponent)
       .afterClosed()
       .subscribe(() => {
       this.employees$ = this.fetchEmployees();
     });
   }
+
+  protected showEditEmployeeModal(employee: Employee) {
+    this.matDialog.open(EditComponent, {data: employee})
+      .afterClosed()
+      .subscribe(() => {
+        this.employees$ = this.fetchEmployees();
+      });
+  }
 }