From dd0cd79fa4a98a61fc652f1bb2d46f3d12d50c2b Mon Sep 17 00:00:00 2001
From: rusikv <rvasylkiv@thingsboard.io>
Date: Wed, 11 Oct 2023 18:56:24 +0300
Subject: [PATCH] UI: improved usability of alarm additional info

---
 .../components/profile/alarm/alarm-rule.component.html    | 2 +-
 .../alarm/edit-alarm-details-dialog.component.html        | 8 ++++----
 ui-ngx/src/assets/locale/locale.constant-ca_ES.json       | 8 ++++----
 ui-ngx/src/assets/locale/locale.constant-cs_CZ.json       | 6 +++---
 ui-ngx/src/assets/locale/locale.constant-da_DK.json       | 6 +++---
 ui-ngx/src/assets/locale/locale.constant-en_US.json       | 8 ++++----
 ui-ngx/src/assets/locale/locale.constant-es_ES.json       | 7 ++++---
 ui-ngx/src/assets/locale/locale.constant-ko_KR.json       | 6 +++---
 ui-ngx/src/assets/locale/locale.constant-sl_SI.json       | 6 +++---
 ui-ngx/src/assets/locale/locale.constant-tr_TR.json       | 6 +++---
 ui-ngx/src/assets/locale/locale.constant-zh_CN.json       | 8 ++++----
 ui-ngx/src/assets/locale/locale.constant-zh_TW.json       | 8 ++++----
 12 files changed, 40 insertions(+), 39 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/profile/alarm/alarm-rule.component.html b/ui-ngx/src/app/modules/home/components/profile/alarm/alarm-rule.component.html
index 5e7ca9b096..134651a1fd 100644
--- a/ui-ngx/src/app/modules/home/components/profile/alarm/alarm-rule.component.html
+++ b/ui-ngx/src/app/modules/home/components/profile/alarm/alarm-rule.component.html
@@ -22,7 +22,7 @@
   </tb-alarm-schedule-info>
   <div *ngIf="!disabled || alarmRuleFormGroup.get('alarmDetails').value" fxLayout="row" fxLayoutAlign="start center">
     <span class="tb-alarm-rule-details title" (click)="openEditDetailsDialog($event)">
-      {{ alarmRuleFormGroup.get('alarmDetails').value ? ('device-profile.alarm-rule-details' | translate) + ': '  : ('device-profile.add-alarm-rule-details' | translate) }}
+      {{ ('device-profile.alarm-rule-additional-info' | translate) + ': ' }}
     </span>
     <span *ngIf="alarmRuleFormGroup.get('alarmDetails').value" class="tb-alarm-rule-details"
           (click)="openEditDetailsDialog($event)"
diff --git a/ui-ngx/src/app/modules/home/components/profile/alarm/edit-alarm-details-dialog.component.html b/ui-ngx/src/app/modules/home/components/profile/alarm/edit-alarm-details-dialog.component.html
index 566f99eb1a..046f3fc2c4 100644
--- a/ui-ngx/src/app/modules/home/components/profile/alarm/edit-alarm-details-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/profile/alarm/edit-alarm-details-dialog.component.html
@@ -17,7 +17,7 @@
 -->
 <form [formGroup]="editDetailsFormGroup" (ngSubmit)="save()" style="width: 800px;">
   <mat-toolbar color="primary">
-    <h2>{{ 'device-profile.alarm-rule-details' | translate }}</h2>
+    <h2>{{ 'device-profile.edit-alarm-rule-additional-info' | translate }}</h2>
     <span fxFlex></span>
     <button mat-icon-button
             (click)="cancel()"
@@ -31,9 +31,9 @@
     <fieldset [disabled]="isLoading$ | async">
       <div fxFlex fxLayout="column">
         <mat-form-field class="mat-block">
-          <mat-label translate>device-profile.alarm-details</mat-label>
-          <textarea matInput formControlName="alarmDetails" rows="5"></textarea>
-          <mat-hint [innerHTML]="'device-profile.alarm-rule-details-hint' | translate | safe: 'html'"></mat-hint>
+          <textarea matInput formControlName="alarmDetails" rows="5"
+            placeholder="{{ 'device-profile.alarm-rule-additional-info-placeholder' | translate }}"></textarea>
+          <mat-hint [innerHTML]="'device-profile.alarm-rule-additional-info-hint' | translate | safe: 'html'"></mat-hint>
         </mat-form-field>
       </div>
     </fieldset>
diff --git a/ui-ngx/src/assets/locale/locale.constant-ca_ES.json b/ui-ngx/src/assets/locale/locale.constant-ca_ES.json
index 0b7b09d15b..71d2d45224 100644
--- a/ui-ngx/src/assets/locale/locale.constant-ca_ES.json
+++ b/ui-ngx/src/assets/locale/locale.constant-ca_ES.json
@@ -1507,9 +1507,10 @@
         "condition-duration-value-required": "Cal valor de duració.",
         "condition-duration-time-unit-required": "Cal una unidad del temps.",
         "advanced-settings": "Configuració avançada",
-        "alarm-rule-details": "Detalls",
-        "alarm-rule-details-hint": "Suggeriment: utilitzeu <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</ span></code> per substituir els valors de les claus d'atribut o de telemetria que s'utilitzen en condicions de regla d'alarma.",
-        "add-alarm-rule-details": "Afegir detalls",
+        "alarm-rule-additional-info": "Información adicional",
+        "edit-alarm-rule-additional-info": "Editar información adicional",
+        "alarm-rule-additional-info-placeholder": "Proporcione sus comentarios y ajustes aquí para mostrarlos en Detalles de alarma en Información adicional",
+        "alarm-rule-additional-info-hint": "Suggeriment: utilitzeu <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</ span></code> per substituir els valors de les claus d'atribut o de telemetria que s'utilitzen en condicions de regla d'alarma.",
         "alarm-rule-mobile-dashboard": "Tauler de control mòbil",
         "alarm-rule-mobile-dashboard-hint": "Utilitzat per l'aplicació mòbil com a quadre de comandament de detalls d'alarma",
         "alarm-rule-no-mobile-dashboard": "No s'ha seleccionat cap tauler",
@@ -1519,7 +1520,6 @@
         "propagate-alarm-to-owner": "Propaga l'alarma al propietari de l'entitat (Customer or Tenant)",
         "propagate-alarm-to-owner-hierarchy": "Propaga l'alarma a la jerarquia dels propietaris de l'entitat",
         "propagate-alarm-to-tenant": "Propaga l'alarma al llogater",
-        "alarm-details": "Detalls d'alarma",
         "alarm-rule-condition": "Condicions de regla d'alarma",
         "enter-alarm-rule-condition-prompt": "Per favor, afegir una condició d'alarma",
         "edit-alarm-rule-condition": "Editar condició d'alarma",
diff --git a/ui-ngx/src/assets/locale/locale.constant-cs_CZ.json b/ui-ngx/src/assets/locale/locale.constant-cs_CZ.json
index c82ba68649..50b105381f 100644
--- a/ui-ngx/src/assets/locale/locale.constant-cs_CZ.json
+++ b/ui-ngx/src/assets/locale/locale.constant-cs_CZ.json
@@ -1143,15 +1143,15 @@
         "condition-duration-value-required": "Doba trvání je povinná.",
         "condition-duration-time-unit-required": "Jednotka času je povinná.",
         "advanced-settings": "Pokročilá nastavení",
-        "alarm-rule-details": "Detail",
-        "add-alarm-rule-details": "Přidat detail",
+        "alarm-rule-additional-info": "Doplňující informace",
+        "edit-alarm-rule-additional-info": "Upravit další informace",
+        "alarm-rule-additional-info-placeholder": "Zde uveďte své komentáře a úpravy, aby se zobrazily v detailech alarmu v části Další informace",
         "alarm-rule-mobile-dashboard": "Mobilní dashboard",
         "alarm-rule-mobile-dashboard-hint": "Používán mobilní aplikací jako dashboard detailu alarmu",
         "alarm-rule-no-mobile-dashboard": "Žádný dashboard nebyl vybrán",
         "propagate-alarm": "Propagovat alarm",
         "alarm-rule-relation-types-list": "Typy vztahů ke zpropagování",
         "alarm-rule-relation-types-list-hint": "Pokud nejsou vybrány žádné typy vztahů, alarmy budou propagovány bez filtru typu vztahu.",
-        "alarm-details": "Detail alarmu",
         "alarm-rule-condition": "Podmínka pravidla alarmu",
         "enter-alarm-rule-condition-prompt": "Přidejte prosím podmínku pravidla alarmu",
         "edit-alarm-rule-condition": "Editovat podmínku pravidla alarmu",
diff --git a/ui-ngx/src/assets/locale/locale.constant-da_DK.json b/ui-ngx/src/assets/locale/locale.constant-da_DK.json
index 834cc15619..3fdaa613e9 100644
--- a/ui-ngx/src/assets/locale/locale.constant-da_DK.json
+++ b/ui-ngx/src/assets/locale/locale.constant-da_DK.json
@@ -1197,12 +1197,12 @@
     "condition-duration-value-required": "Varighedsværdi er påkrævet.",
     "condition-duration-time-unit-required": "Tidsenhed er påkrævet.",
     "advanced-settings": "Avancerede indstillinger",
-    "alarm-rule-details": "Oplysninger",
-    "add-alarm-rule-details": "Tilføj oplysninger",
+    "alarm-rule-additional-info": "Yderligere information",
+    "edit-alarm-rule-additional-info": "Rediger yderligere oplysninger",
+    "alarm-rule-additional-info-placeholder": "Angiv venligst dine kommentarer og justeringer her for at vise dem i Alarmdetaljer under Yderligere info",
     "propagate-alarm": "Overfør alarm",
     "alarm-rule-relation-types-list": "Relationstyper, der skal overføres",
     "alarm-rule-relation-types-list-hint": "Hvis der ikke vælges Overfør relationstyper vil alarmer blive overført uden filtrering på relationstype.",
-    "alarm-details": "Alarmoplysninger",
     "alarm-rule-condition": "Alarmregelbetingelse",
     "enter-alarm-rule-condition-prompt": "Tilføj alarmregelbetingelse",
     "edit-alarm-rule-condition": "Rediger alarmregelbetingelse",
diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json
index 0fdf48d12c..79c6deb28b 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -1622,9 +1622,10 @@
         "condition-duration-value-required": "Duration value is required.",
         "condition-duration-time-unit-required": "Time unit is required.",
         "advanced-settings": "Advanced settings",
-        "alarm-rule-details": "Details",
-        "alarm-rule-details-hint": "Hint: use <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code> to substitute values of the attribute or telemetry keys that are used in alarm rule condition.",
-        "add-alarm-rule-details": "Add details",
+        "alarm-rule-additional-info": "Additional info",
+        "edit-alarm-rule-additional-info": "Edit additional info",
+        "alarm-rule-additional-info-placeholder": "Please provide your comments and adjustments here to display them within Alarm details under Additional info",
+        "alarm-rule-additional-info-hint": "Hint: use <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code> to substitute values of the attribute or telemetry keys that are used in alarm rule condition.",
         "alarm-rule-mobile-dashboard": "Mobile dashboard",
         "alarm-rule-mobile-dashboard-hint": "Used by mobile application as an alarm details dashboard",
         "alarm-rule-no-mobile-dashboard": "No dashboard selected",
@@ -1633,7 +1634,6 @@
         "alarm-rule-relation-types-list-hint": "If Propagate relation types are not selected, alarms will be propagated without filtering by relation type.",
         "propagate-alarm-to-owner": "Propagate alarm to entity owner (Customer or Tenant)",
         "propagate-alarm-to-tenant": "Propagate alarm to Tenant",
-        "alarm-details": "Alarm details",
         "alarm-rule-condition": "Alarm rule condition",
         "enter-alarm-rule-condition-prompt": "Please add alarm rule condition",
         "edit-alarm-rule-condition": "Edit alarm rule condition",
diff --git a/ui-ngx/src/assets/locale/locale.constant-es_ES.json b/ui-ngx/src/assets/locale/locale.constant-es_ES.json
index 143bed648b..7ebb27d63a 100644
--- a/ui-ngx/src/assets/locale/locale.constant-es_ES.json
+++ b/ui-ngx/src/assets/locale/locale.constant-es_ES.json
@@ -1509,9 +1509,11 @@
         "condition-duration-value-required": "Se requiere valor de duración.",
         "condition-duration-time-unit-required": "Se requiere una unidad de tiempo.",
         "advanced-settings": "Ajustes avanzados",
-        "alarm-rule-details": "Detalles",
+        "alarm-rule-additional-info": "Informació addicional",
+        "edit-alarm-rule-additional-info": "Editeu informació addicional",
+        "alarm-rule-additional-info-placeholder": "Si us plau, proporcioneu els vostres comentaris i ajustos aquí per mostrar-los a Detalls d'alarma a Informació addicional",
         "alarm-rule-details-hint": "Ayuda: usa <code><span style=\"color: #000;\">$&#123;</span>nombredeClave<span style=\"color: #000;\">&#125;</span></code> para sustituir los valores de atributos o telemetrías usadas en la condición de la regla de alarma.",
-        "add-alarm-rule-details": "Añadir detalles",
+        "add-alarm-rule-additional-info": "Añadir detalles",
         "alarm-rule-mobile-dashboard": "Panel Móvil",
         "alarm-rule-mobile-dashboard-hint": "Usado por la aplicación móvil como panel de detalle de alarmas",
         "alarm-rule-no-mobile-dashboard": "No hay panel seleccionado",
@@ -1520,7 +1522,6 @@
         "alarm-rule-relation-types-list-hint": "Si no está seleccionado 'propagar relaciones', las alarmas serán propagadas sin filtrar por relación.",
         "propagate-alarm-to-owner": "Propagar alarma al propietario de la entidad (Cliente o Administrador)",
         "propagate-alarm-to-tenant": "Propagar alarma a Administrador",
-        "alarm-details": "Detalles de alarma",
         "alarm-rule-condition": "Condiciones de regla de alarma",
         "enter-alarm-rule-condition-prompt": "Por favor, añade una condición de alarma",
         "edit-alarm-rule-condition": "Editar condición de alarma",
diff --git a/ui-ngx/src/assets/locale/locale.constant-ko_KR.json b/ui-ngx/src/assets/locale/locale.constant-ko_KR.json
index aad25e9c0e..8a46e39466 100644
--- a/ui-ngx/src/assets/locale/locale.constant-ko_KR.json
+++ b/ui-ngx/src/assets/locale/locale.constant-ko_KR.json
@@ -1010,12 +1010,12 @@
         "condition-duration-value-required": "Duration value is required.",
         "condition-duration-time-unit-required": "Time unit is required.",
         "advanced-settings": "Advanced settings",
-        "alarm-rule-details": "Details",
-        "add-alarm-rule-details": "Add details",
+        "alarm-rule-additional-info": "추가 정보",
+        "edit-alarm-rule-additional-info": "추가 정보 수정",
+        "alarm-rule-additional-info-placeholder": "추가 정보 아래의 경보 세부정보에 표시하려면 여기에 의견과 조정 사항을 입력하세요.",
         "propagate-alarm": "Propagate alarm",
         "alarm-rule-relation-types-list": "Relation types to propagate",
         "alarm-rule-relation-types-list-hint": "If Propagate relation types are not selected, alarms will be propagated without filtering by relation type.",
-        "alarm-details": "Alarm details",
         "alarm-rule-condition": "Alarm rule condition",
         "enter-alarm-rule-condition-prompt": "Please add alarm rule condition",
         "edit-alarm-rule-condition": "Edit alarm rule condition",
diff --git a/ui-ngx/src/assets/locale/locale.constant-sl_SI.json b/ui-ngx/src/assets/locale/locale.constant-sl_SI.json
index c6a20b9a36..d1ea6a188e 100644
--- a/ui-ngx/src/assets/locale/locale.constant-sl_SI.json
+++ b/ui-ngx/src/assets/locale/locale.constant-sl_SI.json
@@ -1010,12 +1010,12 @@
     "condition-duration-value-required": "Duration value is required.",
     "condition-duration-time-unit-required": "Time unit is required.",
     "advanced-settings": "Advanced settings",
-    "alarm-rule-details": "Details",
-    "add-alarm-rule-details": "Add details",
+    "alarm-rule-additional-info": "Dodatne informacije",
+    "edit-alarm-rule-additional-info": "Uredi dodatne informacije",
+    "alarm-rule-additional-info-placeholder": "Tukaj navedite svoje komentarje in prilagoditve, da jih prikažete v podrobnostih alarma pod dodatnimi informacijami",
     "propagate-alarm": "Propagate alarm",
     "alarm-rule-relation-types-list": "Relation types to propagate",
     "alarm-rule-relation-types-list-hint": "If Propagate relation types are not selected, alarms will be propagated without filtering by relation type.",
-    "alarm-details": "Alarm details",
     "alarm-rule-condition": "Alarm rule condition",
     "enter-alarm-rule-condition-prompt": "Please add alarm rule condition",
     "edit-alarm-rule-condition": "Edit alarm rule condition",
diff --git a/ui-ngx/src/assets/locale/locale.constant-tr_TR.json b/ui-ngx/src/assets/locale/locale.constant-tr_TR.json
index b377c9fd45..4c62b2ffa6 100644
--- a/ui-ngx/src/assets/locale/locale.constant-tr_TR.json
+++ b/ui-ngx/src/assets/locale/locale.constant-tr_TR.json
@@ -1146,15 +1146,15 @@
     "condition-duration-value-required": "Süre değeri gerekli.",
     "condition-duration-time-unit-required": "Zaman birimi gerekli.",
     "advanced-settings": "Gelişmiş ayarlar",
-    "alarm-rule-details": "Detaylar",
-    "add-alarm-rule-details": "Detay ekle",
+    "alarm-rule-additional-info": "Ilave bilgi",
+    "edit-alarm-rule-additional-info": "Ek bilgileri düzenle",
+    "alarm-rule-additional-info-placeholder": "Lütfen yorumlarınızı ve ayarlamalarınızı Ek bilgiler altındaki Alarm ayrıntılarında görüntülemek için buraya girin.",
     "alarm-rule-mobile-dashboard": "Mobil gösterge paneli",
     "alarm-rule-mobile-dashboard-hint": "Mobil uygulama tarafından alarm ayrıntıları gösterge paneli olarak kullanılır",
     "alarm-rule-no-mobile-dashboard": "Gösterge paneli seçilmedi",
     "propagate-alarm": "Alarmı yay",
     "alarm-rule-relation-types-list": "Yayılacak ilişki türleri",
     "alarm-rule-relation-types-list-hint": "Yayma ilişki türleri seçilmezse, alarmlar ilişki türüne göre filtreleme yapılmadan yayılır.",
-    "alarm-details": "Alarm ayrıntıları",
     "alarm-rule-condition": "Alarm kuralı koşulu",
     "enter-alarm-rule-condition-prompt": "Lütfen alarm kuralı koşulu ekleyin",
     "edit-alarm-rule-condition": "Alarm kuralı koşulunu düzenle",
diff --git a/ui-ngx/src/assets/locale/locale.constant-zh_CN.json b/ui-ngx/src/assets/locale/locale.constant-zh_CN.json
index 895499e067..0554f90d5b 100644
--- a/ui-ngx/src/assets/locale/locale.constant-zh_CN.json
+++ b/ui-ngx/src/assets/locale/locale.constant-zh_CN.json
@@ -1511,9 +1511,10 @@
         "condition-duration-value-required": "持续时间值必填。",
         "condition-duration-time-unit-required": "时间单位必填。",
         "advanced-settings": "高级设置",
-        "alarm-rule-details": "详情",
-        "alarm-rule-details-hint": "提示: 使用 <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code> 来替代告警规则条件中使用的属性或遥测键的值。",
-        "add-alarm-rule-details": "详情模板：",
+        "alarm-rule-additional-info": "附加信息",
+        "edit-alarm-rule-additional-info": "编辑附加信息",
+        "alarm-rule-additional-info-placeholder": "请在此处提供您的意见和调整，以便将其显示在“附加信息”下的“警报详细信息”中",
+        "alarm-rule-additional-info-hint": "提示: 使用 <code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code> 来替代告警规则条件中使用的属性或遥测键的值。",
         "alarm-rule-mobile-dashboard": "移动端仪表板",
         "alarm-rule-mobile-dashboard-hint": "作为移动端告警详情仪表板使用。",
         "alarm-rule-no-mobile-dashboard": "未选择仪表板。",
@@ -1522,7 +1523,6 @@
         "alarm-rule-relation-types-list-hint": "如果未选择传递关联类型，则将不按关联类型过滤而传递告警。",
         "propagate-alarm-to-owner": "将告警传播给实体所有者（客户或租户）。",
         "propagate-alarm-to-tenant": "将告警传播给租户",
-        "alarm-details": "告警详细信息",
         "alarm-rule-condition": "告警规则条件",
         "enter-alarm-rule-condition-prompt": "请添加告警规则条件",
         "edit-alarm-rule-condition": "编辑告警规则条件",
diff --git a/ui-ngx/src/assets/locale/locale.constant-zh_TW.json b/ui-ngx/src/assets/locale/locale.constant-zh_TW.json
index bb655f65e7..d5b28afc32 100644
--- a/ui-ngx/src/assets/locale/locale.constant-zh_TW.json
+++ b/ui-ngx/src/assets/locale/locale.constant-zh_TW.json
@@ -1308,9 +1308,10 @@
         "condition-duration-value-required": "需要持續時間值。",
         "condition-duration-time-unit-required": "需要時間單位。",
         "advanced-settings": "進階設定",
-        "alarm-rule-details": "詳細資訊",
-        "alarm-rule-details-hint": "提示：使用<code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code>替換警告規則條件中使用的屬性或遙測鍵的值。",
-        "add-alarm-rule-details": "增加詳細資訊",
+        "alarm-rule-additional-info": "附加資訊",
+        "edit-alarm-rule-additional-info": "編輯附加資訊",
+        "alarm-rule-additional-info-placeholder": "請在此處提供您的評論和調整，以便在附加資訊下的警報詳細資訊中顯示它們。",
+        "alarm-rule-additional-info-hint": "提示：使用<code><span style=\"color: #000;\">$&#123;</span>keyName<span style=\"color: #000;\">&#125;</span></code>替換警告規則條件中使用的屬性或遙測鍵的值。",
         "alarm-rule-mobile-dashboard": "移動儀表板",
         "alarm-rule-mobile-dashboard-hint": "由移動應用程序用作警告詳情儀表板",
         "alarm-rule-no-mobile-dashboard": "未選擇儀表板",
@@ -1319,7 +1320,6 @@
         "alarm-rule-relation-types-list-hint": "如果未選擇傳播關聯類型，則將在不按關聯類型過濾的情況下傳播警告。",
         "propagate-alarm-to-owner": "傳播警告給相關實體擁有者",
         "propagate-alarm-to-tenant": "傳播警告給租戶",
-        "alarm-details": "警告詳細資料",
         "alarm-rule-condition": "警告規則條件",
         "enter-alarm-rule-condition-prompt": "請新增警告規則條件",
         "edit-alarm-rule-condition": "編輯警告規則條件",