feat(ui): add filters on monitoring status page (#5456)

* feat(ui): add filters on monitoring status page Signed-off-by: Yvonnick Esnault <[email protected]>
ovh · Sep 30, 2020 · e6f0eb1 · e6f0eb1
1 parent 234d775
commit e6f0eb1
Show file tree

Hide file tree

Showing 13 changed files with 232 additions and 197 deletions.
diff --git a/engine/api/api.go b/engine/api/api.go
@@ -630,9 +630,6 @@ func (a *API) Serve(ctx context.Context) error {
 		go event.DequeueEvent(ctx, a.mustDB())
 	}
 
-	// here the generated name of API is ready, we set ServerName with that
-	a.Common.ServiceName = event.GetCDSName()
-
 	log.Info(ctx, "Initializing internal routines...")
 	a.GoRoutines.Run(ctx, "maintenance.Subscribe", func(ctx context.Context) {
 		if err := a.listenMaintenance(ctx); err != nil {

diff --git a/engine/api/status.go b/engine/api/status.go
@@ -33,6 +33,7 @@ func VersionHandler() service.Handler {
 // Status returns status, implements interface service.Service
 func (api *API) Status(ctx context.Context) *sdk.MonitoringStatus {
 	m := api.NewMonitoringStatus()
+	m.ServiceName = event.GetCDSName()
 
 	m.AddLine(sdk.MonitoringStatusLine{Component: "Hostname", Value: event.GetHostname(), Status: sdk.MonitoringStatusOK})
 	m.AddLine(sdk.MonitoringStatusLine{Component: "CDSName", Value: api.Name(), Status: sdk.MonitoringStatusOK})
@@ -126,21 +127,19 @@ func (api *API) computeGlobalStatus(srvs []sdk.Service) sdk.MonitoringStatus {
 					})
 				}
 			}
-
-			if strings.Contains(l.Component, "CDSName") {
-				t := resume[s.Type]
-				t.nbOK += nbOK
-				t.nbWarn += nbWarn
-				t.nbAlerts += nbAlert
-				t.nbSrv++
-				resume[s.Type] = t
-
-				nbg.nbOK += nbOK
-				nbg.nbWarn += nbWarn
-				nbg.nbAlerts += nbAlert
-				nbg.nbSrv++
-			}
 		}
+
+		t := resume[s.Type]
+		t.nbOK += nbOK
+		t.nbWarn += nbWarn
+		t.nbAlerts += nbAlert
+		t.nbSrv++
+		resume[s.Type] = t
+
+		nbg.nbOK += nbOK
+		nbg.nbWarn += nbWarn
+		nbg.nbAlerts += nbAlert
+		nbg.nbSrv++
 	}
 
 	if versionOk {

diff --git a/engine/cdn/cdn.go b/engine/cdn/cdn.go
@@ -172,7 +172,7 @@ func (s *Service) Serve(c context.Context) error {
 		return err
 	}
 
-	s.RunTcpLogServer(ctx)
+	s.runTCPLogServer(ctx)
 
 	log.Info(ctx, "Initializing HTTP router")
 	s.initRouter(ctx)

diff --git a/engine/cdn/cdn_log.go b/engine/cdn/cdn_log.go
@@ -29,7 +29,7 @@ var (
 	keyServiceLogIncomingQueue = cache.Key("cdn", "log", "incoming", "service")
 )
 
-func (s *Service) RunTcpLogServer(ctx context.Context) {
+func (s *Service) runTCPLogServer(ctx context.Context) {
 	// Init hatcheries cache
 	if err := s.refreshHatcheriesPK(ctx); err != nil {
 		log.Error(ctx, "unable to init hatcheries cache: %v", err)
@@ -49,7 +49,7 @@ func (s *Service) RunTcpLogServer(ctx context.Context) {
 		_ = listener.Close()
 	}()
 
-	for i := int64(0); i <= s.Cfg.NbJobLogsGoroutines; i++ {
+	for i := int64(0); i < s.Cfg.NbJobLogsGoroutines; i++ {
 		s.GoRoutines.Run(ctx, fmt.Sprintf("cdn-worker-job-%d", i), func(ctx context.Context) {
 			if err := s.dequeueJobLogs(ctx); err != nil {
 				log.Error(ctx, "dequeueJobLogs: unable to dequeue redis incoming job logs: %v", err)

diff --git a/engine/sql/api/217_service_status.sql b/engine/sql/api/217_service_status.sql
@@ -0,0 +1,7 @@
+-- +migrate Up
+
+alter table "service" drop column monitoring_status;
+
+-- +migrate Down
+
+alter table "service" add column monitoring_status JSONB;
diff --git a/engine/worker/internal/register.go b/engine/worker/internal/register.go
@@ -70,7 +70,7 @@ func (w *CurrentWorker) Unregister(ctx context.Context) error {
 	return nil
 }
 
-// LoopPath return the list of evailable command in path
+// LoopPath returns the list of available binaries in path
 func LoopPath(w *CurrentWorker, reqs []sdk.Requirement) []string {
 	binaries := []string{}
 	for _, req := range reqs {

diff --git a/ui/src/app/model/monitoring.model.ts b/ui/src/app/model/monitoring.model.ts
@@ -13,6 +13,25 @@ export class MonitoringStatusLine {
     status: string;
     component: string;
     value: string;
+    type: string;
+    service: string;
+    hostname: string;
+    session: string;
+    consumer: string;
+}
+
+export class MonitoringStatusLineUtil {
+    public static color(monitoringMetricsLine: MonitoringStatusLine): string {
+        switch (monitoringMetricsLine.status) {
+            case 'OK':
+                return 'green';
+            case 'AL':
+                return 'red';
+            case 'WARN':
+                return 'orange';
+        }
+        return 'blue';
+    }
 }
 
 export interface MonitoringMetricsLabel {
@@ -35,3 +54,4 @@ export interface MonitoringMetricsLine {
     type: number;
     metric: MonitoringMetricsMetric[];
 }
+
diff --git a/ui/src/app/views/admin/service/list/service.list.component.ts b/ui/src/app/views/admin/service/list/service.list.component.ts
@@ -1,5 +1,6 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
-import { MonitoringStatus, MonitoringStatusLine } from 'app/model/monitoring.model';
+import { MonitoringStatus, MonitoringStatusLine, MonitoringStatusLineUtil } from 'app/model/monitoring.model';
+import { Column, ColumnType, Filter } from 'app/shared/table/data-table.component';
 import { forkJoin, Observable } from 'rxjs';
 import { finalize, tap } from 'rxjs/operators';
 import { Global, Service } from '../../../../model/service.model';
@@ -20,7 +21,8 @@ export class ServiceListComponent {
     services: Array<Service>;
     profiles: any;
     goroutines: any;
-    filteredStatusLines: Array<MonitoringStatusLine>;
+    columns: Array<Column<MonitoringStatusLine>>;
+    filteredStatusLines: Filter<MonitoringStatusLine>;
     globals: Array<Global> = [];
     globalStatus: Global;
     globalVersion: Global;
@@ -33,6 +35,67 @@ export class ServiceListComponent {
     ) {
         this.loading = true;
 
+        this.columns = [
+            <Column<MonitoringStatusLine>>{
+                name: 'common_type',
+                selector: (c: MonitoringStatusLine) => c.type
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_service',
+                selector: (c: MonitoringStatusLine) => c.service
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_component',
+                selector: (c: MonitoringStatusLine) => c.component
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_hostname',
+                selector: (c: MonitoringStatusLine) => c.hostname
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_status',
+                type: ColumnType.LABEL,
+                selector: (c: MonitoringStatusLine) => {
+                    return {
+                        class: MonitoringStatusLineUtil.color(c),
+                        value: c.status
+                    };
+                }
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_value',
+                selector: (c: MonitoringStatusLine) => c.value
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_consumer',
+                selector: (c: MonitoringStatusLine) => c.consumer
+            },
+            <Column<MonitoringStatusLine>>{
+                name: 'common_session',
+                selector: (c: MonitoringStatusLine) => c.session
+            }
+        ];
+
+        this.filteredStatusLines = f => {
+            const lowerFilter = f.toLowerCase();
+            return (line: MonitoringStatusLine) => {
+                if (f === 'NOTICE') {
+                    return line.status.indexOf('AL') !== -1 || line.status.indexOf('WARN') !== -1;
+                }
+                if (f === 'AL' || f === 'WARN' || f === 'OK') {
+                    return line.status.toLowerCase().indexOf(lowerFilter) !== -1;
+                }
+                return line.status.toLowerCase().indexOf(lowerFilter) !== -1 ||
+                line.component.toLowerCase().indexOf(lowerFilter) !== -1 ||
+                line.value.toLowerCase().indexOf(lowerFilter) !== -1 ||
+                line.type.toLowerCase().indexOf(lowerFilter) !== -1 ||
+                (line.service && line.service.toLowerCase().indexOf(lowerFilter) !== -1) ||
+                (line.hostname && line.hostname.toLowerCase().indexOf(lowerFilter) !== -1) ||
+                (line.session && line.session.toLowerCase().indexOf(lowerFilter) !== -1) ||
+                (line.consumer && line.consumer.toLowerCase().indexOf(lowerFilter) !== -1);
+            }
+        };
+
         forkJoin(
             this.refreshProfiles(),
             this.refreshStatus(),
@@ -81,7 +144,6 @@ export class ServiceListComponent {
     refreshStatus(): Observable<any> {
         return this._monitoringService.getStatus().pipe(tap(r => {
             this.status = r;
-            this.filterChange();
         }));
     }
 
@@ -118,33 +180,4 @@ export class ServiceListComponent {
             this.goroutines = data;
         }));
     }
-
-    filterChange(): void {
-        if (!this.filter) {
-            this.filteredStatusLines = this.status.lines;
-            return;
-        }
-
-        if (this.filter === 'NOTICE') {
-            this.filteredStatusLines = this.status.lines.filter(line => {
-                return line.status.indexOf('AL') !== -1 || line.status.indexOf('WARN') !== -1
-            });
-            return
-        }
-
-        if (this.filter === 'AL' || this.filter === 'WARN' || this.filter === 'OK') {
-            this.filteredStatusLines = this.status.lines.filter(line => {
-                return line.status.indexOf(this.filter) !== -1
-            });
-            return
-        }
-
-        const lowerFilter = this.filter.toLowerCase();
-
-        this.filteredStatusLines = this.status.lines.filter(line => {
-            return line.status.toLowerCase().indexOf(lowerFilter) !== -1 ||
-                line.component.toLowerCase().indexOf(lowerFilter) !== -1 ||
-                line.value.toLowerCase().indexOf(lowerFilter) !== -1
-        });
-    }
 }