[#877] apply formatting and linting to pipelines module

ui/.eslintignore

@@ -36,5 +36,4 @@ src/app/login
 src/app/notifications
 src/app/NS
 src/app/pipeline-details
-src/app/pipelines
 src/scss

ui/.prettierignore

@@ -36,5 +36,4 @@ src/app/login
 src/app/notifications
 src/app/NS
 src/app/pipeline-details
-src/app/pipelines
 src/scss

ui/src/app/pipelines/category-already-in-pipeline.filter.ts

@@ -20,14 +20,16 @@ import { Pipe, PipeTransform } from '@angular/core';
 import { Pipeline } from '@streampipes/platform-services';
 
 @Pipe({
-	name: 'categoryAlreadyInPipelineFilter',
-	pure: false
+    name: 'categoryAlreadyInPipelineFilter',
+    pure: false,
 })
 export class CategoryAlreadyInPipelinePipe implements PipeTransform {
-
-	transform(pipelines: Pipeline[], categoryId: string): any {
-		return pipelines.filter(pipeline => {
-			return !pipeline.pipelineCategories || !(pipeline.pipelineCategories.some(pc => pc === categoryId));
-		});
-	}
+    transform(pipelines: Pipeline[], categoryId: string): any {
+        return pipelines.filter(pipeline => {
+            return (
+                !pipeline.pipelineCategories ||
+                !pipeline.pipelineCategories.some(pc => pc === categoryId)
+            );
+        });
+    }
 }

ui/src/app/pipelines/components/functions-overview/abstract-function-details.directive.ts

@@ -18,11 +18,11 @@
 
 import { ActivatedRoute } from '@angular/router';
 import {
-  AdapterMonitoringService,
-  FunctionDefinition,
-  FunctionsService,
-  PipelineElementService,
-  SpDataStream
+    AdapterMonitoringService,
+    FunctionDefinition,
+    FunctionsService,
+    PipelineElementService,
+    SpDataStream,
 } from '@streampipes/platform-services';
 import { Directive } from '@angular/core';
 import { Observable, zip } from 'rxjs';
@@ -31,57 +31,77 @@ import { SpPipelineRoutes } from '../../pipelines.routes';
 
 @Directive()
 export abstract class AbstractFunctionDetailsDirective {
+    public activeFunction: FunctionDefinition;
 
-  public activeFunction: FunctionDefinition;
+    contentReady = false;
+    tabs = [];
+    streamNames: Record<string, string> = {};
 
-  contentReady = false;
-  tabs = [];
-  streamNames: Record<string, string> = {};
+    constructor(
+        private route: ActivatedRoute,
+        protected functionsService: FunctionsService,
+        private pipelineElementService: PipelineElementService,
+        private adapterMonitoringService: AdapterMonitoringService,
+        private breadcrumbService: SpBreadcrumbService,
+    ) {}
 
-  constructor(private route: ActivatedRoute,
-              protected functionsService: FunctionsService,
-              private pipelineElementService: PipelineElementService,
-              private adapterMonitoringService: AdapterMonitoringService,
-              private breadcrumbService: SpBreadcrumbService) {
-  }
+    onInit() {
+        const functionId = this.route.snapshot.params.functionId;
+        this.breadcrumbService.updateBreadcrumb([
+            SpPipelineRoutes.BASE,
+            { label: functionId },
+            { label: this.getBreadcrumbLabel() },
+        ]);
+        this.tabs = [
+            {
+                itemId: 'metrics',
+                itemTitle: 'Metrics',
+                itemLink: ['pipelines', 'functions', functionId, 'metrics'],
+            },
+            {
+                itemId: 'logs',
+                itemTitle: 'Logs',
+                itemLink: ['pipelines', 'functions', functionId, 'logs'],
+            },
+        ];
+        this.loadFunctions(functionId);
+    }
 
-  onInit() {
-    const functionId = this.route.snapshot.params.functionId;
-    this.breadcrumbService.updateBreadcrumb([SpPipelineRoutes.BASE, {label: functionId}, {label: this.getBreadcrumbLabel()}]);
-    this.tabs = [
-      {itemId: 'metrics', itemTitle: 'Metrics', itemLink: ['pipelines', 'functions', functionId, 'metrics']},
-      {itemId: 'logs', itemTitle: 'Logs', itemLink: ['pipelines', 'functions', functionId, 'logs']}
-    ]
-    this.loadFunctions(functionId);
-  }
+    loadFunctions(functionId: string) {
+        this.functionsService.getActiveFunctions().subscribe(functions => {
+            this.activeFunction = functions.find(
+                f => f.functionId.id === functionId,
+            );
+            this.loadStreams(this.activeFunction.consumedStreams);
+        });
+    }
 
-  loadFunctions(functionId: string) {
-    this.functionsService.getActiveFunctions().subscribe(functions => {
-      this.activeFunction = functions.find(f => f.functionId.id === functionId);
-      this.loadStreams(this.activeFunction.consumedStreams);
-    })
-  }
+    loadStreams(relatedStreams: string[]) {
+        this.streamNames = {};
+        const observables = this.getStreamObservables(relatedStreams);
+        zip(...observables).subscribe(streams => {
+            streams.forEach(
+                stream => (this.streamNames[stream.elementId] = stream.name),
+            );
+            this.afterFunctionLoaded();
+        });
+    }
 
-  loadStreams(relatedStreams: string[]) {
-    this.streamNames = {};
-    const observables = this.getStreamObservables(relatedStreams);
-    zip(...observables).subscribe(streams => {
-      streams.forEach(stream => this.streamNames[stream.elementId] = stream.name);
-      this.afterFunctionLoaded();
-    })
-  }
+    getStreamObservables(relatedStreams: string[]): Observable<SpDataStream>[] {
+        return relatedStreams.map(s =>
+            this.pipelineElementService.getDataStreamByElementId(s),
+        );
+    }
 
-  getStreamObservables(relatedStreams: string[]): Observable<SpDataStream>[] {
-    return relatedStreams.map(s => this.pipelineElementService.getDataStreamByElementId(s));
-  }
+    triggerUpdate() {
+        this.adapterMonitoringService
+            .triggerMonitoringUpdate()
+            .subscribe(() => {
+                this.afterFunctionLoaded();
+            });
+    }
 
-  triggerUpdate() {
-    this.adapterMonitoringService.triggerMonitoringUpdate().subscribe(() => {
-      this.afterFunctionLoaded();
-    });
-  }
+    abstract afterFunctionLoaded(): void;
 
-  abstract afterFunctionLoaded(): void;
-
-  abstract getBreadcrumbLabel(): string;
+    abstract getBreadcrumbLabel(): string;
 }

ui/src/app/pipelines/components/functions-overview/functions-logs/functions-logs.component.html

@@ -16,26 +16,31 @@
   ~
   -->
 
-<sp-basic-nav-tabs [spNavigationItems]="tabs"
-                   [activeLink]="'logs'"
-                   [showBackLink]="true"
-                   [backLinkTarget]="['pipelines']">
-  <div nav fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
-    <button mat-button
+<sp-basic-nav-tabs
+    [spNavigationItems]="tabs"
+    [activeLink]="'logs'"
+    [showBackLink]="true"
+    [backLinkTarget]="['pipelines']"
+>
+    <div nav fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
+        <button
+            mat-button
             mat-icon-button
             color="accent"
             class="mr-10"
             matTooltip="Refresh"
-            (click)="triggerUpdate()">
-      <i class="material-icons">refresh</i>
-    </button>
-  </div>
-  <div fxFlex="100" fxLayout="column" *ngIf="activeFunction && contentReady">
-    <sp-simple-logs [elementName]="activeFunction.functionId.id" [logs]="logs"
-                    fxFlex="100"
-                    fxLayout="column">
-    </sp-simple-logs>
-  </div>
-
-
+            (click)="triggerUpdate()"
+        >
+            <i class="material-icons">refresh</i>
+        </button>
+    </div>
+    <div fxFlex="100" fxLayout="column" *ngIf="activeFunction && contentReady">
+        <sp-simple-logs
+            [elementName]="activeFunction.functionId.id"
+            [logs]="logs"
+            fxFlex="100"
+            fxLayout="column"
+        >
+        </sp-simple-logs>
+    </div>
 </sp-basic-nav-tabs>

ui/src/app/pipelines/components/functions-overview/functions-logs/functions-logs.component.ts

@@ -21,31 +21,34 @@ import { AbstractFunctionDetailsDirective } from '../abstract-function-details.d
 import { SpLogEntry } from '@streampipes/platform-services';
 
 @Component({
-  selector: 'sp-functions-logs',
-  templateUrl: './functions-logs.component.html',
-  styleUrls: []
+    selector: 'sp-functions-logs',
+    templateUrl: './functions-logs.component.html',
+    styleUrls: [],
 })
-export class SpFunctionsLogsComponent extends AbstractFunctionDetailsDirective implements OnInit {
-
-  logs: SpLogEntry[] = [];
-
-  ngOnInit(): void {
-    super.onInit();
-  }
-
-  afterFunctionLoaded(): void {
-    this.loadLogs();
-  }
-
-  loadLogs(): void {
-    this.functionsService.getFunctionLogs(this.activeFunction.functionId.id).subscribe(logs => {
-      this.logs = logs;
-      this.contentReady = true;
-    });
-  }
-
-  getBreadcrumbLabel(): string {
-    return 'Logs';
-  }
-
+export class SpFunctionsLogsComponent
+    extends AbstractFunctionDetailsDirective
+    implements OnInit
+{
+    logs: SpLogEntry[] = [];
+
+    ngOnInit(): void {
+        super.onInit();
+    }
+
+    afterFunctionLoaded(): void {
+        this.loadLogs();
+    }
+
+    loadLogs(): void {
+        this.functionsService
+            .getFunctionLogs(this.activeFunction.functionId.id)
+            .subscribe(logs => {
+                this.logs = logs;
+                this.contentReady = true;
+            });
+    }
+
+    getBreadcrumbLabel(): string {
+        return 'Logs';
+    }
 }

ui/src/app/pipelines/components/functions-overview/functions-metrics/functions-metrics.component.html

@@ -16,30 +16,34 @@
   ~
   -->
 
-<sp-basic-nav-tabs [spNavigationItems]="tabs"
-                   [activeLink]="'metrics'"
-                   [showBackLink]="true"
-                   [backLinkTarget]="['pipelines']">
-  <div nav fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
-    <button mat-button
+<sp-basic-nav-tabs
+    [spNavigationItems]="tabs"
+    [activeLink]="'metrics'"
+    [showBackLink]="true"
+    [backLinkTarget]="['pipelines']"
+>
+    <div nav fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
+        <button
+            mat-button
             mat-icon-button
             color="accent"
             class="mr-10"
             matTooltip="Refresh"
-            (click)="triggerUpdate()">
-      <i class="material-icons">refresh</i>
-    </button>
-  </div>
-  <div fxFlex="100" fxLayout="column" *ngIf="activeFunction && contentReady">
-    <div *ngFor="let messagesIn of metrics.messagesIn | keyvalue">
-      <sp-simple-metrics [elementName]="streamNames[messagesIn.key]"
-                         lastPublishedLabel="Last consumed message"
-                         statusValueLabel="Consumed messages"
-                         [lastTimestamp]="messagesIn.value.lastTimestamp"
-                         [statusValue]="messagesIn.value.counter">
-      </sp-simple-metrics>
+            (click)="triggerUpdate()"
+        >
+            <i class="material-icons">refresh</i>
+        </button>
+    </div>
+    <div fxFlex="100" fxLayout="column" *ngIf="activeFunction && contentReady">
+        <div *ngFor="let messagesIn of metrics.messagesIn | keyvalue">
+            <sp-simple-metrics
+                [elementName]="streamNames[messagesIn.key]"
+                lastPublishedLabel="Last consumed message"
+                statusValueLabel="Consumed messages"
+                [lastTimestamp]="messagesIn.value.lastTimestamp"
+                [statusValue]="messagesIn.value.counter"
+            >
+            </sp-simple-metrics>
+        </div>
     </div>
-  </div>
-
-
 </sp-basic-nav-tabs>

ui/src/app/pipelines/components/functions-overview/functions-metrics/functions-metrics.component.ts

@@ -21,30 +21,34 @@ import { AbstractFunctionDetailsDirective } from '../abstract-function-details.d
 import { SpMetricsEntry } from '@streampipes/platform-services';
 
 @Component({
-  selector: 'sp-functions-metrics',
-  templateUrl: './functions-metrics.component.html',
-  styleUrls: []
+    selector: 'sp-functions-metrics',
+    templateUrl: './functions-metrics.component.html',
+    styleUrls: [],
 })
-export class SpFunctionsMetricsComponent extends AbstractFunctionDetailsDirective implements OnInit {
+export class SpFunctionsMetricsComponent
+    extends AbstractFunctionDetailsDirective
+    implements OnInit
+{
+    metrics: SpMetricsEntry;
 
-  metrics: SpMetricsEntry;
+    ngOnInit(): void {
+        super.onInit();
+    }
 
-  ngOnInit(): void {
-    super.onInit();
-  }
+    afterFunctionLoaded(): void {
+        this.loadMetrics();
+    }
 
-  afterFunctionLoaded(): void {
-    this.loadMetrics();
-  }
+    loadMetrics() {
+        this.functionsService
+            .getFunctionMetrics(this.activeFunction.functionId.id)
+            .subscribe(metrics => {
+                this.metrics = metrics;
+                this.contentReady = true;
+            });
+    }
 
-  loadMetrics() {
-    this.functionsService.getFunctionMetrics(this.activeFunction.functionId.id).subscribe(metrics => {
-      this.metrics = metrics;
-      this.contentReady = true;
-    })
-  }
-
-  getBreadcrumbLabel(): string {
-    return 'Metrics';
-  }
+    getBreadcrumbLabel(): string {
+        return 'Metrics';
+    }
 }