feat: Admin Area Players Management

frontend/src/app/features/shell/change-password/change-password-modal.component.ts

@@ -6,7 +6,6 @@ import {
   inject,
   input,
   output,
-  signal,
 } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
@@ -45,7 +44,7 @@ const DEFAULT_POLICY: PasswordPolicy = {
           data-testid="change-password-modal"
           (click)="$event.stopPropagation()"
         >
-          <h2 id="cp-title">Change password</h2>
+          <h2 id="cp-title">Change Password</h2>
 
           <form [formGroup]="form" (ngSubmit)="onSubmit()">
             @if (mode() === 'self') {
@@ -68,6 +67,9 @@ const DEFAULT_POLICY: PasswordPolicy = {
                 formControlName="newPassword"
                 data-testid="cp-new"
               />
+              @if (fieldErrorFor('newPassword'); as msg) {
+                <span class="error" data-testid="cp-new-error">{{ msg }}</span>
+              }
             </label>
 
             <label class="field">
@@ -78,6 +80,12 @@ const DEFAULT_POLICY: PasswordPolicy = {
                 formControlName="confirmNewPassword"
                 data-testid="cp-confirm"
               />
+              @if (fieldErrorFor('confirmPassword'); as msg) {
+                <span class="error" data-testid="cp-confirm-error">{{ msg }}</span>
+              }
+              @if (fieldErrorFor('confirmNewPassword'); as msg) {
+                <span class="error" data-testid="cp-confirm-error">{{ msg }}</span>
+              }
             </label>
 
             @if (errorMessage()) {
@@ -119,6 +127,7 @@ export class ChangePasswordModalComponent {
   readonly policy = input<PasswordPolicy>(DEFAULT_POLICY);
   readonly errorMessage = input<string | null>(null);
   readonly submitting = input<boolean>(false);
+  readonly fieldErrors = input<Record<string, string> | null>(null);
 
   readonly cancel = output<void>();
   readonly submit = output<ChangePasswordSubmitPayload>();
@@ -138,12 +147,19 @@ export class ChangePasswordModalComponent {
     return null;
   });
 
+  fieldErrorFor(path: string): string | null {
+    const map = this.fieldErrors();
+    if (!map) return null;
+    return map[path] ?? null;
+  }
+
   @HostListener('document:keydown.escape')
   onEscape(): void {
-    if (this.open()) this.onCancel();
+    if (this.open() && !this.submitting()) this.onCancel();
   }
 
   onCancel(): void {
+    if (this.submitting()) return;
     this.form.reset({ oldPassword: '', newPassword: '', confirmNewPassword: '' });
     this.cancel.emit();
   }