From b753cc0c6836857686c830494d3539e95bcf31a6 Mon Sep 17 00:00:00 2001
From: Tomasi - Developing <info@tomasi-developing.ch>
Date: Thu, 24 Apr 2025 09:13:32 +0200
Subject: [PATCH] v. 0.9.1

---
 Application/Profiles/CustomEventProfile.cs    |  1 +
 README.md                                     |  9 ++++++
 Ui/package-lock.json                          | 14 +++++++++
 Ui/package.json                               |  1 +
 .../forgot-password.component.html            |  4 +--
 .../Authentication/login/login.component.html |  8 ++---
 .../register/register.component.html          | 16 +++++-----
 .../reset-password.component.html             |  8 ++---
 .../sign-up/sign-up.component.html            | 28 ++++++++---------
 Ui/src/app/app.module.ts                      |  6 +++-
 ...om-event-participants-model.component.html |  5 +---
 ...stom-event-participants-model.component.ts |  2 +-
 .../invite-user-modal.component.html          |  8 ++---
 .../player-admonition-modal.component.html    |  4 +--
 .../player-edit-modal.component.html          | 12 ++++----
 .../player-note-modal.component.html          |  4 +--
 .../user-edit-modal.component.html            | 12 ++++----
 .../vs-duel-create-modal.component.html       | 22 +++++++-------
 .../app/pages/account/account.component.html  |  4 +--
 .../pages/alliance/alliance.component.html    | 12 ++++----
 .../change-password.component.html            | 12 ++++----
 .../custom-event-detail.component.html        |  3 ++
 .../custom-event-events.component.ts          |  6 +++-
 .../desert-storm/desert-storm.component.html  | 12 ++++----
 .../pages/feedback/feedback.component.html    | 30 +++++++++----------
 .../marshal-guard.component.html              |  8 ++---
 .../vs-duel-edit/vs-duel-edit.component.html  | 24 +++++++--------
 .../vs-duel-edit/vs-duel-edit.component.ts    |  2 +-
 .../zombie-siege/zombie-siege.component.html  |  8 ++---
 29 files changed, 159 insertions(+), 126 deletions(-)

diff --git a/Application/Profiles/CustomEventProfile.cs b/Application/Profiles/CustomEventProfile.cs
index 029e099..2b46a6c 100644
--- a/Application/Profiles/CustomEventProfile.cs
+++ b/Application/Profiles/CustomEventProfile.cs
@@ -12,6 +12,7 @@ public class CustomEventProfile : Profile
             .ForMember(des => des.CategoryName, opt => opt.MapFrom(src => src.CustomEventCategory!.Name));
 
         CreateMap<CustomEvent, CustomEventDetailDto>()
+            .ForMember(des => des.CategoryName, opt => opt.MapFrom(src => src.CustomEventCategory!.Name))
             .ForMember(des => des.CustomEventParticipants, opt => opt.MapFrom(src => src.CustomEventParticipants));
 
         CreateMap<CreateCustomEventDto, CustomEvent>()
diff --git a/README.md b/README.md
index 5c44f1b..152c209 100644
--- a/README.md
+++ b/README.md
@@ -18,6 +18,15 @@ This project is currently in the **Beta Phase**.
 
 ---
 
+### **[0.9.1]** - *2025-04-24*  
+#### ✨ Added  
+- **Number Formatting Input Mask:** Numbers are now automatically formatted for better readability (e.g., `250000` → `250.000`).  
+
+🛠️ **Fixed**  
+- Fixed an issue where the selected category was not saved correctly when updating a custom event.
+
+---
+
 ### **[0.9.0]** - *2025-04-23*  
 #### ✨ Added  
 - **Event Categories:** Custom events can now be assigned to specific categories.  
diff --git a/Ui/package-lock.json b/Ui/package-lock.json
index b12ec95..e836d9d 100644
--- a/Ui/package-lock.json
+++ b/Ui/package-lock.json
@@ -26,6 +26,7 @@
         "bootswatch": "^5.3.3",
         "jest-editor-support": "*",
         "moment": "^2.30.1",
+        "ngx-mask": "^19.0.6",
         "ngx-pagination": "^6.0.3",
         "ngx-spinner": "^17.0.0",
         "ngx-toastr": "^19.0.0",
@@ -10840,6 +10841,19 @@
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "dev": true
     },
+    "node_modules/ngx-mask": {
+      "version": "19.0.6",
+      "resolved": "https://registry.npmjs.org/ngx-mask/-/ngx-mask-19.0.6.tgz",
+      "integrity": "sha512-lJa3+gIg0XMwjRv71pqW7uYrzFPZXl7VUbdbafJ9uo7QydfHIhUe8ByPgWt5VxvSC2mp5ndE3O7jWMOtv7Kthw==",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=14.0.0",
+        "@angular/core": ">=14.0.0",
+        "@angular/forms": ">=14.0.0"
+      }
+    },
     "node_modules/ngx-pagination": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/ngx-pagination/-/ngx-pagination-6.0.3.tgz",
diff --git a/Ui/package.json b/Ui/package.json
index c805270..72a71ed 100644
--- a/Ui/package.json
+++ b/Ui/package.json
@@ -28,6 +28,7 @@
     "bootswatch": "^5.3.3",
     "jest-editor-support": "*",
     "moment": "^2.30.1",
+    "ngx-mask": "^19.0.6",
     "ngx-pagination": "^6.0.3",
     "ngx-spinner": "^17.0.0",
     "ngx-toastr": "^19.0.0",
diff --git a/Ui/src/app/Authentication/forgot-password/forgot-password.component.html b/Ui/src/app/Authentication/forgot-password/forgot-password.component.html
index 10d69c8..0cdcf42 100644
--- a/Ui/src/app/Authentication/forgot-password/forgot-password.component.html
+++ b/Ui/src/app/Authentication/forgot-password/forgot-password.component.html
@@ -9,11 +9,11 @@
       <form [formGroup]="forgotPasswordForm">
         <div class="form-floating mb-3 is-invalid">
           <input [ngClass]="{
-        'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched),
+        'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
         'is-valid': f['email'].valid}"
                  type="email" class="form-control" id="email" placeholder="email" formControlName="email">
           <label for="email">Email</label>
-          @if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) {
+          @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
             <div class="invalid-feedback">
               @if (f['email'].hasError('required')) {
                 <p>Email is required</p>
diff --git a/Ui/src/app/Authentication/login/login.component.html b/Ui/src/app/Authentication/login/login.component.html
index 6409e0a..c1d1974 100644
--- a/Ui/src/app/Authentication/login/login.component.html
+++ b/Ui/src/app/Authentication/login/login.component.html
@@ -12,10 +12,10 @@
             <!-- Email icon -->
             <i class="input-group-text bi bi-envelope-at-fill"></i>
             <!-- Email input control with dynamic classes for validation feedback -->
-            <input [ngClass]="{'is-invalid': email?.invalid && (email?.dirty || email?.touched),'is-valid': email?.valid}"
+            <input [ngClass]="{'is-invalid': email?.invalid && (email?.dirty || !email?.untouched),'is-valid': email?.valid}"
                    class="form-control" formControlName="email" id="email" placeholder="Email Address" type="email">
             <!-- Email validation messages -->
-            @if (email?.errors && (email?.dirty || email?.touched)) {
+            @if (email?.errors && (email?.dirty || !email?.untouched)) {
               <div class="invalid-feedback">
                 @if (email?.hasError('required')) {
                   <p>Email address is required</p>
@@ -36,7 +36,7 @@
             <i class="input-group-text bi bi-key-fill"></i>
             <!-- Password input control with dynamic classes for validation feedback and visibility toggle -->
             <input
-              [ngClass]="{'is-invalid': password?.invalid && (password?.dirty || password?.touched),'is-valid': password?.valid}"
+              [ngClass]="{'is-invalid': password?.invalid && (password?.dirty || !password?.untouched),'is-valid': password?.valid}"
               [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
               formControlName="password" id="password" placeholder="Password">
             <!-- Eye icon to toggle password visibility -->
@@ -44,7 +44,7 @@
                [ngClass]="isPasswordType ? 'bi bi-eye-fill' : 'bi-eye-slash-fill'" class="input-group-text eye-icon bi">
             </i>
             <!-- Password validation messages -->
-            @if (password?.errors && (password?.dirty || password?.touched)) {
+            @if (password?.errors && (password?.dirty || !password?.untouched)) {
               <div class="invalid-feedback">
                 @if (password?.hasError('required')) {
                   <p>Password is required</p>
diff --git a/Ui/src/app/Authentication/register/register.component.html b/Ui/src/app/Authentication/register/register.component.html
index e2bf256..748e8cb 100644
--- a/Ui/src/app/Authentication/register/register.component.html
+++ b/Ui/src/app/Authentication/register/register.component.html
@@ -42,11 +42,11 @@
     <form [formGroup]="registerForm" (ngSubmit)="onSubmit()">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched),
+        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
         'is-valid': f['playerName'].valid}"
                type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
         <label for="playerName">Player Name</label>
-        @if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) {
+        @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['playerName'].hasError('required')) {
               <p>Player name is required</p>
@@ -57,11 +57,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched),
+        'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
         'is-valid': f['email'].valid}"
                type="email" class="form-control" id="email" placeholder="email" formControlName="email">
         <label for="email">Email</label>
-        @if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) {
+        @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
           <div class="invalid-feedback">
             @if (f['email'].hasError('required')) {
               <p>Email is required</p>
@@ -77,7 +77,7 @@
         <div class="form-floating is-invalid">
           <!-- Password Input  -->
           <input
-            [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || f['password'].touched),'is-valid': f['password'].valid}"
+            [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || !f['password'].untouched),'is-valid': f['password'].valid}"
             [type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control"
             formControlName="password"
             id="password" placeholder="password">
@@ -91,7 +91,7 @@
                    class="input-group-text eye-icon bi"></i>
             </span>
         <!-- Password Invalid Feedback  -->
-        <div *ngIf="f['password'].invalid && (f['password'].dirty || f['password'].touched )"
+        <div *ngIf="f['password'].invalid && (f['password'].dirty || !f['password'].untouched )"
              class="invalid-feedback">
           <p *ngIf="f['password'].hasError('required')">Password is required</p>
           <div *ngIf="!f['password'].hasError('required')">
@@ -126,7 +126,7 @@
 
       <div class="form-floating is-invalid mb-3">
         <!-- Confirm Password Input  -->
-        <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched),'is-valid': f['confirmPassword'].valid}"
+        <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),'is-valid': f['confirmPassword'].valid}"
                type="password" autocomplete="on" class="form-control"
                formControlName="confirmPassword"
                id="confirmPassword" placeholder="confirmPassword">
@@ -134,7 +134,7 @@
         <label for="confirmPassword">Confirm Password</label>
       </div>
       <!-- Confirm Password Invalid Feedback  -->
-      <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )"
+      <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )"
            class="invalid-feedback">
         <p *ngIf="f['confirmPassword'].hasError('required')">Confirmation is required</p>
         <p
diff --git a/Ui/src/app/Authentication/reset-password/reset-password.component.html b/Ui/src/app/Authentication/reset-password/reset-password.component.html
index 12f389c..4be66f5 100644
--- a/Ui/src/app/Authentication/reset-password/reset-password.component.html
+++ b/Ui/src/app/Authentication/reset-password/reset-password.component.html
@@ -46,12 +46,12 @@
       <div class="form-group">
         <label class="form-label" for="password">New Password</label>
         <div class="input-group">
-          <input [ngClass]="{ 'is-invalid': password?.invalid && (password?.dirty || password?.touched), 'is-valid': password?.valid}"
+          <input [ngClass]="{ 'is-invalid': password?.invalid && (password?.dirty || !password?.untouched), 'is-valid': password?.valid}"
                  [type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="password" id="password">
           <span (click)="isInputText = !isInputText" class="input-group-text eye-icon">
           <i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i>
         </span>
-          <div *ngIf="password?.hasError && (password?.dirty || password?.touched)" class="invalid-feedback">
+          <div *ngIf="password?.hasError && (password?.dirty || !password?.untouched)" class="invalid-feedback">
             <p *ngIf="password?.hasError('required')">Password is required</p>
             <div *ngIf="!password?.hasError('required')">
               <div [ngClass]="password?.hasError('hasNumber') ? 'text-danger': 'text-success'">
@@ -84,12 +84,12 @@
       <div class="form-group">
         <label class="form-label" for="confirmPassword">Confirm Password</label>
         <div class="input-group">
-          <input [ngClass]="{'is-invalid': confirmPassword?.invalid && (confirmPassword?.dirty || confirmPassword?.touched), 'is-valid': confirmPassword?.valid}"
+          <input [ngClass]="{'is-invalid': confirmPassword?.invalid && (confirmPassword?.dirty || !confirmPassword?.untouched), 'is-valid': confirmPassword?.valid}"
                  [type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="confirmPassword" id="confirmPassword">
           <span (click)="isInputText = !isInputText" class="input-group-text eye-icon">
           <i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i>
         </span>
-          <div *ngIf="confirmPassword?.errors && (confirmPassword?.dirty || confirmPassword?.touched)" class="invalid-feedback">
+          <div *ngIf="confirmPassword?.errors && (confirmPassword?.dirty || !confirmPassword?.untouched)" class="invalid-feedback">
             <p *ngIf="confirmPassword?.hasError('required')">Repeat password is required</p>
             <p *ngIf="confirmPassword?.hasError('passwordMismatch')">Passwords do not match</p>
           </div>
diff --git a/Ui/src/app/Authentication/sign-up/sign-up.component.html b/Ui/src/app/Authentication/sign-up/sign-up.component.html
index 9f22875..6e88ae8 100644
--- a/Ui/src/app/Authentication/sign-up/sign-up.component.html
+++ b/Ui/src/app/Authentication/sign-up/sign-up.component.html
@@ -4,11 +4,11 @@
     <form [formGroup]="signUpForm" (ngSubmit)="onSignUp()">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched),
+        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
         'is-valid': f['playerName'].valid}"
                type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
         <label for="playerName">Player name</label>
-        @if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) {
+        @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['playerName'].hasError('required')) {
               <p>Player name is required</p>
@@ -19,11 +19,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched),
+        'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
         'is-valid': f['email'].valid}"
                type="email" class="form-control" id="email" placeholder="email" formControlName="email">
         <label for="email">Email</label>
-        @if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) {
+        @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
           <div class="invalid-feedback">
             @if (f['email'].hasError('required')) {
               <p>Email is required</p>
@@ -37,11 +37,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['allianceServer'].invalid && (f['allianceServer'].dirty || f['allianceServer'].touched),
+        'is-invalid': f['allianceServer'].invalid && (f['allianceServer'].dirty || !f['allianceServer'].untouched),
         'is-valid': f['allianceServer'].valid}"
                type="number" class="form-control" id="allianceServer" placeholder="allianceServer" formControlName="allianceServer">
         <label for="allianceServer">Server</label>
-        @if (f['allianceServer'].invalid && (f['allianceServer'].dirty || f['allianceServer'].touched)) {
+        @if (f['allianceServer'].invalid && (f['allianceServer'].dirty || !f['allianceServer'].untouched)) {
           <div class="invalid-feedback">
             @if (f['allianceServer'].hasError('required')) {
               <p>Server is required</p>
@@ -52,11 +52,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['allianceName'].invalid && (f['allianceName'].dirty || f['allianceName'].touched),
+        'is-invalid': f['allianceName'].invalid && (f['allianceName'].dirty || !f['allianceName'].untouched),
         'is-valid': f['allianceName'].valid}"
                type="text" class="form-control" id="allianceName" placeholder="allianceName" formControlName="allianceName">
         <label for="allianceName">Alliance name</label>
-        @if (f['allianceName'].invalid && (f['allianceName'].dirty || f['allianceName'].touched)) {
+        @if (f['allianceName'].invalid && (f['allianceName'].dirty || !f['allianceName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['allianceName'].hasError('required')) {
               <p>Alliance name is required</p>
@@ -67,11 +67,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || f['allianceAbbreviation'].touched),
+        'is-invalid': f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || !f['allianceAbbreviation'].untouched),
         'is-valid': f['allianceAbbreviation'].valid}"
                type="text" class="form-control" id="allianceAbbreviation" placeholder="allianceAbbreviation" formControlName="allianceAbbreviation">
         <label for="allianceAbbreviation">Alliance abbreviation</label>
-        @if (f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || f['allianceAbbreviation'].touched)) {
+        @if (f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || !f['allianceAbbreviation'].untouched)) {
           <div class="invalid-feedback">
             @if (f['allianceAbbreviation'].hasError('required')) {
               <p>Alliance abbreviation is required</p>
@@ -84,7 +84,7 @@
         <div class="form-floating is-invalid">
           <!-- Password Input  -->
           <input
-            [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || f['password'].touched),'is-valid': f['password'].valid}"
+            [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || !f['password'].untouched),'is-valid': f['password'].valid}"
             [type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control"
             formControlName="password"
             id="password" placeholder="password">
@@ -98,7 +98,7 @@
                    class="input-group-text eye-icon bi"></i>
             </span>
         <!-- Password Invalid Feedback  -->
-        <div *ngIf="f['password'].invalid && (f['password'].dirty || f['password'].touched )"
+        <div *ngIf="f['password'].invalid && (f['password'].dirty || !f['password'].untouched )"
              class="invalid-feedback">
           <p *ngIf="f['password'].hasError('required')">Required</p>
           <div *ngIf="!f['password'].hasError('required')">
@@ -133,7 +133,7 @@
 
       <div class="form-floating is-invalid mb-3">
         <!-- Confirm Password Input  -->
-        <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched),'is-valid': f['confirmPassword'].valid}"
+        <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),'is-valid': f['confirmPassword'].valid}"
                type="password" autocomplete="on" class="form-control"
                formControlName="confirmPassword"
                id="confirmPassword" placeholder="confirmPassword">
@@ -141,7 +141,7 @@
         <label for="confirmPassword">Confirm Password</label>
       </div>
       <!-- Confirm Password Invalid Feedback  -->
-      <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )"
+      <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )"
            class="invalid-feedback">
         <p *ngIf="f['confirmPassword'].hasError('required')">Confirmation password is required</p>
         <p
diff --git a/Ui/src/app/app.module.ts b/Ui/src/app/app.module.ts
index faba739..fa9ebdb 100644
--- a/Ui/src/app/app.module.ts
+++ b/Ui/src/app/app.module.ts
@@ -64,6 +64,7 @@ import { ImprintComponent } from './pages/imprint/imprint.component';
 import { CustomEventCategoryComponent } from './pages/custom-event/custom-event-category/custom-event-category.component';
 import { CustomEventLeaderboardComponent } from './pages/custom-event/custom-event-leaderboard/custom-event-leaderboard.component';
 import { CustomEventEventsComponent } from './pages/custom-event/custom-event-events/custom-event-events.component';
+import {NgxMaskDirective, NgxMaskPipe, provideNgxMask} from "ngx-mask";
 
 @NgModule({
   declarations: [
@@ -137,9 +138,12 @@ import { CustomEventEventsComponent } from './pages/custom-event/custom-event-ev
                 tokenGetter: () => localStorage.getItem(''),
             }
         }),
-        AgCharts
+        AgCharts,
+      NgxMaskDirective,
+      NgxMaskPipe
     ],
   providers: [
+    provideNgxMask(),
     provideHttpClient(withInterceptors([spinnerInterceptor, jwtInterceptor]))
   ],
   bootstrap: [AppComponent]
diff --git a/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.html b/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.html
index 77df1d4..3f0dbfe 100644
--- a/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.html
+++ b/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.html
@@ -24,15 +24,12 @@
                         <input [ngClass]="{
                           'is-valid': participant.get('achievedPoints')?.valid,
                           'is-invalid': participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty)
-                          }" type="number" min="0" class="form-control form-control-sm" id="point{{i}}" formControlName="achievedPoints">
+                          }" type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999"  class="form-control form-control-sm" id="point{{i}}" formControlName="achievedPoints">
                         @if (participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty)) {
                           <div class="invalid-feedback">
                             @if (participant.get('achievedPoints')?.hasError('required')){
                               <p>points is required</p>
                             }
-                            @if (participant.get('achievedPoints')?.hasError('pattern')){
-                              <p>points must not be less than 0</p>
-                            }
                           </div>
                         }
                       </div>
diff --git a/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.ts b/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.ts
index f23d42e..aaf2f49 100644
--- a/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.ts
+++ b/Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.ts
@@ -63,7 +63,7 @@ export class CustomEventParticipantsModelComponent implements OnInit {
         playerId: new FormControl(player.playerId),
         playerName: new FormControl<string>(player.playerName),
         participated: new FormControl<boolean>(player.participated),
-        achievedPoints: new FormControl<number>(player.achievedPoints, [Validators.required, Validators.pattern('(0|[1-9]\\d*)')])
+        achievedPoints: new FormControl<number>(player.achievedPoints, [Validators.required])
       }))
     });
   }
diff --git a/Ui/src/app/modals/invite-user-modal/invite-user-modal.component.html b/Ui/src/app/modals/invite-user-modal/invite-user-modal.component.html
index 5cdafd4..130f643 100644
--- a/Ui/src/app/modals/invite-user-modal/invite-user-modal.component.html
+++ b/Ui/src/app/modals/invite-user-modal/invite-user-modal.component.html
@@ -8,11 +8,11 @@
     <form [formGroup]="inviteUserForm">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched),
+        'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
         'is-valid': f['email'].valid}"
                type="email" class="form-control" id="email" placeholder="email" formControlName="email">
         <label for="email">Email</label>
-        @if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) {
+        @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
           <div class="invalid-feedback">
             @if (f['email'].hasError('required')) {
               <p>Email is required</p>
@@ -25,14 +25,14 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <select [ngClass]="{
-        'is-invalid': f['role'].invalid && (f['role'].dirty || f['role'].touched),
+        'is-invalid': f['role'].invalid && (f['role'].dirty || !f['role'].untouched),
         'is-valid': f['role'].valid}" class="form-select" id="role"  formControlName="role">
           @for (role of roles; track role) {
             <option [ngValue]="role">{{role}}</option>
           }
         </select>
         <label for="role">Role</label>
-        @if (f['role'].invalid && (f['role'].dirty || f['role'].touched)) {
+        @if (f['role'].invalid && (f['role'].dirty || !f['role'].untouched)) {
           <div class="invalid-feedback">
             @if (f['role'].hasError('required')) {
               <p>Role is required</p>
diff --git a/Ui/src/app/modals/player-admonition-modal/player-admonition-modal.component.html b/Ui/src/app/modals/player-admonition-modal/player-admonition-modal.component.html
index 0bc73b1..5d1bc14 100644
--- a/Ui/src/app/modals/player-admonition-modal/player-admonition-modal.component.html
+++ b/Ui/src/app/modals/player-admonition-modal/player-admonition-modal.component.html
@@ -53,10 +53,10 @@
         <div class="form-floating mb-3">
           <textarea [ngClass]="{
           'is-valid': admonitionForm.controls['reason'].valid,
-          'is-invalid': admonitionForm.controls['reason'].invalid && (admonitionForm.controls['reason'].touched || admonitionForm.controls['reason'].dirty)
+          'is-invalid': admonitionForm.controls['reason'].invalid && (!admonitionForm.controls['reason'].untouched || admonitionForm.controls['reason'].dirty)
           }" class="form-control" maxlength="251" formControlName="reason" placeholder="reason" id="reason" style="height: 100px"></textarea>
           <label for="reason">Reason</label>
-          @if (admonitionForm.controls['reason'].invalid && (admonitionForm.controls['reason'].touched || admonitionForm.controls['reason'].dirty)) {
+          @if (admonitionForm.controls['reason'].invalid && (!admonitionForm.controls['reason'].untouched || admonitionForm.controls['reason'].dirty)) {
             <div class="invalid-feedback">
               @if (admonitionForm.controls['reason'].hasError('required')) {
                 <p>Reason is required</p>
diff --git a/Ui/src/app/modals/player-edit-modal/player-edit-modal.component.html b/Ui/src/app/modals/player-edit-modal/player-edit-modal.component.html
index 233ba50..1233a2c 100644
--- a/Ui/src/app/modals/player-edit-modal/player-edit-modal.component.html
+++ b/Ui/src/app/modals/player-edit-modal/player-edit-modal.component.html
@@ -8,11 +8,11 @@
     <form [formGroup]="playerForm">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched),
+        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
         'is-valid': f['playerName'].valid}"
                type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
         <label for="playerName">Player name</label>
-        @if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) {
+        @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['playerName'].hasError('required')) {
               <p>Player name is required</p>
@@ -25,11 +25,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched),
+        'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
         'is-valid': f['level'].valid}"
                type="number" class="form-control" id="level" placeholder="level" formControlName="level">
         <label for="level">Level</label>
-        @if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) {
+        @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
           <div class="invalid-feedback">
             @if (f['level'].hasError('required')) {
               <p>Level is required</p>
@@ -39,14 +39,14 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <select [ngClass]="{
-        'is-invalid': f['rankId'].invalid && (f['rankId'].dirty || f['level'].touched),
+        'is-invalid': f['rankId'].invalid && (f['rankId'].dirty || !f['level'].untouched),
         'is-valid': f['rankId'].valid}" class="form-select" id="rankId"  formControlName="rankId">
           @for (rank of ranks; track rank.id) {
             <option [ngValue]="rank.id">{{rank.name}}</option>
           }
         </select>
         <label for="rankId">Rank</label>
-        @if (f['rankId'].invalid && (f['rankId'].dirty || f['rankId'].touched)) {
+        @if (f['rankId'].invalid && (f['rankId'].dirty || !f['rankId'].untouched)) {
           <div class="invalid-feedback">
             @if (f['rankId'].hasError('required')) {
               <p>Rank is required</p>
diff --git a/Ui/src/app/modals/player-note-modal/player-note-modal.component.html b/Ui/src/app/modals/player-note-modal/player-note-modal.component.html
index 04353b9..246badd 100644
--- a/Ui/src/app/modals/player-note-modal/player-note-modal.component.html
+++ b/Ui/src/app/modals/player-note-modal/player-note-modal.component.html
@@ -53,10 +53,10 @@
           <div class="form-floating mb-3">
             <textarea [ngClass]="{
             'is-valid': noteForm.controls['playerNote'].valid,
-            'is-invalid': noteForm.controls['playerNote'].invalid && (noteForm.controls['playerNote'].touched || noteForm.controls['playerNote'].dirty)
+            'is-invalid': noteForm.controls['playerNote'].invalid && (!noteForm.controls['playerNote'].untouched || noteForm.controls['playerNote'].dirty)
             }" class="form-control" maxlength="501" formControlName="playerNote" placeholder="playerNote" id="playerNote" style="height: 100px"></textarea>
             <label for="playerNote">Note</label>
-            @if (noteForm.controls['playerNote'].invalid && (noteForm.controls['playerNote'].touched || noteForm.controls['playerNote'].dirty)) {
+            @if (noteForm.controls['playerNote'].invalid && (!noteForm.controls['playerNote'].untouched || noteForm.controls['playerNote'].dirty)) {
               <div class="invalid-feedback">
                 @if (noteForm.controls['playerNote'].hasError('required')) {
                   <p>Note is required</p>
diff --git a/Ui/src/app/modals/user-edit-modal/user-edit-modal.component.html b/Ui/src/app/modals/user-edit-modal/user-edit-modal.component.html
index 400ee7f..9e72495 100644
--- a/Ui/src/app/modals/user-edit-modal/user-edit-modal.component.html
+++ b/Ui/src/app/modals/user-edit-modal/user-edit-modal.component.html
@@ -8,11 +8,11 @@
     <form [formGroup]="userForm">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched),
+        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
         'is-valid': f['playerName'].valid}"
                type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
         <label for="playerName">Player name</label>
-        @if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) {
+        @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['playerName'].hasError('required')) {
               <p>Player name is required</p>
@@ -25,11 +25,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched),
+        'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
         'is-valid': f['email'].valid}"
                type="email" class="form-control" id="email" placeholder="email" formControlName="email">
         <label for="email">Email</label>
-        @if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) {
+        @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
           <div class="invalid-feedback">
             @if (f['email'].hasError('required')) {
               <p>Email is required</p>
@@ -42,14 +42,14 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <select [ngClass]="{
-        'is-invalid': f['role'].invalid && (f['role'].dirty || f['level'].touched),
+        'is-invalid': f['role'].invalid && (f['role'].dirty || !f['level'].untouched),
         'is-valid': f['role'].valid}" class="form-select" id="role"  formControlName="role">
           @for (role of roles; track role) {
             <option [ngValue]="role">{{role}}</option>
           }
         </select>
         <label for="role">Role</label>
-        @if (f['role'].invalid && (f['role'].dirty || f['role'].touched)) {
+        @if (f['role'].invalid && (f['role'].dirty || !f['role'].untouched)) {
           <div class="invalid-feedback">
             @if (f['role'].hasError('required')) {
               <p>Role is required</p>
diff --git a/Ui/src/app/modals/vs-duel-create-modal/vs-duel-create-modal.component.html b/Ui/src/app/modals/vs-duel-create-modal/vs-duel-create-modal.component.html
index 2e06908..46d70b9 100644
--- a/Ui/src/app/modals/vs-duel-create-modal/vs-duel-create-modal.component.html
+++ b/Ui/src/app/modals/vs-duel-create-modal/vs-duel-create-modal.component.html
@@ -12,11 +12,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched),
+        'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched),
         'is-valid': f['opponentName'].valid}"
                type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
         <label for="opponentName">Opponent name</label>
-        @if (f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched)) {
+        @if (f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentName'].hasError('required')) {
               <p>Opponent name is required</p>
@@ -26,11 +26,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched),
+        'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched),
         'is-valid': f['opponentServer'].valid}"
                type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
         <label for="opponentServer">opponentServer</label>
-        @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched)) {
+        @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentServer'].hasError('required')) {
               <p>opponentServer is required</p>
@@ -40,11 +40,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentPower'].invalid && (f['opponentPower'].dirty || f['opponentPower'].touched),
+        'is-invalid': f['opponentPower'].invalid && (f['opponentPower'].dirty || !f['opponentPower'].untouched),
         'is-valid': f['opponentPower'].valid}"
-               type="number" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
+               type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999"  class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
         <label for="opponentPower">opponentPower</label>
-        @if (f['opponentPower'].invalid && (f['opponentPower'].dirty || f['opponentPower'].touched)) {
+        @if (f['opponentPower'].invalid && (f['opponentPower'].dirty || !f['opponentPower'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentPower'].hasError('required')) {
               <p>opponentPower is required</p>
@@ -54,11 +54,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentSize'].invalid && (f['opponentSize'].dirty || f['opponentSize'].touched),
+        'is-invalid': f['opponentSize'].invalid && (f['opponentSize'].dirty || !f['opponentSize'].untouched),
         'is-valid': f['opponentSize'].valid}"
                type="number" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize">
         <label for="opponentSize">opponentSize</label>
-        @if (f['opponentSize'].invalid && (f['opponentSize'].dirty || f['opponentSize'].touched)) {
+        @if (f['opponentSize'].invalid && (f['opponentSize'].dirty || !f['opponentSize'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentSize'].hasError('required')) {
               <p>opponentSize is required</p>
@@ -68,14 +68,14 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <select [ngClass]="{
-        'is-invalid': f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || f['vsDuelLeagueId'].touched),
+        'is-invalid': f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || !f['vsDuelLeagueId'].untouched),
         'is-valid': f['vsDuelLeagueId'].valid}" class="form-select" id="vsDuelLeagueId" formControlName="vsDuelLeagueId">
           @for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) {
             <option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option>
           }
         </select>
         <label for="vsDuelLeagueId">Vs Duel League</label>
-        @if (f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || f['vsDuelLeagueId'].touched)) {
+        @if (f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || !f['vsDuelLeagueId'].untouched)) {
           <div class="invalid-feedback">
             @if (f['vsDuelLeagueId'].hasError('required')) {
               <p>Vs Duel League is required</p>
diff --git a/Ui/src/app/pages/account/account.component.html b/Ui/src/app/pages/account/account.component.html
index da09604..a293892 100644
--- a/Ui/src/app/pages/account/account.component.html
+++ b/Ui/src/app/pages/account/account.component.html
@@ -5,11 +5,11 @@
     <form [formGroup]="userForm" (ngSubmit)="onSubmit()">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched),
+        'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
         'is-valid': f['playerName'].valid}"
                type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
         <label for="playerName">Player name</label>
-        @if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) {
+        @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['playerName'].hasError('required')) {
               <p>Player name is required</p>
diff --git a/Ui/src/app/pages/alliance/alliance.component.html b/Ui/src/app/pages/alliance/alliance.component.html
index 5408f48..ac3e07a 100644
--- a/Ui/src/app/pages/alliance/alliance.component.html
+++ b/Ui/src/app/pages/alliance/alliance.component.html
@@ -20,10 +20,10 @@
             <div class="form-floating mb-3">
               <input [ngClass]="{
         'is-valid': f['server'].valid,
-        'is-invalid': f['server'].invalid && (f['server'].touched || f['server'].dirty )
+        'is-invalid': f['server'].invalid && (!f['server'].untouched || f['server'].dirty )
         }" type="number" min="0" formControlName="server" class="form-control" id="server" placeholder="469">
               <label for="server">Server</label>
-              @if (f['server'].invalid && (f['server'].touched || f['server'].dirty)) {
+              @if (f['server'].invalid && (!f['server'].untouched || f['server'].dirty)) {
                 <div class="invalid-feedback">
                   @if (f['server'].hasError('required')) {
                     <p>Server is required</p>
@@ -35,10 +35,10 @@
             <div class="form-floating mb-3">
               <input [ngClass]="{
         'is-valid': f['name'].valid,
-        'is-invalid': f['name'].invalid && (f['name'].touched || f['name'].dirty )
+        'is-invalid': f['name'].invalid && (!f['name'].untouched || f['name'].dirty )
         }" type="text" formControlName="name" maxlength="201" class="form-control" id="name" placeholder="Old Vikings">
               <label for="name">Name</label>
-              @if (f['name'].invalid && (f['name'].touched || f['name'].dirty)) {
+              @if (f['name'].invalid && (!f['name'].untouched || f['name'].dirty)) {
                 <div class="invalid-feedback">
                   @if (f['name'].hasError('required')) {
                     <p>Name is required</p>
@@ -53,11 +53,11 @@
             <div class="form-floating mb-3">
               <input [ngClass]="{
         'is-valid': f['abbreviation'].valid,
-        'is-invalid': f['abbreviation'].invalid && (f['abbreviation'].touched || f['abbreviation'].dirty )
+        'is-invalid': f['abbreviation'].invalid && (!f['abbreviation'].untouched || f['abbreviation'].dirty )
         }" type="text" formControlName="abbreviation" maxlength="5" class="form-control" id="abbreviation"
                      placeholder="vis">
               <label for="abbreviation">Abbreviation</label>
-              @if (f['abbreviation'].invalid && (f['abbreviation'].touched || f['abbreviation'].dirty)) {
+              @if (f['abbreviation'].invalid && (!f['abbreviation'].untouched || f['abbreviation'].dirty)) {
                 <div class="invalid-feedback">
                   @if (f['abbreviation'].hasError('required')) {
                     <p>Abbreviation is required</p>
diff --git a/Ui/src/app/pages/change-password/change-password.component.html b/Ui/src/app/pages/change-password/change-password.component.html
index 0217750..43b2800 100644
--- a/Ui/src/app/pages/change-password/change-password.component.html
+++ b/Ui/src/app/pages/change-password/change-password.component.html
@@ -8,7 +8,7 @@
       <div class="input-group has-validation mb-3">
         <div class="form-floating is-invalid">
           <input [ngClass]="{
-          'is-invalid': f['currentPassword'].invalid && (f['currentPassword'].dirty || f['currentPassword'].touched),
+          'is-invalid': f['currentPassword'].invalid && (f['currentPassword'].dirty || !f['currentPassword'].untouched),
           'is-valid': f['currentPassword'].valid
         }" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
                  formControlName="currentPassword" id="currentPassword" placeholder="currentPassword">
@@ -21,7 +21,7 @@
            class="input-group-text eye-icon bi"></i>
       </span>
         <!-- Error message for current password field -->
-        @if (f['currentPassword'].invalid && (f['currentPassword'].dirty || f['currentPassword'].touched )) {
+        @if (f['currentPassword'].invalid && (f['currentPassword'].dirty || !f['currentPassword'].untouched )) {
           <div class="invalid-feedback">
             @if (f['currentPassword'].hasError('required')) {
               <p>Password is required</p>
@@ -34,7 +34,7 @@
       <div class="input-group has-validation mb-3">
         <div class="form-floating is-invalid">
           <input [ngClass]="{
-          'is-invalid': f['newPassword'].invalid && (f['newPassword'].dirty || f['newPassword'].touched),
+          'is-invalid': f['newPassword'].invalid && (f['newPassword'].dirty || !f['newPassword'].untouched),
           'is-valid': f['newPassword'].valid
         }" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
                  formControlName="newPassword"
@@ -48,7 +48,7 @@
            class="input-group-text eye-icon bi"></i>
       </span>
         <!-- Error messages for new password field -->
-        @if (f['newPassword'].invalid && (f['newPassword'].dirty || f['newPassword'].touched )) {
+        @if (f['newPassword'].invalid && (f['newPassword'].dirty || !f['newPassword'].untouched )) {
           <div class="invalid-feedback">
             @if (f['newPassword'].hasError('required')) {
               <p>Password is required</p>
@@ -92,7 +92,7 @@
       <div class="input-group has-validation mb-3">
         <div class="form-floating is-invalid">
           <input [ngClass]="{
-          'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched),
+          'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),
           'is-valid': f['confirmPassword'].valid
         }" [type]="isPasswordType ? 'password': 'text'" autocomplete="on" class="form-control"
                  formControlName="confirmPassword"
@@ -106,7 +106,7 @@
            class="input-group-text eye-icon bi"></i>
       </span>
         <!-- Error messages for confirming new password field -->
-        @if (f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )) {
+        @if (f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )) {
           <div class="invalid-feedback">
             @if (f['confirmPassword'].hasError('required')) {
               <p>Repeat password is required</p>
diff --git a/Ui/src/app/pages/custom-event/custom-event-detail/custom-event-detail.component.html b/Ui/src/app/pages/custom-event/custom-event-detail/custom-event-detail.component.html
index d763431..b1d5ad1 100644
--- a/Ui/src/app/pages/custom-event/custom-event-detail/custom-event-detail.component.html
+++ b/Ui/src/app/pages/custom-event/custom-event-detail/custom-event-detail.component.html
@@ -12,6 +12,9 @@
       <div class="card-body">
         <h5 class="card-title">Name: <span class="text-primary">{{customEventDetail.name}}</span></h5>
         <p class="card-text">Description: <span class="text-primary">{{customEventDetail.description}}</span></p>
+        @if (customEventDetail.customEventCategoryId) {
+          <p class="card-text">Category: <span class="text-primary">{{customEventDetail.categoryName}}</span></p>
+        }
         <p class="card-text">Point event:
           <i class="bi " [ngClass]="customEventDetail.isPointsEvent ? 'bi-check-lg text-success' : 'bi-x-lg text-danger'"></i>
         </p>
diff --git a/Ui/src/app/pages/custom-event/custom-event-events/custom-event-events.component.ts b/Ui/src/app/pages/custom-event/custom-event-events/custom-event-events.component.ts
index dfe3fd6..359484b 100644
--- a/Ui/src/app/pages/custom-event/custom-event-events/custom-event-events.component.ts
+++ b/Ui/src/app/pages/custom-event/custom-event-events/custom-event-events.component.ts
@@ -101,7 +101,7 @@ export class CustomEventEventsComponent implements OnInit {
     this.customEventForm = new FormGroup({
       id: new FormControl<string>(isUpdate ? customEventDetail!.id : ''),
       allianceId: new FormControl<string>(this.allianceId),
-      customEventCategoryId: new FormControl<string | null>(null),
+      customEventCategoryId: new FormControl<string | null>(isUpdate ? customEventDetail?.customEventCategoryId ? customEventDetail.customEventCategoryId : null : null),
       name: new FormControl<string>(isUpdate ? customEventDetail!.name : '', [Validators.required, Validators.maxLength(150)]),
       description: new FormControl<string>(isUpdate ? customEventDetail!.description : '', [Validators.required, Validators.maxLength(500)]),
       isPointsEvent: new FormControl<boolean>(isUpdate ? customEventDetail!.isPointsEvent : false),
@@ -112,6 +112,10 @@ export class CustomEventEventsComponent implements OnInit {
     this.isCreateCustomEvent = true;
     if (isUpdate) {
       this.customEventForm.controls['customEventCategoryId'].disable();
+      if (customEventDetail?.customEventCategoryId) {
+        this.customEventForm.controls['isPointsEvent'].disable();
+        this.customEventForm.controls['isParticipationEvent'].disable();
+      }
     }
   }
 
diff --git a/Ui/src/app/pages/desert-storm/desert-storm.component.html b/Ui/src/app/pages/desert-storm/desert-storm.component.html
index 55806c8..e6552fa 100644
--- a/Ui/src/app/pages/desert-storm/desert-storm.component.html
+++ b/Ui/src/app/pages/desert-storm/desert-storm.component.html
@@ -30,11 +30,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched),
+        'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched),
         'is-valid': f['opponentName'].valid}"
                type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
         <label for="opponentName">Opponent name</label>
-        @if (f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched)) {
+        @if (f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentName'].hasError('required')) {
               <p>Opponent name is required</p>
@@ -45,11 +45,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched),
+        'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched),
         'is-valid': f['opponentServer'].valid}"
                type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
         <label for="opponentServer">opponentServer</label>
-        @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched)) {
+        @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentServer'].hasError('required')) {
               <p>opponentServer is required</p>
@@ -60,11 +60,11 @@
 
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || f['OpposingParticipants'].touched),
+        'is-invalid': f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || !f['OpposingParticipants'].untouched),
         'is-valid': f['OpposingParticipants'].valid}"
                type="number" class="form-control" id="OpposingParticipants" placeholder="OpposingParticipants" formControlName="OpposingParticipants">
         <label for="OpposingParticipants">OpposingParticipants</label>
-        @if (f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || f['OpposingParticipants'].touched)) {
+        @if (f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || !f['OpposingParticipants'].untouched)) {
           <div class="invalid-feedback">
             @if (f['opponentPower'].hasError('required')) {
               <p>OpposingParticipants is required</p>
diff --git a/Ui/src/app/pages/feedback/feedback.component.html b/Ui/src/app/pages/feedback/feedback.component.html
index 798df48..e5646fe 100644
--- a/Ui/src/app/pages/feedback/feedback.component.html
+++ b/Ui/src/app/pages/feedback/feedback.component.html
@@ -7,7 +7,7 @@
       <div class="form-floating mb-3 is-invalid">
         <select [ngClass]="{
           'is-valid': f['type'].valid,
-          'is-invalid': f['type'].invalid && (f['type'].touched || f['type'].dirty)
+          'is-invalid': f['type'].invalid && (!f['type'].untouched || f['type'].dirty)
           }" class="form-control" id="type" formControlName="type" (change)="onTypeChange($event)">
           <option value="bug">Bug Report</option>
           <option value="feature">Feature Request</option>
@@ -18,10 +18,10 @@
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
           'is-valid': f['title'].valid,
-          'is-invalid': f['title'].invalid && (f['title'].touched || f['title'].dirty)
+          'is-invalid': f['title'].invalid && (!f['title'].untouched || f['title'].dirty)
           }" type="text" class="form-control" id="title" placeholder="Title" formControlName="title">
         <label for="title">Title</label>
-        @if (f['title'].invalid && (f['title'].touched || f['title'].dirty)) {
+        @if (f['title'].invalid && (!f['title'].untouched || f['title'].dirty)) {
           <div class="invalid-feedback">
             @if (f['title'].hasError('required')) {
               <p>Title is required</p>
@@ -33,10 +33,10 @@
       <div class="form-floating mb-3 is-invalid">
       <textarea [ngClass]="{
           'is-valid': f['description'].valid,
-          'is-invalid': f['description'].invalid && (f['description'].touched || f['description'].dirty)
+          'is-invalid': f['description'].invalid && (!f['description'].untouched || f['description'].dirty)
           }" class="form-control" id="description" formControlName="description" placeholder="Describe the issue or feature" style="height: 100px;"></textarea>
         <label for="description">Description</label>
-        @if (f['description'].invalid && (f['description'].touched || f['description'].dirty)) {
+        @if (f['description'].invalid && (!f['description'].untouched || f['description'].dirty)) {
           <div class="invalid-feedback">
             @if (f['description'].hasError('required')) {
               <p>Description is required</p>
@@ -54,10 +54,10 @@
         <div class="form-floating mb-3 is-invalid">
         <textarea [ngClass]="{
           'is-valid': f['expectedBehavior'].valid,
-          'is-invalid': f['expectedBehavior'].invalid && (f['expectedBehavior'].touched || f['expectedBehavior'].dirty)
+          'is-invalid': f['expectedBehavior'].invalid && (!f['expectedBehavior'].untouched || f['expectedBehavior'].dirty)
           }"  class="form-control" id="expectedBehavior" formControlName="expectedBehavior" placeholder="What did you expect to happen?" style="height: 100px;"></textarea>
           <label for="expectedBehavior">Expected Behavior</label>
-          @if (f['expectedBehavior'].invalid && (f['expectedBehavior'].touched || f['expectedBehavior'].dirty)) {
+          @if (f['expectedBehavior'].invalid && (!f['expectedBehavior'].untouched || f['expectedBehavior'].dirty)) {
             <div class="invalid-feedback">
               @if (f['expectedBehavior'].hasError('required')) {
                 <p>ExpectedBehavior is required</p>
@@ -69,10 +69,10 @@
         <div class="form-floating mb-3 is-invalid">
         <textarea [ngClass]="{
           'is-valid': f['actualBehavior'].valid,
-          'is-invalid': f['actualBehavior'].invalid && (f['actualBehavior'].touched || f['actualBehavior'].dirty)
+          'is-invalid': f['actualBehavior'].invalid && (!f['actualBehavior'].untouched || f['actualBehavior'].dirty)
           }"  class="form-control" id="actualBehavior" formControlName="actualBehavior" placeholder="What actually happened?" style="height: 100px;"></textarea>
           <label for="actualBehavior">Actual Behavior</label>
-          @if (f['actualBehavior'].invalid && (f['actualBehavior'].touched || f['actualBehavior'].dirty)) {
+          @if (f['actualBehavior'].invalid && (!f['actualBehavior'].untouched || f['actualBehavior'].dirty)) {
             <div class="invalid-feedback">
               @if (f['actualBehavior'].hasError('required')) {
                 <p>ActualBehavior is required</p>
@@ -84,10 +84,10 @@
         <div class="form-floating mb-3 is-invalid">
         <textarea [ngClass]="{
           'is-valid': f['reproduction'].valid,
-          'is-invalid': f['reproduction'].invalid && (f['reproduction'].touched || f['reproduction'].dirty)
+          'is-invalid': f['reproduction'].invalid && (!f['reproduction'].untouched || f['reproduction'].dirty)
           }"  class="form-control" id="reproduction" formControlName="reproduction" placeholder="List the steps to reproduce the issue" style="height: 100px;"></textarea>
           <label for="reproduction">Steps to Reproduce</label>
-          @if (f['reproduction'].invalid && (f['reproduction'].touched || f['reproduction'].dirty)) {
+          @if (f['reproduction'].invalid && (!f['reproduction'].untouched || f['reproduction'].dirty)) {
             <div class="invalid-feedback">
               @if (f['reproduction'].hasError('required')) {
                 <p>Reproduction is required</p>
@@ -99,7 +99,7 @@
         <div class="form-floating mb-3 is-invalid">
           <select [ngClass]="{
           'is-valid': f['severity'].valid,
-          'is-invalid': f['severity'].invalid && (f['severity'].touched || f['severity'].dirty)
+          'is-invalid': f['severity'].invalid && (!f['severity'].untouched || f['severity'].dirty)
           }"  class="form-control" id="severity" formControlName="severity">
             <option value="low">Low</option>
             <option value="medium">Medium</option>
@@ -111,7 +111,7 @@
         <div class="form-floating mb-3 is-invalid">
           <select [ngClass]="{
           'is-valid': f['os'].valid,
-          'is-invalid': f['os'].invalid && (f['os'].touched || f['os'].dirty)
+          'is-invalid': f['os'].invalid && (!f['os'].untouched || f['os'].dirty)
           }"  class="form-control" id="os" formControlName="os">
             <option value="windows">Windows</option>
             <option value="macos">macOS</option>
@@ -120,7 +120,7 @@
             <option value="ios">iOS</option>
           </select>
           <label for="os">Operating System</label>
-          @if (f['os'].invalid && (f['os'].touched || f['os'].dirty)) {
+          @if (f['os'].invalid && (!f['os'].untouched || f['os'].dirty)) {
             <div class="invalid-feedback">
               @if (f['os'].hasError('required')) {
                 <p>Operating System is required</p>
@@ -132,7 +132,7 @@
         <div class="form-floating mb-3 is-invalid">
           <input [ngClass]="{
           'is-valid': f['appVersion'].valid,
-          'is-invalid': f['appVersion'].invalid && (f['appVersion'].touched || f['appVersion'].dirty)
+          'is-invalid': f['appVersion'].invalid && (!f['appVersion'].untouched || f['appVersion'].dirty)
           }"  type="text" class="form-control" id="appVersion" formControlName="appVersion" placeholder="App version (e.g., 1.2.3)" readonly>
           <label for="appVersion">App Version</label>
         </div>
diff --git a/Ui/src/app/pages/marshal-guard/marshal-guard.component.html b/Ui/src/app/pages/marshal-guard/marshal-guard.component.html
index 316cd3d..bdc198d 100644
--- a/Ui/src/app/pages/marshal-guard/marshal-guard.component.html
+++ b/Ui/src/app/pages/marshal-guard/marshal-guard.component.html
@@ -11,11 +11,11 @@
       <form [formGroup]="marshalGuardForm">
         <div class="form-floating mb-3 is-invalid">
           <input [ngClass]="{
-        'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched),
+        'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched),
         'is-valid': f['eventDate'].valid}"
                  type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate">
           <label for="level">eventDate</label>
-          @if (f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched)) {
+          @if (f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched)) {
             <div class="invalid-feedback">
               @if (f['eventDate'].hasError('required')) {
                 <p>eventDate is required</p>
@@ -25,11 +25,11 @@
         </div>
         <div class="form-floating mb-3 is-invalid">
           <input [ngClass]="{
-        'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched),
+        'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
         'is-valid': f['level'].valid}"
                  type="number" class="form-control" id="level" placeholder="level" formControlName="level">
           <label for="level">Level</label>
-          @if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) {
+          @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
             <div class="invalid-feedback">
               @if (f['level'].hasError('required')) {
                 <p>Level is required</p>
diff --git a/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.html b/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.html
index 01060ff..d41e1ca 100644
--- a/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.html
+++ b/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.html
@@ -17,11 +17,11 @@
               <form [formGroup]="vsDuelForm">
                 <div class="form-floating mb-3 is-invalid">
                   <input [ngClass]="{
-        'is-invalid': df['opponentName'].invalid && (df['opponentName'].dirty || df['opponentName'].touched),
+        'is-invalid': df['opponentName'].invalid && (df['opponentName'].dirty || !df['opponentName'].untouched),
         'is-valid': df['opponentName'].valid}"
                          type="text" maxlength="151" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
                   <label for="opponentName">Opponent name</label>
-                  @if (df['opponentName'].invalid && (df['opponentName'].dirty || df['opponentName'].touched)) {
+                  @if (df['opponentName'].invalid && (df['opponentName'].dirty || !df['opponentName'].untouched)) {
                     <div class="invalid-feedback">
                       @if (df['opponentName'].hasError('required')) {
                         <p>Opponent Name is required</p>
@@ -34,11 +34,11 @@
                 </div>
                 <div class="form-floating mb-3 is-invalid">
                   <input [ngClass]="{
-        'is-invalid': df['opponentServer'].invalid && (df['opponentServer'].dirty || df['opponentServer'].touched),
+        'is-invalid': df['opponentServer'].invalid && (df['opponentServer'].dirty || !df['opponentServer'].untouched),
         'is-valid': df['opponentServer'].valid}"
                          type="number" min="0" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
                   <label for="opponentServer">Opponent server</label>
-                  @if (df['opponentServer'].invalid && (df['opponentServer'].dirty || df['opponentServer'].touched)) {
+                  @if (df['opponentServer'].invalid && (df['opponentServer'].dirty || !df['opponentServer'].untouched)) {
                     <div class="invalid-feedback">
                       @if (df['opponentServer'].hasError('required')) {
                         <p>Opponent server is required</p>
@@ -48,11 +48,11 @@
                 </div>
                 <div class="form-floating mb-3 is-invalid">
                   <input [ngClass]="{
-        'is-invalid': df['opponentPower'].invalid && (df['opponentPower'].dirty || df['opponentPower'].touched),
+        'is-invalid': df['opponentPower'].invalid && (df['opponentPower'].dirty || !df['opponentPower'].untouched),
         'is-valid': df['opponentPower'].valid}"
-                         type="number" min="0" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
+                         type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999"  class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
                   <label for="opponentPower">Opponent power</label>
-                  @if (df['opponentPower'].invalid && (df['opponentPower'].dirty || df['opponentPower'].touched)) {
+                  @if (df['opponentPower'].invalid && (df['opponentPower'].dirty || !df['opponentPower'].untouched)) {
                     <div class="invalid-feedback">
                       @if (df['opponentPower'].hasError('required')) {
                         <p>Opponent power is required</p>
@@ -62,11 +62,11 @@
                 </div>
                 <div class="form-floating mb-3 is-invalid">
                   <input [ngClass]="{
-        'is-invalid': df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched),
+        'is-invalid': df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched),
         'is-valid': df['opponentSize'].valid}"
                          type="number" min="0" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize">
                   <label for="opponentSize">Opponent size</label>
-                  @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched)) {
+                  @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched)) {
                     <div class="invalid-feedback">
                       @if (df['opponentSize'].hasError('required')) {
                         <p>Opponent size is required</p>
@@ -76,14 +76,14 @@
                 </div>
                 <div class="form-floating mb-3 is-invalid">
                   <select [ngClass]="{
-        'is-invalid': df['vsDuelLeagueId'].invalid && (df['vsDuelLeagueId'].dirty || df['vsDuelLeagueId'].touched),
+        'is-invalid': df['vsDuelLeagueId'].invalid && (df['vsDuelLeagueId'].dirty || !df['vsDuelLeagueId'].untouched),
         'is-valid': df['vsDuelLeagueId'].valid}" class="form-control" id="vsDuelLeagueId" formControlName="vsDuelLeagueId">
                     @for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) {
                       <option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option>
                     }
                   </select>
                   <label for="opponentSize">Opponent size</label>
-                  @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched)) {
+                  @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched)) {
                     <div class="invalid-feedback">
                       @if (df['opponentSize'].hasError('required')) {
                         <p>Opponent size is required</p>
@@ -129,7 +129,7 @@
                           <input [ngClass]="{
                           'is-valid': participant.get('weeklyPoints')?.valid,
                           'is-invalid': participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty)
-                          }" type="number" min="0" class="form-control form-control-sm" id="player{{i}}" formControlName="weeklyPoints">
+                          }" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999" type="text" min="0" class="form-control form-control-sm" id="player{{i}}" formControlName="weeklyPoints">
                           @if (participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty)) {
                             <div class="invalid-feedback">
                               @if (participant.get('weeklyPoints')?.hasError('required')){
diff --git a/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.ts b/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.ts
index 8a4b520..27d0cbd 100644
--- a/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.ts
+++ b/Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.ts
@@ -93,7 +93,7 @@ export class VsDuelEditComponent implements OnInit {
         id: new FormControl<string>(vsDuelParticipant.id),
         playerId: new FormControl<string>(vsDuelParticipant.playerId),
         vsDuelId: new FormControl<string>(vsDuelParticipant.vsDuelId),
-        weeklyPoints: new FormControl<number>(vsDuelParticipant.weeklyPoints, [Validators.required, Validators.pattern('(0|[1-9]\\d*)')]),
+        weeklyPoints: new FormControl<number>(vsDuelParticipant.weeklyPoints, [Validators.required]),
         playerName: new FormControl<string>(vsDuelParticipant.playerName),
       }));
     })
diff --git a/Ui/src/app/pages/zombie-siege/zombie-siege.component.html b/Ui/src/app/pages/zombie-siege/zombie-siege.component.html
index 3856356..e2fc5f0 100644
--- a/Ui/src/app/pages/zombie-siege/zombie-siege.component.html
+++ b/Ui/src/app/pages/zombie-siege/zombie-siege.component.html
@@ -11,11 +11,11 @@
     <form [formGroup]="zombieSiegeForm">
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched),
+        'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched),
         'is-valid': f['eventDate'].valid}"
                type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate">
         <label for="level">eventDate</label>
-        @if (f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched)) {
+        @if (f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched)) {
           <div class="invalid-feedback">
             @if (f['eventDate'].hasError('required')) {
               <p>eventDate is required</p>
@@ -25,11 +25,11 @@
       </div>
       <div class="form-floating mb-3 is-invalid">
         <input [ngClass]="{
-        'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched),
+        'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
         'is-valid': f['level'].valid}"
                type="number" class="form-control" id="level" placeholder="level" formControlName="level">
         <label for="level">Level</label>
-        @if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) {
+        @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
           <div class="invalid-feedback">
             @if (f['level'].hasError('required')) {
               <p>Level is required</p>