From 76541fa2a8a17fb4c612da8f867212508ed7461c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ole=20K=C3=BCck?= <ole.kueck@hmmh.de>
Date: Tue, 21 Jan 2025 12:47:26 +0100
Subject: [PATCH] Feature: Add Qualification

---
 .../views/qualifications/qualifications.component.html |  4 ++--
 .../views/qualifications/qualifications.component.ts   | 10 ++++++++++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/app/views/qualifications/qualifications.component.html b/src/app/views/qualifications/qualifications.component.html
index ef816aa..396139a 100644
--- a/src/app/views/qualifications/qualifications.component.html
+++ b/src/app/views/qualifications/qualifications.component.html
@@ -2,9 +2,9 @@
     <div class="qualifications__action-row">
         <mat-form-field>
             <mat-label>Qualification</mat-label>
-            <input matInput>
+            <input matInput #qualificationInput minlength="1" maxlength="25">
         </mat-form-field>
-        <button mat-fab class="shadowless">
+        <button mat-fab class="shadowless" (click)="onAdd(qualificationInput)">
             <mat-icon>add</mat-icon>
         </button>
     </div>
diff --git a/src/app/views/qualifications/qualifications.component.ts b/src/app/views/qualifications/qualifications.component.ts
index f4ab16b..0de8985 100644
--- a/src/app/views/qualifications/qualifications.component.ts
+++ b/src/app/views/qualifications/qualifications.component.ts
@@ -79,6 +79,16 @@ export class QualificationsComponent {
         this.qualificationEdits.set(id, true);
     }
 
+    onAdd(qualificationField: HTMLInputElement){
+        this.qualificationService.createQualification({requestBody: {skill: qualificationField.value}}).subscribe((qualification)=>{
+            const data = this.qualificationDataSource.data;
+            data.push(qualification);
+            this.qualificationDataSource = new MatTableDataSource<Qualification>(data);
+            this.notifications.publish(`Added ${qualification.skill}`);
+            qualificationField.value='';
+        });
+    }
+
     endEdit(oldQualification: Qualification, save: boolean) {
 
         const qualificationFormGroup = this.qualificationSkillFormGroups.get(oldQualification.id);