UI: Hide alarm style in notification when alarm cleared

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

@@ -41,7 +41,7 @@
             matTooltip="{{ 'notification.mark-as-read' | translate }}" matTooltipPosition="above">
       <mat-icon>check_circle_outline</mat-icon>
     </button>
-    <div class="alarm-severity" *ngIf="notification.type === notificationType.ALARM"
+    <div class="alarm-severity" *ngIf="notification.type === notificationType.ALARM && !notification.info.cleared"
          [ngStyle]="{backgroundColor: alarmColorSeverity(0.06)}">
       <span [ngStyle]="notificationIconColor()" class="severity">
         {{alarmSeverityTranslations.get(notification.info.alarmSeverity) | translate}}

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

@@ -139,7 +139,7 @@ export class NotificationComponent implements OnInit {
   }
 
   notificationColor(): string {
-    if (this.notification.type === NotificationType.ALARM) {
+    if (this.notification.type === NotificationType.ALARM && !this.notification.info.cleared) {
       return AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity);
     }
     return 'transparent';

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

@@ -48,6 +48,8 @@ export interface NotificationInfo {
   alarmStatus?: AlarmStatus;
   alarmType?: string;
   stateEntityId?: EntityId;
+  acknowledged?: boolean;
+  cleared?: boolean;
 }
 
 export interface NotificationRequest extends Omit<BaseData<NotificationRequestId>, 'label'> {