Support ICU in TS components

1 files changed, 36 insertions, 11 deletions

diff --git a/client/src/app/+admin/overview/users/user-list/user-list.component.ts b/client/src/app/+admin/overview/users/user-list/user-list.component.ts
index 9d11bd02e..f7dc22256 100644
--- a/client/src/app/+admin/overview/users/user-list/user-list.component.ts
+++ b/client/src/app/+admin/overview/users/user-list/user-list.component.ts
@@ -2,7 +2,7 @@ import { SortMeta } from 'primeng/api'
 import { Component, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { AuthService, ConfirmService, LocalStorageService, Notifier, RestPagination, RestTable, ServerService } from '@app/core'
-import { getAPIHost } from '@app/helpers'
+import { prepareIcu, getAPIHost } from '@app/helpers'
 import { AdvancedInputFilter } from '@app/shared/shared-forms'
 import { Actor, DropdownAction } from '@app/shared/shared-main'
 import { AccountMutedStatus, BlocklistService, UserBanModalComponent, UserModerationDisplayType } from '@app/shared/shared-moderation'
@@ -209,13 +209,25 @@ export class UserListComponent extends RestTable implements OnInit {
   }
 
   async unbanUsers (users: User[]) {
-    const res = await this.confirmService.confirm($localize`Do you really want to unban ${users.length} users?`, $localize`Unban`)
+    const res = await this.confirmService.confirm(
+      prepareIcu($localize`Do you really want to unban {count, plural, =1 {1 user} other {{count} users}}?`)(
+        { count: users.length },
+        $localize`Do you really want to unban ${users.length} users?`
+      ),
+      $localize`Unban`
+    )
+
     if (res === false) return
 
     this.userAdminService.unbanUsers(users)
         .subscribe({
           next: () => {
-            this.notifier.success($localize`${users.length} users unbanned.`)
+            this.notifier.success(
+              prepareIcu($localize`{count, plural, =1 {1 user} other {{count} users}} unbanned.`)(
+                { count: users.length },
+                $localize`${users.length} users unbanned.`
+              )
+            )
             this.reloadData()
           },
 
@@ -224,21 +236,28 @@ export class UserListComponent extends RestTable implements OnInit {
   }
 
   async removeUsers (users: User[]) {
-    for (const user of users) {
-      if (user.username === 'root') {
-        this.notifier.error($localize`You cannot delete root.`)
-        return
-      }
+    if (users.some(u => u.username === 'root')) {
+      this.notifier.error($localize`You cannot delete root.`)
+      return
     }
 
-    const message = $localize`If you remove these users, you will not be able to create others with the same username!`
+    const message = $localize`<p>You can't create users or channels with a username that already used by a deleted user/channel.</p>` +
+      $localize`It means the following usernames will be permanently deleted and cannot be recovered:` +
+      '<ul>' + users.map(u => '<li>' + u.username + '</li>').join('') + '</ul>'
+
     const res = await this.confirmService.confirm(message, $localize`Delete`)
     if (res === false) return
 
     this.userAdminService.removeUser(users)
       .subscribe({
         next: () => {
-          this.notifier.success($localize`${users.length} users deleted.`)
+          this.notifier.success(
+            prepareIcu($localize`{count, plural, =1 {1 user} other {{count} users}} deleted.`)(
+              { count: users.length },
+              $localize`${users.length} users deleted.`
+            )
+          )
+
           this.reloadData()
         },
 
@@ -250,7 +269,13 @@ export class UserListComponent extends RestTable implements OnInit {
     this.userAdminService.updateUsers(users, { emailVerified: true })
       .subscribe({
         next: () => {
-          this.notifier.success($localize`${users.length} users email set as verified.`)
+          this.notifier.success(
+            prepareIcu($localize`{count, plural, =1 {1 user} other {{count} users}} email set as verified.`)(
+              { count: users.length },
+              $localize`${users.length} users email set as verified.`
+            )
+          )
+
           this.reloadData()
         },