UI: Add in notification review list recipients

ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-notification-dialog.component.html

@@ -17,7 +17,7 @@
 -->
 <form [formGroup]="targetNotificationForm" class="tb-dialog-container">
   <mat-toolbar color="primary">
-    <h2>{{ (isAdd ? 'notification.add-notification-target' : 'notification.edit-notification-target') | translate }}</h2>
+    <h2>{{ (isAdd ? 'notification.add-notification-recipients-group' : 'notification.edit-notification-recipients-group') | translate }}</h2>
     <span fxFlex></span>
     <button mat-icon-button
             (click)="cancel()"
@@ -30,10 +30,10 @@
   <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>
   <div mat-dialog-content>
     <mat-form-field class="mat-block">
-      <mat-label translate>notification.target-name</mat-label>
+      <mat-label translate>notification.name</mat-label>
       <input matInput formControlName="name" required>
       <mat-error *ngIf="targetNotificationForm.get('name').hasError('required')">
-        {{ 'notification.target-name-required' | translate }}
+        {{ 'notification.name-required' | translate }}
       </mat-error>
     </mat-form-field>
     <section formGroupName="configuration">
@@ -48,7 +48,7 @@
       <section formGroupName="usersFilter"
                *ngIf="targetNotificationForm.get('configuration.type').value === notificationTargetType.PLATFORM_USERS">
         <mat-form-field class="mat-block" subscriptSizing="dynamic">
-          <mat-label translate>notification.target-type.user-filters</mat-label>
+          <mat-label translate>notification.recipient-type.user-filters</mat-label>
           <mat-select formControlName="type">
             <mat-option *ngFor="let type of notificationTargetConfigTypes" [value]="type">
               {{ notificationTargetConfigTypeInfoMap.get(type).name | translate }}
@@ -109,7 +109,7 @@
         </ng-container>
       </section>
       <section *ngIf="targetNotificationForm.get('configuration.type').value === notificationTargetType.SLACK">
-        <label class="tb-title">{{ 'notification.recipient-type' | translate }}</label>
+        <label class="tb-title">{{ 'notification.slack-chanel-type' | translate }}</label>
         <mat-radio-group formControlName="conversationType">
           <mat-radio-button *ngFor="let slackChanelType of slackChanelTypes" [value]="slackChanelType">
              {{ slackChanelTypesTranslateMap.get(slackChanelType) | translate }}

ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-config.resolver.ts

@@ -48,7 +48,6 @@ export class RecipientTableConfigResolver implements Resolve<EntityTableConfig<N
 
     this.config.entityType = EntityType.NOTIFICATION_TARGET;
     this.config.detailsPanelEnabled = false;
-    this.config.selectionEnabled = false;
     this.config.addEnabled = false;
     this.config.rowPointer = true;
 
@@ -57,8 +56,11 @@ export class RecipientTableConfigResolver implements Resolve<EntityTableConfig<N
 
     this.config.entitiesFetchFunction = pageLink => this.notificationService.getNotificationTargets(pageLink);
 
-    this.config.deleteEntityTitle = target => this.translate.instant('notification.delete-target-title', {targetName: target.name});
+    this.config.deleteEntityTitle = target => this.translate.instant('notification.delete-recipient-title', {recipientName: target.name});
-    this.config.deleteEntityContent = () => this.translate.instant('notification.delete-target-text');
+    this.config.deleteEntityContent = () => this.translate.instant('notification.delete-recipient-text');
+    this.config.deleteEntitiesTitle = count => this.translate.instant('notification.delete-recipients-title', {count});
+    this.config.deleteEntitiesContent = () => this.translate.instant('notification.delete-recipients-text');
+
     this.config.deleteEntity = id => this.notificationService.deleteNotificationTarget(id.id);
 
     this.config.cellActionDescriptors = this.configureCellActions();
@@ -75,7 +77,7 @@ export class RecipientTableConfigResolver implements Resolve<EntityTableConfig<N
 
     this.config.columns.push(
       new DateEntityTableColumn<NotificationTarget>('createdTime', 'common.created-time', this.datePipe, '170px'),
-      new EntityTableColumn<NotificationTarget>('name', 'notification.notification-target', '20%'),
+      new EntityTableColumn<NotificationTarget>('name', 'notification.recipient-group', '20%'),
       new EntityTableColumn<NotificationTarget>('configuration.type', 'notification.type', '20%',
         (target) => this.translate.instant(NotificationTargetTypeTranslationMap.get(target.configuration.type)),
         () => ({}), false),

ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-header.component.html

@@ -18,7 +18,7 @@
 <div fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
   <button mat-stroked-button color="primary" (click)="createTarget($event)">
     <div fxLayout="row" fxLayoutAlign="start center">
-      <mat-icon>add</mat-icon>{{ 'notification.add-target' | translate }}
+      <mat-icon>add</mat-icon>{{ 'notification.add-recipients' | translate }}
     </div>
   </button>
 </div>

ui-ngx/src/app/modules/home/pages/notification/rule/escalation-form.component.html

@@ -37,7 +37,7 @@
       subscriptSizing="dynamic"
       entityType="{{ entityType.NOTIFICATION_TARGET }}"
       subType="{{ notificationType.ALARM }}"
-      [placeholderText]="escalationFormGroup.get('targets').value ? '' : ('notification.add-target' | translate)">
+      [placeholderText]="escalationFormGroup.get('targets').value ? '' : ('notification.add-recipient' | translate)">
       <button #createTargetButton
               mat-button [fxHide]="disabled" matSuffix
               (click)="createTarget($event, createTargetButton)">

ui-ngx/src/app/modules/home/pages/notification/rule/rule-notification-dialog.component.html

@@ -67,7 +67,7 @@
             formControlName="targets"
             subType="{{ ruleNotificationForm.get('triggerType').value }}"
             entityType="{{ entityType.NOTIFICATION_TARGET }}"
-            placeholderText="{{ 'notification.target' | translate }}">
+            placeholderText="{{ 'notification.recipient' | translate }}">
             <button #createTargetButton
                     mat-button color="primary" matSuffix
                     (click)="createTarget($event, createTargetButton)">
@@ -78,7 +78,7 @@
         <ng-template #alarmTargesConfig>
           <fieldset class="fields-group tb-hierarchy" formGroupName="recipientsConfig">
             <legend translate>notification.escalation-chain</legend>
-            <div class="mat-body-2" translate>notification.targets</div>
+            <div class="mat-body-2" translate>notification.recipients</div>
             <tb-escalations-component formControlName="escalationTable"></tb-escalations-component>
             <ng-container *ngTemplateOutlet="clearRules"></ng-container>
           </fieldset>

ui-ngx/src/app/modules/home/pages/notification/rule/rule-table-config.resolver.ts

@@ -48,7 +48,6 @@ export class RuleTableConfigResolver implements Resolve<EntityTableConfig<Notifi
 
     this.config.entityType = EntityType.NOTIFICATION_RULE;
     this.config.detailsPanelEnabled = false;
-    this.config.selectionEnabled = false;
     this.config.addEnabled = false;
     this.config.rowPointer = true;
 
@@ -59,6 +58,8 @@ export class RuleTableConfigResolver implements Resolve<EntityTableConfig<Notifi
 
     this.config.deleteEntityTitle = rule => this.translate.instant('notification.delete-rule-title', {ruleName: rule.name});
     this.config.deleteEntityContent = () => this.translate.instant('notification.delete-rule-text');
+    this.config.deleteEntitiesTitle = count => this.translate.instant('notification.delete-rules-title', {count});
+    this.config.deleteEntitiesContent = () => this.translate.instant('notification.delete-rules-text');
     this.config.deleteEntity = id => this.notificationService.deleteNotificationRule(id.id);
 
     this.config.cellActionDescriptors = this.configureCellActions();

ui-ngx/src/app/modules/home/pages/notification/sent/sent-notification-dialog.component.html

@@ -79,9 +79,9 @@
           <tb-entity-list
             required
             formControlName="targets"
-            labelText="{{ 'notification.targets' | translate }}"
+            labelText="{{ 'notification.recipients' | translate }}"
-            placeholderText="{{ 'notification.target' | translate }}"
+            placeholderText="{{ 'notification.recipient' | translate }}"
-            requiredText="{{ 'notification.targets-required' | translate }}"
+            requiredText="{{ 'notification.recipients-required' | translate }}"
             entityType="{{ entityType.NOTIFICATION_TARGET }}"
             subType="{{ notificationType.GENERAL }}">
             <button #createTargetButton
@@ -336,11 +336,20 @@
             <mat-icon  class="tb-mat-18">supervisor_account</mat-icon>
             <div class="group-title">{{ 'notification.recipients-count' | translate : {count: preview.totalRecipientsCount} }}</div>
           </div>
-          <div class="details-recipients" *ngIf="notificationRequestForm.get('targets').value.length > 1">
+          <div class="details-recipients" *ngIf="notificationRequestForm.get('targets').value?.length > 1">
             <div *ngFor="let detail of preview.recipientsCountByTarget | keyvalue" class="details-recipient">
               <span class="number">{{ detail.value }}</span>{{ detail.key }}
             </div>
           </div>
+          <mat-divider class="divider"></mat-divider>
+          <div class="details-recipients">
+            <div *ngFor="let user of preview.recipientsPreview" class="details-recipient">
+              <span *ngIf="(user.firstName || user.lastName); else email">{{ user.firstName }}&nbsp;{{ user.lastName }} ({{ user.email }})</span>
+              <ng-template #email>
+                {{ user.email }}
+              </ng-template>
+            </div>
+          </div>
         </section>
       </div>
     </mat-step>

ui-ngx/src/app/modules/home/pages/notification/sent/sent-notification-dialog.component.scss

@@ -104,6 +104,10 @@
       }
     }
 
+    .divider {
+      margin-bottom: 8px;
+    }
+
     .web-preview {
       flex-direction: row;
       align-items: center;

ui-ngx/src/app/modules/home/pages/notification/template/template-notification-dialog.component.html

@@ -39,10 +39,10 @@
       <ng-template matStepLabel>{{ 'notification.basic-settings' | translate }}</ng-template>
       <form [formGroup]="templateNotificationForm" style="padding-bottom: 16px;">
         <mat-form-field class="mat-block">
-          <mat-label translate>notification.target-name</mat-label>
+          <mat-label translate>notification.name</mat-label>
           <input matInput formControlName="name" required>
           <mat-error *ngIf="templateNotificationForm.get('name').hasError('required')">
-            {{ 'notification.target-name-required' | translate }}
+            {{ 'notification.name-required' | translate }}
           </mat-error>
         </mat-form-field>
         <mat-form-field fxFlex class="mat-block" *ngIf="!hideSelectType">

ui-ngx/src/app/modules/home/pages/notification/template/template-table-config.resolver.ts

@@ -48,7 +48,6 @@ export class TemplateTableConfigResolver implements Resolve<EntityTableConfig<No
 
     this.config.entityType = EntityType.NOTIFICATION_TEMPLATE;
     this.config.detailsPanelEnabled = false;
-    this.config.selectionEnabled = false;
     this.config.addEnabled = false;
     this.config.rowPointer = true;
 
@@ -59,6 +58,8 @@ export class TemplateTableConfigResolver implements Resolve<EntityTableConfig<No
 
     this.config.deleteEntityTitle = template => this.translate.instant('notification.delete-template-title', {templateName: template.name});
     this.config.deleteEntityContent = () => this.translate.instant('notification.delete-template-text');
+    this.config.deleteEntitiesTitle = count => this.translate.instant('notification.delete-templates-title', {count});
+    this.config.deleteEntitiesContent = () => this.translate.instant('notification.delete-templates-text');
     this.config.deleteEntity = id => this.notificationService.deleteNotificationTemplate(id.id);
 
     this.config.cellActionDescriptors = this.configureCellActions();

ui-ngx/src/app/shared/models/entity-type.models.ts

@@ -369,15 +369,17 @@ export const entityTypeTranslations = new Map<EntityType | AliasEntityType, Enti
       {
         type: 'entity.type-notification-rule',
         noEntities: 'notification.no-rules-notification',
-        search: 'notification.search-rules'
+        search: 'notification.search-rules',
+        selectedEntities: 'notification.selected-rules'
       }
     ],
     [
       EntityType.NOTIFICATION_TARGET,
       {
         type: 'entity.type-notification-target',
-        noEntities: 'notification.no-targets-notification',
+        noEntities: 'notification.no-recipients-notification',
-        search: 'notification.search-targets'
+        search: 'notification.search-recipients',
+        selectedEntities: 'notification.selected-recipients'
       }
     ],
     [
@@ -385,7 +387,8 @@ export const entityTypeTranslations = new Map<EntityType | AliasEntityType, Enti
       {
         type: 'entity.type-notification-template',
         noEntities: 'notification.no-notification-templates',
-        search: 'notification.search-templates'
+        search: 'notification.search-templates',
+        selectedEntities: 'notification.selected-template'
       }
     ]
   ]

ui-ngx/src/app/shared/models/notification.models.ts

@@ -25,6 +25,7 @@ import { EntityId } from '@shared/models/id/entity-id';
 import { NotificationRuleId } from '@shared/models/id/notification-rule-id';
 import { AlarmSearchStatus, AlarmSeverity, AlarmStatus } from '@shared/models/alarm.models';
 import { EntityType } from '@shared/models/entity-type.models';
+import { User } from '@shared/models/user.model';
 
 export interface Notification {
   readonly id: NotificationId;
@@ -70,6 +71,7 @@ export interface NotificationRequestPreview {
   totalRecipientsCount: number;
   recipientsCountByTarget: { [key in string]: number };
   processedTemplates: { [key in NotificationDeliveryMethod]: DeliveryMethodNotificationTemplate };
+  recipientsPreview: Array<User>;
 }
 
 export interface NotificationRequestStats {
@@ -366,34 +368,34 @@ interface NotificationTargetConfigTypeInfo {
 export const NotificationTargetConfigTypeInfoMap = new Map<NotificationTargetConfigType, NotificationTargetConfigTypeInfo>([
   [NotificationTargetConfigType.ALL_USERS,
     {
-      name: 'notification.target-type.all-users'
+      name: 'notification.recipient-type.all-users'
     }
   ],
   [NotificationTargetConfigType.TENANT_ADMINISTRATORS,
     {
-      name: 'notification.target-type.tenant-administrators'
+      name: 'notification.recipient-type.tenant-administrators'
     }
   ],
   [NotificationTargetConfigType.CUSTOMER_USERS,
     {
-      name: 'notification.target-type.customer-users'
+      name: 'notification.recipient-type.customer-users'
     }
   ],
   [NotificationTargetConfigType.USER_LIST,
     {
-      name: 'notification.target-type.user-list'
+      name: 'notification.recipient-type.user-list'
     }
   ],
   [NotificationTargetConfigType.ORIGINATOR_ENTITY_OWNER_USERS,
     {
-      name: 'notification.target-type.users-entity-owner',
+      name: 'notification.recipient-type.users-entity-owner',
-      hint: 'notification.target-type.users-entity-owner-hint'
+      hint: 'notification.recipient-type.users-entity-owner-hint'
     }
   ],
   [NotificationTargetConfigType.AFFECTED_USER,
     {
-      name: 'notification.target-type.affected-user',
+      name: 'notification.recipient-type.affected-user',
-      hint: 'notification.target-type.affected-user-hint'
+      hint: 'notification.recipient-type.affected-user-hint'
     }
   ]
 ]);

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -2729,11 +2729,12 @@
     "notification": {
         "action-button": "Action button",
         "action-type": "Action type",
-        "add-notification-target": "Add notification recipients group",
+        "add-notification-recipients-group": "Add notification recipients group",
         "add-notification-template": "Add notification template",
+        "add-recipient": "Add recipient",
+        "add-recipients": "Add recipients",
         "add-rule": "Add rule",
         "add-stage": "Add stage",
-        "add-target": "Add recipients",
         "add-template": "Add template",
         "after": "After",
         "alarm-assignment-trigger-settings": "Alarm assignment trigger settings",
@@ -2751,22 +2752,27 @@
         "copy-rule": "Copy rule",
         "copy-template": "Copy template",
         "create-new": "Create new",
-        "create-target": "Create recipient",
         "created": "Created",
         "delete-notification-text": "Be careful, after the confirmation the notification will become unrecoverable.",
         "delete-notification-title": "Are you sure you want to delete the notification?",
-        "delete-notifications-text": "Be careful, after the confirmation the notifications will become unrecoverable.",
+        "delete-notifications-text": "Be careful, after the confirmation notifications will become unrecoverable.",
         "delete-notifications-title": "Are you sure you want to delete { count, plural, =1 {1 notification} other {# notifications} }?",
-        "delete-request-text": "Be careful, after the confirmation the notification request will become unrecoverable.",
+        "delete-recipient-text": "Be careful, after the confirmation the recipient will become unrecoverable.",
-        "delete-request-title": "Are you sure you want to delete the notification request?",
+        "delete-recipient-title": "Are you sure you want to delete recipient '{{recipientName}}'?",
-        "delete-requests-text": "Be careful, after the confirmation the notification requests will become unrecoverable.",
+        "delete-recipients-text": "Be careful, after the confirmation recipients will become unrecoverable.",
+        "delete-recipients-title": "Are you sure you want to delete { count, plural, =1 {1 recipient} other {# recipients} }?",
+        "delete-request-text": "Be careful, after the confirmation request will become unrecoverable.",
+        "delete-request-title": "Are you sure you want to delete request?",
+        "delete-requests-text": "Be careful, after the confirmation requests will become unrecoverable.",
         "delete-requests-title": "Are you sure you want to delete { count, plural, =1 {1 request} other {# requests} }?",
-        "delete-rule-text": "Be careful, after the confirmation the notification rule will become unrecoverable.",
+        "delete-rule-text": "Be careful, after the confirmation rule will become unrecoverable.",
-        "delete-rule-title": "Are you sure you want to delete the notification rule '{{ruleName}}'?",
+        "delete-rule-title": "Are you sure you want to delete rule '{{ruleName}}'?",
-        "delete-target-text": "Be careful, after the confirmation the notification recipient will become unrecoverable.",
+        "delete-rules-text": "Be careful, after the confirmation rules will become unrecoverable.",
-        "delete-target-title": "Are you sure you want to delete the notification recipient '{{targetName}}'?",
+        "delete-rules-title": "Are you sure you want to delete { count, plural, =1 {1 rule} other {# rules} }?",
-        "delete-template-text": "Be careful, after the confirmation the notification template will become unrecoverable.",
+        "delete-template-text": "Be careful, after the confirmation template will become unrecoverable.",
-        "delete-template-title": "Are you sure you want to delete the notification template '{{templateName}}'?",
+        "delete-template-title": "Are you sure you want to delete template '{{templateName}}'?",
+        "delete-templates-text": "Be careful, after the confirmation templates will become unrecoverable.",
+        "delete-templates-title": "Are you sure you want to delete { count, plural, =1 {1 template} other {# templates} }?",
         "deleted": "Deleted",
         "delivery-method": {
             "delivery-method": "Delivery method",
@@ -2788,7 +2794,7 @@
         "device-inactivity-trigger-settings": "Device inactive trigger settings",
         "device-list-rule-hint": "If the field is empty, the trigger will be applied to all devices",
         "device-profiles-list-rule-hint": "If the field is empty, the trigger will be applied to all device profiles",
-        "edit-notification-target": "Edit notification recipients group",
+        "edit-notification-recipients-group": "Edit notification recipients group",
         "edit-notification-template": "Edit notification template",
         "edit-rule": "Edit rule",
         "edit-template": "Edit template",
@@ -2814,21 +2820,22 @@
         "mark-as-read": "Mark as read",
         "message": "Message",
         "message-required": "Message is required",
+        "name": "Name",
+        "name-required": "Name is required",
         "new-notification": "New notification",
         "no-inbox-notification": "No notification found",
         "no-notification-request": "No notification request",
         "no-notification-templates": "No notification templates found",
         "no-notifications-yet": "No notifications yet",
+        "no-recipients-notification": "No recipients notification",
         "no-rule": "No rule configured",
         "no-rules-notification": "No rules notification",
         "no-severity-found": "No severity found",
         "no-severity-matching": "'{{severity}}' not found.",
-        "no-targets-notification": "No recipients notification",
         "no-template-matching": "No resource matching '{{template}}' were found.",
         "not-found-slack-recipient": "Slack recipient not found",
         "notification": "Notification",
         "notification-center": "Notification center",
-        "notification-target": "Recipient group",
         "notify": "notify",
         "notify-again": "Notify again",
         "notify-alarm-action": {
@@ -2848,9 +2855,21 @@
         "only-rule-node-lifecycle-failures": "Only rule node lifecycle failures",
         "platform-users": "Platform users",
         "recipient": "Recipient",
-        "recipient-type": "Recipient type",
+        "recipient-group": "Recipient group",
+        "recipient-type": {
+            "affected-user": "Affected user",
+            "affected-user-hint": "Affected user hint",
+            "all-users": "All users",
+            "customer-users": "Customer users",
+            "tenant-administrators": "Tenant administrators",
+            "user-filters": "User filter",
+            "user-list": "User list",
+            "users-entity-owner": "Users of the entity owner",
+            "users-entity-owner-hint": "Users of the entity owner hint"
+        },
         "recipients": "Recipients",
         "recipients-count": "{ count, plural, =1 {1 recipient} other {# recipients} }",
+        "recipients-required": "Recipients is required",
         "request-search": "Request search",
         "request-status": {
             "processing": "Processing",
@@ -2868,12 +2887,15 @@
         "rules": "Rules",
         "scheduler-later": "Schedule for later",
         "search-notification": "Search notifications",
+        "search-recipients": "Search recipients",
         "search-rules": "Search rules",
-        "search-targets": "Search recipients",
         "search-templates": "Search templates",
         "see-documentation": "See documentation",
         "selected-notifications": "{ count, plural, =1 {1 notification} other {# notifications} } selected",
+        "selected-recipients": "{ count, plural, =1 {1 recipient} other {# recipients} } selected",
         "selected-requests": "{ count, plural, =1 {1 request} other {# requests} } selected",
+        "selected-rules": "{ count, plural, =1 {1 rule} other {# rules} } selected",
+        "selected-template": "{ count, plural, =1 {1 template} other {# templates} } selected",
         "send-notification": "Send notification",
         "sent": "Sent",
         "set-entity-from-notification": "Set entity from notification to dashboard state",
@@ -2888,22 +2910,6 @@
         "stop-escalation-alarm-status-become": "Stop the escalation on the alarm status become:",
         "subject": "Subject",
         "subject-required": "Subject is required",
-        "target": "Recipient",
-        "target-name": "Name",
-        "target-name-required": "Name is required",
-        "target-type": {
-            "affected-user": "Affected user",
-            "affected-user-hint": "Affected user hint",
-            "all-users": "All users",
-            "customer-users": "Customer users",
-            "tenant-administrators": "Tenant administrators",
-            "user-filters": "User filter",
-            "user-list": "User list",
-            "users-entity-owner": "Users of the entity owner",
-            "users-entity-owner-hint": "Users of the entity owner hint"
-        },
-        "targets": "Recipients",
-        "targets-required": "Recipients is required",
         "template": "Template",
         "template-name": "Template name",
         "template-required": "Template is required",