From 5706dfaae83de282643400c016fb5a16c4b0bd3e Mon Sep 17 00:00:00 2001
From: Constantin Simonis <constantin@simonis.lol>
Date: Tue, 17 Dec 2024 09:19:02 +0100
Subject: [PATCH] add instant validation for rating

---
 src/app/hotel/component/edit-hotel.component.ts | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/app/hotel/component/edit-hotel.component.ts b/src/app/hotel/component/edit-hotel.component.ts
index a034de4..e5a360f 100644
--- a/src/app/hotel/component/edit-hotel.component.ts
+++ b/src/app/hotel/component/edit-hotel.component.ts
@@ -43,7 +43,7 @@ import {ErrorMsgComponent} from "./error-msg.component";
       <br>
       <label for="rating">Rating</label>
       <br>
-      <input id="rating" type="number" formControlName="rating" min="0" max="5">
+      <input id="rating" type="number" formControlName="rating">
       <app-error-msg [msg]="errorMsgs['rating']"></app-error-msg>
       <br>
       <br>
@@ -103,6 +103,18 @@ export class EditHotelComponent implements OnInit {
 
       control?.valueChanges?.pipe(debounceTime(1000)).subscribe(() => {this.setErrorMessage(controlName, control)});
     });
+
+    this.form.controls['rating'].valueChanges.subscribe((value: number | null) => {
+      if (value === null) {
+        this.errorMsgs['rating'] = this.validationErrors['required'];
+      } else if (value < 0) {
+        this.errorMsgs['rating'] = this.validationErrors['min'];
+      } else if (value > 5) {
+        this.errorMsgs['rating'] = this.validationErrors['max'];
+      } else {
+        this.errorMsgs['rating'] = '';
+      }
+    })
   }
 
   submit() {