Merge remote-tracking branch 'origin/release/v11.1.6' into release/v11.1.6

Author: mjabascal10

frontend/package.json

@@ -3,7 +3,7 @@
   "version": "7.1.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --host 0.0.0.0",
+    "start": "ng serve --host 0.0.0.0 --disable-host-check",
     "build": "ng build --prod --base-href /",
     "test": "ng test",
     "lint": "ng lint",

frontend/src/app/app-management/app-logs/app-logs.component.ts

@@ -28,7 +28,7 @@ export class AppLogsComponent implements OnInit {
     filters: [
       {field: '@timestamp', operator: ElasticOperatorsEnum.IS_BETWEEN, value: ['now-7d', 'now']},
       {field: 'log.containerName.keyword', operator: ElasticOperatorsEnum.IS, value: 'utmstack_backend'}
-    ], index: 'v11-log-utmstack-*', top: 10000000
+    ], index: 'v11-log-utmstack-*', top: 100000
   };
   sources = ['PANEL', 'AGENT'];
   types = ['ERROR', 'WARNING', 'INFO'];

frontend/src/app/data-management/alert-management/alert-full-detail/alert-full-detail.component.html

@@ -1,3 +1,12 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 0;
+  height: 100%;
+}
+
+
 .print-logo-img {
   img {
     width: 40px;
@@ -59,12 +68,23 @@ a {
   width: 1100px !important;
 }
 
-//.w-1000 {
-//  min-width: 1100px !important;
-//  width: 1100px !important;
-//  padding: 0 15px;
-//}
 
 @media print {
-  .page-break { page-break-inside: avoid; page-break-before: always; }
+  :host {
+    height: auto !important;
+    min-height: auto !important;
+  }
+
+  .overflow-auto {
+    overflow: visible !important;
+  }
+
+  .h-100 {
+    height: auto !important;
+  }
+
+  .d-flex {
+    display: block !important;
+  }
 }
+

frontend/src/app/data-management/alert-management/alert-full-detail/alert-full-detail.component.scss

@@ -1,5 +1,5 @@
 import {HttpResponse} from '@angular/common/http';
-import {Component, OnInit} from '@angular/core';
+import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
 import {DomSanitizer} from '@angular/platform-browser';
 import {ActivatedRoute, Router} from '@angular/router';
 import * as moment from 'moment';
@@ -37,6 +37,7 @@ import {AlertDetailTabEnum} from '../shared/components/alert-view-detail/alert-v
 import {AlertHistoryActionEnum} from '../shared/enums/alert-history-action.enum';
 import {EventDataTypeEnum} from '../shared/enums/event-data-type.enum';
 import {AlertTagService} from '../shared/services/alert-tag.service';
+import {finalize} from "rxjs/operators";
 
 @Component({
   selector: 'app-alert-full-detail',
@@ -100,11 +101,11 @@ export class AlertFullDetailComponent implements OnInit {
               private accountService: AccountService,
               private alertTagService: AlertTagService,
               private themeChangeBehavior: ThemeChangeBehavior,
-              private activatedRoute: ActivatedRoute) {
+              private activatedRoute: ActivatedRoute,
+              private cdr: ChangeDetectorRef) {
   }
 
   ngOnInit() {
-    this.spinner.show('alertDetail');
     this.activatedRoute.params.subscribe(params => {
       this.alertId = params.id;
       if (this.alertId) {
@@ -139,31 +140,42 @@ export class AlertFullDetailComponent implements OnInit {
 
   searchAlert() {
     this.elasticDataService.search(1, 1, 1, DataNatureTypeEnum.ALERT, this.filterAlert)
-      .subscribe(reponse => {
-        this.alert = reponse.body[0];
-        this.loadingAlert = false;
-        if (this.alert) {
-          this.logs = this.alert.logs;
+      .pipe(finalize(() => this.loadingAlert = false))
+      .subscribe({
+        next: response => {
+          this.alert = response.body[0];
+
+          if (!this.alert) {
+            this.noAlertFound = true;
+            return;
+          }
+
+          this.logs = this.alert.events || [];
+          this.log = this.alert.lastEvent || null;
           this.countRelatedEvents = this.logs.length;
+
           const ref = this.alert.reference;
-          this.reference = (ref && typeof ref !== 'string') ? ref : [];
+          this.reference = Array.isArray(ref) ? ref : [];
+
           this.relatedTagsRules = this.alert.tagRulesApplied;
+
           this.filterEvent = [{
             field: 'id',
             operator: ElasticOperatorsEnum.IS_ONE_OF,
-            value: this.alert.logs.reverse().slice(0, 100)
+            value: [...this.alert.events].reverse().slice(0, 100)
           }];
-          this.resolveDataType().then(type => {
-            this.dataType = type;
-          });
-          this.searchLastLog();
+
+          this.resolveDataType().then(type => this.dataType = type);
+
           this.searchEventByAlert();
-        } else {
-          this.noAlertFound = true;
+        },
+        error: () => {
+          this.spinner.hide('alertDetail');
         }
       });
   }
 
+
   resolveDataType(): Promise<EventDataTypeEnum> {
     return new Promise<EventDataTypeEnum>(resolve => {
       resolve(EventDataTypeEnum.ALERT);
@@ -172,13 +184,19 @@ export class AlertFullDetailComponent implements OnInit {
 
   searchEventByAlert() {
     this.elasticDataService.search(1, 100, 100, DataNatureTypeEnum.EVENT, this.filterEvent)
-      .subscribe(reponse => {
-        this.rows = reponse.body;
-        this.loadingEvents = false;
-        this.spinner.hide('alertDetail');
+      .pipe(finalize(() => this.spinner.hide('alertDetail')))
+      .subscribe({
+        next: response => {
+          this.rows = response.body;
+          this.loadingEvents = false;
+        },
+        error: () => {
+          this.loadingEvents = false;
+        }
       });
   }
 
+
   print() {
     this.printFormat = true;
     setTimeout(() => {
@@ -245,7 +263,7 @@ export class AlertFullDetailComponent implements OnInit {
       this.elasticDataService.search(1, 1,
         1, LOG_INDEX_PATTERN, filter).subscribe(
         (res: HttpResponse<any>) => {
-          this.log = res.body[0];
+          this.log = res.body[0] || null;
           this.getLastLog = false;
         },
         (res: HttpResponse<any>) => {

frontend/src/app/data-management/alert-management/alert-full-detail/alert-full-detail.component.ts

@@ -154,7 +154,8 @@ <h5 class="card-title mb-0 text-uppercase label-header">
                               [pageSize]="itemsPerPage"
                               [rotate]="true"
                               [size]="'sm'"></ngb-pagination>
-              <app-utm-items-per-page (itemsInPage)="onItemsPerPageChange($event)"
+              <app-utm-items-per-page [itemsAmount]="itemsPerPage"
+                                      (itemsInPage)="onItemsPerPageChange($event)"
                                       class="ml-3">
               </app-utm-items-per-page>
             </div>

frontend/src/app/data-management/alert-management/alert-view/alert-view.component.html

@@ -104,7 +104,7 @@ export class AlertViewComponent implements OnInit, OnDestroy {
   viewAlertDetail: boolean;
   totalItems: any;
   page = 1;
-  itemsPerPage = ITEMS_PER_PAGE;
+  itemsPerPage = ITEMS_PER_PAGE * 4;
   filters: ElasticFilterType[] = [
     {field: ALERT_STATUS_FIELD_AUTO, operator: ElasticOperatorsEnum.IS_NOT, value: AUTOMATIC_REVIEW},
     {field: ALERT_TAGS_FIELD, operator: ElasticOperatorsEnum.IS_NOT, value: FALSE_POSITIVE_OBJECT.tagName},

frontend/src/app/data-management/alert-management/alert-view/alert-view.component.ts

@@ -45,7 +45,7 @@
                   <i (click)="activeRule(rule)"
                      class="cursor-pointer ml-2"
                      [ngClass]="{'icon-blocked': rule.ruleActive, 'icon-check2': !rule.ruleActive}"
-                     ngbTooltip="{{ !rule.ruleActive ? 'Active' : 'Deactivate' }}"
+                     ngbTooltip="{{ !rule.ruleActive ? 'Activate' : 'Deactivate' }}"
                      container="body"
                      *ngIf="!loadingRules.includes(rule.id);else spinner"
                      placement="left"></i>

frontend/src/app/rule-management/app-rule/components/rule-list/rule-list.component.html

@@ -154,9 +154,9 @@ export class RuleListComponent implements OnInit, OnDestroy {
     };
     this.loadingRules.push(rule.id);
     const index = this.loadingRules.length - 1;
-    this.ruleService.activeRule(params).pipe(
-      finalize(() => this.loadingRules.splice(index, 1))
-    )
+    this.ruleService.activeRule(params)
+      .pipe(
+        finalize(() => this.loadingRules.splice(index, 1)))
       .subscribe(() => this.ruleService.notifyRefresh(true),
         () => {
           this.utmToast.showError('Error', 'Error changing rule status');

frontend/src/app/rule-management/app-rule/components/rule-list/rule-list.component.ts

@@ -32,6 +32,7 @@ export class UtmAlertType {
   hasChildren: boolean;
   expanded: boolean;
   echoes: number;
+  lastEvent: any;
 }
 
 export enum AlertStatusLabelEnum {