Fixed see debug event and change color alarm severity for alarm table (#14666)

* UI: Fixed see debug event
* UI: Fixed alarm colors

---------

Co-authored-by: ArtemDzhereleiko <adzhereleiko@thingsboard.io>

ui-ngx/src/app/modules/home/components/alarm-rules/alarm-rules-table-config.ts

@@ -75,7 +75,7 @@ export class AlarmRulesTableConfig extends EntityTableConfig<AlarmRuleTableEntit
   readonly tenantId = getCurrentAuthUser(this.store).tenantId;
   additionalDebugActionConfig = {
     title: this.translate.instant('action.see-debug-events'),
-    action: (calculatedField: AlarmRuleTableEntity) => this.openDebugEventsDialog.call(this, calculatedField),
+    action: (calculatedField: AlarmRuleTableEntity) => this.openDebugEventsDialog.call(this, null, calculatedField),
   };
 
   alarmRuleFilterConfig: CalculatedFieldsQuery;

ui-ngx/src/app/modules/home/components/alarm-rules/create-cf-alarm-rules.component.ts

@@ -27,10 +27,9 @@ import {
   Validator,
   Validators
 } from '@angular/forms';
-import { AlarmSeverity, alarmSeverityTranslations } from '@shared/models/alarm.models';
+import { AlarmSeverity, alarmSeverityColors, alarmSeverityTranslations } from '@shared/models/alarm.models';
 import { AlarmRule } from "@shared/models/alarm-rule.models";
 import { CalculatedFieldArgument } from "@shared/models/calculated-field.models";
-import { AlarmSeverityNotificationColors } from "@shared/models/notification.models";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
 import { coerceBoolean } from "@shared/decorators/coercion";
 import { Observable } from "rxjs";
@@ -68,7 +67,7 @@ export class CreateCfAlarmRulesComponent implements ControlValueAccessor, Valida
   alarmSeverityEnum = AlarmSeverity;
   alarmSeverityTranslationMap = alarmSeverityTranslations;
 
-  AlarmSeverityNotificationColors = AlarmSeverityNotificationColors;
+  AlarmSeverityNotificationColors = alarmSeverityColors;
 
   createAlarmRulesFormGroup = this.fb.group({
     createAlarmRules: this.fb.array<{severity: AlarmSeverity, alarmRule: AlarmRule}>([])

ui-ngx/src/app/shared/components/notification/notification.component.ts

@@ -17,7 +17,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import {
   ActionButtonLinkType,
-  AlarmSeverityNotificationColors,
   Notification,
   NotificationStatus,
   NotificationType,
@@ -25,7 +24,7 @@ import {
 } from '@shared/models/notification.models';
 import { UtilsService } from '@core/services/utils.service';
 import { Router } from '@angular/router';
-import { alarmSeverityTranslations } from '@shared/models/alarm.models';
+import { alarmSeverityColors, alarmSeverityTranslations } from '@shared/models/alarm.models';
 import tinycolor from 'tinycolor2';
 import { StateObject } from '@core/api/widget-api.models';
 import { objToBase64URI } from '@core/utils';
@@ -135,12 +134,12 @@ export class NotificationComponent implements OnInit {
   }
 
   alarmColorSeverity(alpha: number) {
-    return tinycolor(AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity)).setAlpha(alpha).toRgbString();
+    return tinycolor(alarmSeverityColors.get(this.notification.info.alarmSeverity)).setAlpha(alpha).toRgbString();
   }
 
   notificationColor(): string {
     if (this.notification.type === NotificationType.ALARM && !this.notification.info.cleared) {
-      return AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity);
+      return alarmSeverityColors.get(this.notification.info.alarmSeverity);
     }
     return 'transparent';
   }
@@ -154,7 +153,7 @@ export class NotificationComponent implements OnInit {
 
   notificationIconColor(): object {
     if (this.notification.type === NotificationType.ALARM) {
-      return {color: AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity)};
+      return {color: alarmSeverityColors.get(this.notification.info.alarmSeverity)};
     } else if (this.notification.type === NotificationType.RULE_ENGINE_COMPONENT_LIFECYCLE_EVENT) {
       return {color: '#D12730'};
     } else if (this.notification.type === NotificationType.ENTITIES_LIMIT_INCREASE_REQUEST) {

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

@@ -88,11 +88,11 @@ export const alarmSearchStatusTranslations = new Map<AlarmSearchStatus, string>(
 
 export const alarmSeverityColors = new Map<AlarmSeverity, string>(
   [
-    [AlarmSeverity.CRITICAL, 'red'],
+    [AlarmSeverity.CRITICAL, '#D12730'],
-    [AlarmSeverity.MAJOR, 'orange'],
+    [AlarmSeverity.MAJOR, '#FEAC0C'],
-    [AlarmSeverity.MINOR, '#ffca3d'],
+    [AlarmSeverity.MINOR, '#F2DA05'],
-    [AlarmSeverity.WARNING, '#abab00'],
+    [AlarmSeverity.WARNING, '#F66716'],
-    [AlarmSeverity.INDETERMINATE, 'green']
+    [AlarmSeverity.INDETERMINATE, '#00000061']
   ]
 );
 

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

@@ -551,16 +551,6 @@ export const NotificationTypeIcons = new Map<NotificationType, string | null>([
   [NotificationType.RESOURCES_SHORTAGE, 'warning']
 ]);
 
-export const AlarmSeverityNotificationColors = new Map<AlarmSeverity, string>(
-  [
-    [AlarmSeverity.CRITICAL, '#D12730'],
-    [AlarmSeverity.MAJOR, '#FEAC0C'],
-    [AlarmSeverity.MINOR, '#F2DA05'],
-    [AlarmSeverity.WARNING, '#F66716'],
-    [AlarmSeverity.INDETERMINATE, '#00000061']
-  ]
-);
-
 export enum ActionButtonLinkType {
   LINK = 'LINK',
   DASHBOARD  = 'DASHBOARD'