From 2414e69c8451d1d2e002c48f2dd5830772ca3b62 Mon Sep 17 00:00:00 2001
From: Blind Dev <web3blind@gmail.com>
Date: Thu, 21 May 2026 14:36:59 +0000
Subject: [PATCH 1/2] Improve screen reader announcements for auth feedback

---
 src/app/app.component.html                                  | 4 ++--
 .../data-modal/is-authorized/is-authorized.component.html   | 2 +-
 src/app/shared/components/login/login.component.html        | 6 +++---
 .../settings/auth-settings/auth-settings.component.html     | 6 +++---
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 5eca86a7..080ff7ed 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -29,8 +29,8 @@
       </div>
     </mat-sidenav-content>
   </mat-sidenav-container>
-  <div *ngIf="!selNode.settings.themeColor" class="rtl-spinner">
-    <mat-spinner color="accent" />
+  <div *ngIf="!selNode.settings.themeColor" class="rtl-spinner" role="status" aria-live="polite" aria-atomic="true">
+    <mat-spinner color="accent" aria-label="Loading RTL" />
     <h4>Loading RTL...</h4>
   </div>
 </div>
diff --git a/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html b/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
index edd1877f..f42eb8ab 100644
--- a/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
+++ b/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
@@ -11,7 +11,7 @@
         <mat-form-field>
           <mat-label>Password</mat-label>
           <input autoFocus matInput type="password" id="password" name="password" tabindex="1" required [(ngModel)]="password">
-          <mat-error *ngIf="!password">Password is required.</mat-error>
+          <mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
         </mat-form-field>
         <div fxLayout="row" fxFlex="100" fxLayoutAlign="end center" class="mt-1">
           <button mat-button color="primary" tabindex="2" type="submit" default (click)="onAuthenticate()">Confirm</button>
diff --git a/src/app/shared/components/login/login.component.html b/src/app/shared/components/login/login.component.html
index a1342c7c..88f10e3b 100644
--- a/src/app/shared/components/login/login.component.html
+++ b/src/app/shared/components/login/login.component.html
@@ -19,13 +19,13 @@
                 <button mat-icon-button matSuffix tabindex="2" type="button" [attr.aria-label]="'Hide password'" (click)="flgShow = !flgShow">
                   <mat-icon>{{flgShow ? 'visibility_off' : 'visibility'}}</mat-icon>
                 </button>
-                <mat-error *ngIf="!password">Password is required.</mat-error>
+                <mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
               </mat-form-field>
-              <p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center">
+              <p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center" role="alert" aria-live="assertive" aria-atomic="true">
                 <mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
                 {{loginErrorMessage}}
               </p>
-              <p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center">
+              <p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center" role="status" aria-live="polite" aria-atomic="true">
                 <mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
                 {{logoutReason}}
               </p>
diff --git a/src/app/shared/components/settings/auth-settings/auth-settings.component.html b/src/app/shared/components/settings/auth-settings/auth-settings.component.html
index 5d49d9a4..4ab96520 100644
--- a/src/app/shared/components/settings/auth-settings/auth-settings.component.html
+++ b/src/app/shared/components/settings/auth-settings/auth-settings.component.html
@@ -7,17 +7,17 @@
     <mat-form-field>
       <mat-label>Current Password</mat-label>
       <input autoFocus matInput type="password" id="currpassword" name="currpassword" tabindex="1" required [(ngModel)]="currPassword">
-      <mat-error *ngIf="!currPassword">Current password is required.</mat-error>
+      <mat-error *ngIf="!currPassword" role="alert" aria-live="assertive">Current password is required.</mat-error>
     </mat-form-field>
     <mat-form-field>
       <mat-label>New Password</mat-label>
       <input matInput type="password" id="newpassword" name="newpassword" tabindex="2" required [(ngModel)]="newPassword">
-      <mat-error *ngIf="matchOldAndNewPasswords()">{{errorMsg}}</mat-error>
+      <mat-error *ngIf="matchOldAndNewPasswords()" role="alert" aria-live="assertive">{{errorMsg}}</mat-error>
     </mat-form-field>
     <mat-form-field>
       <mat-label>Confirm New Password</mat-label>
       <input matInput type="password" id="confirmpassword" name="confirmpassword" tabindex="3" required [(ngModel)]="confirmPassword">
-      <mat-error *ngIf="matchNewPasswords()">{{errorConfirmMsg}}</mat-error>
+      <mat-error *ngIf="matchNewPasswords()" role="alert" aria-live="assertive">{{errorConfirmMsg}}</mat-error>
     </mat-form-field>
     <div fxLayout="row" fxLayoutAlign="start start" class="mt-1">
       <button class="mr-1" mat-stroked-button color="primary" type="reset" tabindex="4" (click)="onResetPassword()">Reset</button>

From b024ed5bfc609cfeee8113c00bd6f12e909f7dd1 Mon Sep 17 00:00:00 2001
From: Denis Skripnik <deniska299@gmail.com>
Date: Sun, 31 May 2026 09:17:34 +0000
Subject: [PATCH 2/2] fix: refine auth feedback live announcements

---
 src/app/app.component.html                                  | 4 ++--
 .../data-modal/is-authorized/is-authorized.component.html   | 2 +-
 src/app/shared/components/login/login.component.html        | 6 +++---
 .../settings/auth-settings/auth-settings.component.html     | 6 +++---
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 080ff7ed..f6907c9e 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -29,8 +29,8 @@
       </div>
     </mat-sidenav-content>
   </mat-sidenav-container>
-  <div *ngIf="!selNode.settings.themeColor" class="rtl-spinner" role="status" aria-live="polite" aria-atomic="true">
-    <mat-spinner color="accent" aria-label="Loading RTL" />
+  <div *ngIf="!selNode.settings.themeColor" class="rtl-spinner" role="status">
+    <mat-spinner color="accent" aria-hidden="true" />
     <h4>Loading RTL...</h4>
   </div>
 </div>
diff --git a/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html b/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
index f42eb8ab..5adab9d4 100644
--- a/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
+++ b/src/app/shared/components/data-modal/is-authorized/is-authorized.component.html
@@ -11,7 +11,7 @@
         <mat-form-field>
           <mat-label>Password</mat-label>
           <input autoFocus matInput type="password" id="password" name="password" tabindex="1" required [(ngModel)]="password">
-          <mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
+          <mat-error *ngIf="!password" aria-live="polite">Password is required.</mat-error>
         </mat-form-field>
         <div fxLayout="row" fxFlex="100" fxLayoutAlign="end center" class="mt-1">
           <button mat-button color="primary" tabindex="2" type="submit" default (click)="onAuthenticate()">Confirm</button>
diff --git a/src/app/shared/components/login/login.component.html b/src/app/shared/components/login/login.component.html
index 88f10e3b..db52cfbc 100644
--- a/src/app/shared/components/login/login.component.html
+++ b/src/app/shared/components/login/login.component.html
@@ -19,13 +19,13 @@
                 <button mat-icon-button matSuffix tabindex="2" type="button" [attr.aria-label]="'Hide password'" (click)="flgShow = !flgShow">
                   <mat-icon>{{flgShow ? 'visibility_off' : 'visibility'}}</mat-icon>
                 </button>
-                <mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
+                <mat-error *ngIf="!password" aria-live="polite">Password is required.</mat-error>
               </mat-form-field>
-              <p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center" role="alert" aria-live="assertive" aria-atomic="true">
+              <p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center" role="alert">
                 <mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
                 {{loginErrorMessage}}
               </p>
-              <p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center" role="status" aria-live="polite" aria-atomic="true">
+              <p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center" role="status">
                 <mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
                 {{logoutReason}}
               </p>
diff --git a/src/app/shared/components/settings/auth-settings/auth-settings.component.html b/src/app/shared/components/settings/auth-settings/auth-settings.component.html
index 4ab96520..ac4ea16f 100644
--- a/src/app/shared/components/settings/auth-settings/auth-settings.component.html
+++ b/src/app/shared/components/settings/auth-settings/auth-settings.component.html
@@ -7,17 +7,17 @@
     <mat-form-field>
       <mat-label>Current Password</mat-label>
       <input autoFocus matInput type="password" id="currpassword" name="currpassword" tabindex="1" required [(ngModel)]="currPassword">
-      <mat-error *ngIf="!currPassword" role="alert" aria-live="assertive">Current password is required.</mat-error>
+      <mat-error *ngIf="!currPassword" aria-live="polite">Current password is required.</mat-error>
     </mat-form-field>
     <mat-form-field>
       <mat-label>New Password</mat-label>
       <input matInput type="password" id="newpassword" name="newpassword" tabindex="2" required [(ngModel)]="newPassword">
-      <mat-error *ngIf="matchOldAndNewPasswords()" role="alert" aria-live="assertive">{{errorMsg}}</mat-error>
+      <mat-error *ngIf="matchOldAndNewPasswords()" aria-live="polite">{{errorMsg}}</mat-error>
     </mat-form-field>
     <mat-form-field>
       <mat-label>Confirm New Password</mat-label>
       <input matInput type="password" id="confirmpassword" name="confirmpassword" tabindex="3" required [(ngModel)]="confirmPassword">
-      <mat-error *ngIf="matchNewPasswords()" role="alert" aria-live="assertive">{{errorConfirmMsg}}</mat-error>
+      <mat-error *ngIf="matchNewPasswords()" aria-live="polite">{{errorConfirmMsg}}</mat-error>
     </mat-form-field>
     <div fxLayout="row" fxLayoutAlign="start start" class="mt-1">
       <button class="mr-1" mat-stroked-button color="primary" type="reset" tabindex="4" (click)="onResetPassword()">Reset</button>