You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2022/07/09 08:04:16 UTC
[incubator-streampipes] branch STREAMPIPES-558 created (now dbfd35bad)
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a change to branch STREAMPIPES-558
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
at dbfd35bad [STREAMPIPES-558] Add options toolbar to adapter overview component
This branch includes the following new commits:
new 2a68ddda6 [STREAMPIPES-558] Modify navigation flow of Connect module
new ea77f0ce5 [STREAMPIPES-558] Reorganize Connect module structure
new 9f4b3b5ca [STREAMPIPES-558] Add options bar to marketplace component
new dbfd35bad [STREAMPIPES-558] Add options toolbar to adapter overview component
The 4 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[incubator-streampipes] 03/04: [STREAMPIPES-558] Add options bar to marketplace component
Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch STREAMPIPES-558
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit 9f4b3b5cadde58ef37482c791471ccc35a835f5c
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Sat Jul 9 09:49:02 2022 +0200
[STREAMPIPES-558] Add options bar to marketplace component
---
.../basic-view/basic-view.component.scss | 2 +-
.../data-marketplace.component.html | 34 +++------
.../data-marketplace.component.scss | 28 --------
.../data-marketplace/data-marketplace.component.ts | 83 ++--------------------
.../existing-adapters.component.html | 4 ++
.../existing-adapters.component.scss | 6 ++
.../existing-adapters.component.ts | 7 +-
.../filter-toolbar/filter-toolbar.component.html | 27 +++++--
.../filter-toolbar/filter-toolbar.component.scss | 48 +++++++++++++
.../filter-toolbar/filter-toolbar.component.ts | 17 +++--
ui/src/app/connect/filter/filter.pipe.ts | 64 +++++++++++++----
.../adapter-filter-settings.model.ts} | 31 ++------
12 files changed, 171 insertions(+), 180 deletions(-)
diff --git a/ui/projects/streampipes/shared-ui/src/lib/components/basic-view/basic-view.component.scss b/ui/projects/streampipes/shared-ui/src/lib/components/basic-view/basic-view.component.scss
index a73f16375..86f2cd984 100644
--- a/ui/projects/streampipes/shared-ui/src/lib/components/basic-view/basic-view.component.scss
+++ b/ui/projects/streampipes/shared-ui/src/lib/components/basic-view/basic-view.component.scss
@@ -37,7 +37,7 @@
}
.page-container-padding-inner {
- margin: 10px;
+ margin: 20px;
}
.pl-5 {
diff --git a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
index cd37e8489..b08e92220 100644
--- a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
+++ b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
@@ -19,9 +19,9 @@
<sp-basic-view showBackLink="true" [backLinkTarget]="['connect']" [padding]="true">
<div nav fxFlex="100">
+ <sp-connect-filter-toolbar (filterChangedEmitter)="applyFilter($event)"></sp-connect-filter-toolbar>
<div fxFlex="100" fxLayout="row" fxLayoutAlign="end center"
- style="padding-left:10px;padding-right:10px;font-size:14px;" class="page-container-nav"
- *ngIf="selectedIndex === 0 && newAdapterFromDescription === undefined">
+ style="padding-left:10px;padding-right:10px;font-size:14px;" class="page-container-nav">
<button mat-icon-button id="startAdapterTutorial3" (click)="startAdapterTutorial3()"
matTooltip="Tutorial: Generic Adapter">
<mat-icon color="accent">school</mat-icon>
@@ -39,27 +39,15 @@
<mat-spinner [mode]="'indeterminate'" [diameter]="20" color="accent"></mat-spinner>
<h4> Searching for available adapters, please wait...</h4>
</div>
- <div class="container-fluid marketplace-container" *ngIf="!adaptersLoading && !adapterLoadingError">
- <div *ngIf="selectedIndex === 0">
-
- <div *ngIf="newAdapterFromDescription===undefined" fxLayout="row wrap" fxLayoutAlign="start stretch"
- class="adapter-description-container">
- <sp-adapter-description attr.id="{{adapterDescription.name.replaceAll(' ', '_')}}"
- class="adapter-description"
- fxFlex="33" (click)="selectAdapter(adapterDescription.appId)"
- *ngFor="let adapterDescription of filteredAdapterDescriptions | filter:filterTerm"
- [adapter]="adapterDescription"
- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-adapter-description>
- </div>
-
-
-<!-- <div class="new-adapter-container" fxFlex="100" fxLayout="row" fxLayoutAlign="start start"-->
-<!-- *ngIf="newAdapterFromDescription!==undefined">-->
-<!-- <sp-new-adapter fxFlex="100" (removeSelectionEmitter)="removeSelection($event)"-->
-<!-- [adapter]="newAdapterFromDescription"-->
-<!-- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-new-adapter>-->
-<!-- </div>-->
-
+ <div class="container-fluid marketplace-container" *ngIf="!adaptersLoading && !adapterLoadingError && currentFilter">
+ <div fxLayout="row wrap" fxLayoutAlign="start stretch"
+ class="adapter-description-container">
+ <sp-adapter-description attr.id="{{adapterDescription.name.replaceAll(' ', '_')}}"
+ class="adapter-description"
+ fxFlex="33"
+ (click)="selectAdapter(adapterDescription.appId)"
+ *ngFor="let adapterDescription of adapterDescriptions | adapterFilter:currentFilter"
+ [adapter]="adapterDescription"></sp-adapter-description>
</div>
</div>
</div>
diff --git a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
index 90345358c..04d1f5dca 100644
--- a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
+++ b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.scss
@@ -46,38 +46,10 @@
background: #EEE;
}
-#categoryFilter {
- margin-top: 20px;
-}
-
-.fixed-height {
- height: 50px;
-}
-
-.form-style {
- margin: 0px 5px 0px 0px;
-}
-
.icon-style {
margin: 15px 4px 0px 0px;
color: var(--color-accent);
}
-.data-marketplace-options {
- padding:0px;
- background-color: var(--color-bg-1);
- border-bottom: 1px solid var(--color-bg-3);
-}
-.data-marketplace-options-item {
- display: inline;
- margin-right: 10px;
-}
-::ng-deep .mat-select-panel {
- background: #fff;
-}
-
-::ng-deep .mat-select-panel:not([class*=mat-elevation-z]) {
- box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
-}
diff --git a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
index 95e454535..844509a0d 100644
--- a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
+++ b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
@@ -16,14 +16,14 @@
*
*/
-import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
import { DataMarketplaceService } from '../../services/data-marketplace.service';
import { ShepherdService } from '../../../services/tour/shepherd.service';
import { ConnectService } from '../../services/connect.service';
-import { FilterPipe } from '../../filter/filter.pipe';
import { AdapterDescriptionUnion } from '@streampipes/platform-services';
import { DialogService } from '@streampipes/shared-ui';
import { Router } from '@angular/router';
+import { AdapterFilterSettingsModel } from '../../model/adapter-filter-settings.model';
@Component({
selector: 'sp-data-marketplace',
@@ -31,24 +31,14 @@ import { Router } from '@angular/router';
styleUrls: ['./data-marketplace.component.scss']
})
export class DataMarketplaceComponent implements OnInit {
- adapterDescriptions: AdapterDescriptionUnion[];
- newAdapterFromDescription: AdapterDescriptionUnion;
- filteredAdapterDescriptions: AdapterDescriptionUnion[];
- adapters: AdapterDescriptionUnion[];
- filteredAdapters: AdapterDescriptionUnion[];
- visibleAdapters: AdapterDescriptionUnion[];
-
- @Output()
- selectAdapterEmitter: EventEmitter<AdapterDescriptionUnion> = new EventEmitter<AdapterDescriptionUnion>();
-
- selectedIndex = 0;
- filterTerm = '';
- pipe: FilterPipe = new FilterPipe();
+ adapterDescriptions: AdapterDescriptionUnion[];
adaptersLoading = true;
adapterLoadingError = false;
+ currentFilter: AdapterFilterSettingsModel;
+
constructor(private dataMarketplaceService: DataMarketplaceService,
private shepherdService: ShepherdService,
private connectService: ConnectService,
@@ -57,11 +47,6 @@ export class DataMarketplaceComponent implements OnInit {
}
ngOnInit() {
- this.updateDescriptionsAndRunningAdatpers();
- this.visibleAdapters = this.adapters;
- }
-
- updateDescriptionsAndRunningAdatpers() {
this.getAdapterDescriptions();
}
@@ -73,10 +58,8 @@ export class DataMarketplaceComponent implements OnInit {
.getAdapterDescriptions()
.subscribe((allAdapters) => {
this.adapterDescriptions = allAdapters;
- // this.adapterDescriptions = this.adapterDescriptions.concat(allAdapters[1]);
this.adapterDescriptions
.sort((a, b) => a.name.localeCompare(b.name));
- this.filteredAdapterDescriptions = this.adapterDescriptions;
this.adaptersLoading = false;
}, error => {
console.log(error);
@@ -85,12 +68,6 @@ export class DataMarketplaceComponent implements OnInit {
});
}
-
-
- selectedIndexChange(index: number) {
- this.selectedIndex = index;
- }
-
startAdapterTutorial() {
this.shepherdService.startAdapterTour();
}
@@ -108,53 +85,7 @@ export class DataMarketplaceComponent implements OnInit {
// this.shepherdService.trigger('select-adapter');
}
- templateFromRunningAdapter(adapter: AdapterDescriptionUnion) {
- adapter.elementId = undefined;
- adapter._rev = undefined;
- this.selectedIndexChange(0);
- //this.selectAdapter(adapter);
-
+ applyFilter(filter: AdapterFilterSettingsModel) {
+ this.currentFilter = { ...filter };
}
-
- removeSelection() {
- this.newAdapterFromDescription = undefined;
- }
-
- updateFilterTerm(inputValue) {
- this.filterTerm = inputValue;
- }
-
- filterAdapter(event) {
- const filteredAdapterTypes = this.filterAdapterType(this.adapterDescriptions);
- const filteredAdapterTemplateTypes = this.filterAdapterType(this.adapters);
-
- const filteredAdapterCategories = this.filterAdapterCategory(filteredAdapterTypes);
- const filteredAdapterTemplateCategories = this.filterAdapterCategory(filteredAdapterTemplateTypes);
-
- this.filteredAdapterDescriptions = filteredAdapterCategories;
- this.filteredAdapters = filteredAdapterTemplateCategories;
- }
-
- filterAdapterCategory(currentElements: AdapterDescriptionUnion[]): AdapterDescriptionUnion[] {
- // TODO
- // if (this.selectedCategory === this.adapterCategories[0].code) {
- // return currentElements;
- // } else {
- // return currentElements.filter(adapterDescription => adapterDescription.category.indexOf(this.selectedCategory) !== -1);
- // }
- return [];
- }
-
- filterAdapterType(currentElements: AdapterDescriptionUnion[]): AdapterDescriptionUnion[] {
- // TODO
- // if (this.selectedType === this.adapterTypes[0]) {
- // return currentElements;
- // } else if (this.selectedType === this.adapterTypes[1]) {
- // return currentElements.filter(adapterDescription => this.connectService.isDataSetDescription(adapterDescription));
- // } else if (this.selectedType === this.adapterTypes[2]) {
- // return currentElements.filter(adapterDescription => !this.connectService.isDataSetDescription(adapterDescription));
- // }
- return [];
- }
-
}
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
index 8ee8694a0..f15618f0a 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
@@ -21,6 +21,10 @@
<button mat-button mat-raised-button color="accent" (click)="createNewAdapter()">
<i class="material-icons">add</i> New adapter
</button>
+ <sp-connect-filter-toolbar
+ class="filter-bar-margin"
+ (filterChangedEmitter)="applyFilter($event)">
+ </sp-connect-filter-toolbar>
</div>
<div fxFlex="100" fxLayout="column">
<div class="assemblyOptions sp-blue-bg mt-20" style="padding:5px;">
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
index b69117a5f..61fa0a5e3 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
@@ -44,3 +44,9 @@
cursor: pointer;
color: #FFEB3B;
}
+
+.filter-bar-margin {
+ margin-left: 10px;
+ padding-left: 10px;
+ border-left: 2px solid var(--color-bg-2)
+}
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
index 53bc49661..275a1f9a8 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
@@ -21,7 +21,7 @@ import { AdapterDescriptionUnion, PipelineElementService } from '@streampipes/pl
import { MatTableDataSource } from '@angular/material/table';
import { ConnectService } from '../../services/connect.service';
import { DataMarketplaceService } from '../../services/data-marketplace.service';
-import { DialogRef, PanelType, DialogService } from '@streampipes/shared-ui';
+import { DialogRef, DialogService, PanelType } from '@streampipes/shared-ui';
import { DeleteAdapterDialogComponent } from '../../dialog/delete-adapter-dialog/delete-adapter-dialog.component';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
@@ -30,6 +30,7 @@ import { UserRole } from '../../../_enums/user-role.enum';
import { AuthService } from '../../../services/auth.service';
import { HelpComponent } from '../../../editor/dialog/help/help.component';
import { Router } from '@angular/router';
+import { AdapterFilterSettingsModel } from '../../model/adapter-filter-settings.model';
@Component({
selector: 'sp-existing-adapters',
@@ -168,4 +169,8 @@ export class ExistingAdaptersComponent implements OnInit {
this.router.navigate(['connect', 'create']);
}
+ applyFilter(filter: AdapterFilterSettingsModel) {
+
+ }
+
}
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html
index ce79d7fd7..60daec146 100644
--- a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html
+++ b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html
@@ -1,16 +1,34 @@
-<div fxLayout="row" class="fixed-height data-marketplace-options">
+<!--
+ ~ Licensed to the Apache Software Foundation (ASF) under one or more
+ ~ contributor license agreements. See the NOTICE file distributed with
+ ~ this work for additional information regarding copyright ownership.
+ ~ The ASF licenses this file to You under the Apache License, Version 2.0
+ ~ (the "License"); you may not use this file except in compliance with
+ ~ the License. You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ ~
+ -->
+
+<div fxLayout="row" class="fixed-height">
<div class="data-marketplace-options-item pl-5" style="margin-top:8px;" fxLayoutAlign="start center"
fxLayout="row">
<mat-icon color="accent">search</mat-icon>
- <mat-form-field class="form-style">
+ <mat-form-field class="form-style" color="accent" floatLabel="never">
<input matInput placeholder="Find Element" value="" (input)="updateFilterTerm($event.target.value)"
name="something">
</mat-form-field>
</div>
<div class="data-marketplace-options-item">
<mat-form-field color="accent">
- <mat-select [(value)]="selectedType" (selectionChange)="filterAdapter($event)">
+ <mat-select [(value)]="currentFilter.selectedType" (selectionChange)="filterAdapter($event)">
<mat-option *ngFor="let type of adapterTypes" [value]="type">
{{type}}
</mat-option>
@@ -19,7 +37,7 @@
</div>
<div class="data-marketplace-options-item">
<mat-form-field color="accent">
- <mat-select [(value)]="selectedCategory" (selectionChange)="filterAdapter($event)">
+ <mat-select [(value)]="currentFilter.selectedCategory" (selectionChange)="filterAdapter($event)">
<mat-option *ngFor="let category of adapterCategories" [value]="category.code">
{{category.label}}
</mat-option>
@@ -27,5 +45,4 @@
</mat-form-field>
</div>
<span fxFlex></span>
-
</div>
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss
index e69de29bb..c239b471b 100644
--- a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss
+++ b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss
@@ -0,0 +1,48 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ */
+
+::ng-deep .mat-select-panel {
+ background: #fff;
+}
+
+::ng-deep .mat-select-panel:not([class*=mat-elevation-z]) {
+ box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
+}
+
+#categoryFilter {
+ margin-top: 20px;
+}
+
+.data-marketplace-options {
+ padding:0px;
+ background-color: var(--color-bg-1);
+ border-bottom: 1px solid var(--color-bg-3);
+}
+
+.data-marketplace-options-item {
+ display: inline;
+ margin-right: 10px;
+}
+
+.form-style {
+ margin: 0px 5px 0px 0px;
+}
+
+.fixed-height {
+ height: 50px;
+}
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts
index c8dd09a73..5db11ff92 100644
--- a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts
+++ b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts
@@ -1,6 +1,7 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { DataMarketplaceService } from '../../services/data-marketplace.service';
import { MatSelectChange } from '@angular/material/select';
+import { AdapterFilterSettingsModel } from '../../model/adapter-filter-settings.model';
@Component({
selector: 'sp-connect-filter-toolbar',
@@ -9,11 +10,13 @@ import { MatSelectChange } from '@angular/material/select';
})
export class SpConnectFilterToolbarComponent implements OnInit {
- adapterTypes: string[] = ['All types', 'Data Set', 'Data Stream'];
- selectedType = 'All types';
+ @Output()
+ filterChangedEmitter: EventEmitter<AdapterFilterSettingsModel> = new EventEmitter<AdapterFilterSettingsModel>();
+ adapterTypes: string[] = ['All types', 'Data Set', 'Data Stream'];
adapterCategories: any;
- selectedCategory: any = 'All';
+
+ currentFilter: AdapterFilterSettingsModel = {textFilter: '', selectedCategory: 'All', selectedType: 'All types'};
constructor(private dataMarketplaceService: DataMarketplaceService) {
@@ -27,15 +30,17 @@ export class SpConnectFilterToolbarComponent implements OnInit {
this.dataMarketplaceService.getAdapterCategories().subscribe(res => {
this.adapterCategories = res;
this.adapterCategories.unshift({ label: 'All categories', description: '', code: 'All' });
+ this.filterChangedEmitter.emit(this.currentFilter);
});
}
filterAdapter(event: MatSelectChange) {
-
+ this.filterChangedEmitter.emit(this.currentFilter);
}
updateFilterTerm(event: string) {
-
+ this.currentFilter.textFilter = event;
+ this.filterChangedEmitter.emit(this.currentFilter);
}
diff --git a/ui/src/app/connect/filter/filter.pipe.ts b/ui/src/app/connect/filter/filter.pipe.ts
index b7f663fb8..37a8f775f 100644
--- a/ui/src/app/connect/filter/filter.pipe.ts
+++ b/ui/src/app/connect/filter/filter.pipe.ts
@@ -18,24 +18,62 @@
import { Pipe, PipeTransform } from '@angular/core';
import { AdapterDescriptionUnion } from '@streampipes/platform-services';
+import { AdapterFilterSettingsModel } from '../model/adapter-filter-settings.model';
+import { ConnectService } from '../services/connect.service';
@Pipe({
- name: 'filter'
+ name: 'adapterFilter'
})
export class FilterPipe implements PipeTransform {
- transform(adapterDescriptions: AdapterDescriptionUnion[], filterTerm?: any): any {
- // check if search filterTerm is undefined
- if (filterTerm === undefined || !adapterDescriptions) { return adapterDescriptions; }
- return adapterDescriptions.filter(adapterDescription => {
- if (adapterDescription.name == null) {
- return true;
- } else {
- adapterDescription.name.replace(' ', '_');
- return adapterDescription.name.toLowerCase().includes(filterTerm.toLowerCase()) ||
- adapterDescription.description.toLowerCase().includes(filterTerm.toLowerCase());
- }
- });
+ constructor(private connectService: ConnectService) {
+ }
+
+ transform(adapterDescriptions: AdapterDescriptionUnion[],
+ activeFilters: AdapterFilterSettingsModel): AdapterDescriptionUnion[] {
+ return adapterDescriptions.filter(a => this.meetsFilterCondition(a, activeFilters));
+ }
+
+ private meetsFilterCondition(adapterDescription: AdapterDescriptionUnion,
+ activeFilters: AdapterFilterSettingsModel): boolean {
+ return this.meetsFilterTypeCondition(adapterDescription, activeFilters.selectedType) &&
+ this.meetsFilterCategoryCondition(adapterDescription, activeFilters.selectedCategory) &&
+ this.meetsFilterTextCondition(adapterDescription, activeFilters.textFilter);
+ }
+
+ private meetsFilterTypeCondition(adapterDescription: AdapterDescriptionUnion,
+ selectedType: string): boolean {
+ if (selectedType === 'All types') {
+ return true;
+ } else if (selectedType === 'Data Set') {
+ return this.connectService.isDataSetDescription(adapterDescription);
+ } else if (selectedType === 'Data Stream') {
+ return !this.connectService.isDataSetDescription(adapterDescription);
+ }
+ }
+
+ private meetsFilterCategoryCondition(adapterDescription: AdapterDescriptionUnion,
+ selectedCategory: string): boolean {
+ if (selectedCategory === 'All') {
+ return true;
+ } else {
+ return adapterDescription.category.indexOf(selectedCategory) !== -1;
+ }
+ }
+
+ private meetsFilterTextCondition(adapterDescription: AdapterDescriptionUnion,
+ filterTerm: string): boolean {
+ if (filterTerm === undefined || filterTerm === '') {
+ return true;
+ } else {
+ if (adapterDescription.name == null) {
+ return true;
+ } else {
+ adapterDescription.name.replace(' ', '_');
+ return adapterDescription.name.toLowerCase().includes(filterTerm.toLowerCase()) ||
+ adapterDescription.description.toLowerCase().includes(filterTerm.toLowerCase());
+ }
}
+ }
}
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss b/ui/src/app/connect/model/adapter-filter-settings.model.ts
similarity index 69%
copy from ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
copy to ui/src/app/connect/model/adapter-filter-settings.model.ts
index b69117a5f..3b30586b8 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
+++ b/ui/src/app/connect/model/adapter-filter-settings.model.ts
@@ -16,31 +16,8 @@
*
*/
-
-.mat-table {
-
-}
-
-.mat-paginator {
- border-top: 1px solid rgba(0,0,0,.12);
-}
-
-.mat-row:nth-child(even) {
- background-color: var(--color-bg-2);
-}
-.mat-row:nth-child(odd) {
- background-color: var(--color-bg-3);
-}
-
-.adapter-icon {
- max-height:50px;
-}
-
-.historic {
- cursor: pointer;
- color: #ffa23b;
-}
-.real-time {
- cursor: pointer;
- color: #FFEB3B;
+export interface AdapterFilterSettingsModel {
+ textFilter: string;
+ selectedType: string;
+ selectedCategory: string;
}
[incubator-streampipes] 02/04: [STREAMPIPES-558] Reorganize Connect module structure
Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch STREAMPIPES-558
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit ea77f0ce5089fa0fe3335404eafcbf9296ac14e8
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Fri Jul 8 23:08:51 2022 +0200
[STREAMPIPES-558] Reorganize Connect module structure
---
.../format-configuration.component.html | 0
.../format-configuration.component.scss | 0
.../format-configuration.component.ts | 2 +-
.../format-item-json.component.html | 0
.../format-item-json.component.scss | 0
.../format-item-json/format-item-json.component.ts | 0
.../format-item/format-item.component.html | 0
.../format-item/format-item.component.scss | 0
.../format-item/format-item.component.ts | 2 +-
.../format-list/format-list.component.html | 0
.../format-list/format-list.component.scss | 0
.../format-list/format-list.component.ts | 2 +-
.../generic-adapter-configuration.component.html | 0
.../generic-adapter-configuration.component.scss | 0
.../generic-adapter-configuration.component.ts | 0
.../new-adapter/new-adapter.component.ts | 2 +-
.../error-message/error-message.component.html | 0
.../error-message/error-message.component.scss | 0
.../error-message/error-message.component.ts | 0
.../event-property-row.component.html | 0
.../event-property-row.component.scss | 0
.../event-property-row.component.ts | 2 +-
.../event-schema-preview.component.html | 0
.../event-schema-preview.component.scss | 0
.../event-schema-preview.component.ts | 0
.../event-schema/event-schema.component.html | 0
.../event-schema/event-schema.component.scss | 0
.../event-schema/event-schema.component.ts | 6 ++---
.../loading-message/loading-message.component.html | 0
.../loading-message/loading-message.component.scss | 0
.../loading-message/loading-message.component.ts | 0
.../schema-editor-header.component.html | 0
.../schema-editor-header.component.scss | 0
.../schema-editor-header.component.ts | 2 +-
.../specific-adapter-configuration.component.html | 0
.../specific-adapter-configuration.component.scss | 0
.../specific-adapter-configuration.component.ts | 0
.../start-adapter-configuration.component.html | 0
.../start-adapter-configuration.component.scss | 0
.../start-adapter-configuration.component.ts | 8 +++----
ui/src/app/connect/connect.module.ts | 26 +++++++++++-----------
41 files changed, 26 insertions(+), 26 deletions(-)
diff --git a/ui/src/app/connect/components/format-configuration/format-configuration.component.html b/ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.html
similarity index 100%
rename from ui/src/app/connect/components/format-configuration/format-configuration.component.html
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.html
diff --git a/ui/src/app/connect/components/format-configuration/format-configuration.component.scss b/ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.scss
similarity index 100%
rename from ui/src/app/connect/components/format-configuration/format-configuration.component.scss
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.scss
diff --git a/ui/src/app/connect/components/format-configuration/format-configuration.component.ts b/ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.ts
similarity index 98%
rename from ui/src/app/connect/components/format-configuration/format-configuration.component.ts
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.ts
index 87a8c7c17..b1296510b 100644
--- a/ui/src/app/connect/components/format-configuration/format-configuration.component.ts
+++ b/ui/src/app/connect/components/new-adapter/format-configuration/format-configuration.component.ts
@@ -24,7 +24,7 @@ import {
GenericAdapterStreamDescription
} from '@streampipes/platform-services';
import { FormBuilder, FormGroup } from '@angular/forms';
-import { RestService } from '../../services/rest.service';
+import { RestService } from '../../../services/rest.service';
import { MatStepper } from '@angular/material/stepper';
@Component({
diff --git a/ui/src/app/connect/components/format-item-json/format-item-json.component.html b/ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.html
similarity index 100%
rename from ui/src/app/connect/components/format-item-json/format-item-json.component.html
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.html
diff --git a/ui/src/app/connect/components/format-item-json/format-item-json.component.scss b/ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.scss
similarity index 100%
rename from ui/src/app/connect/components/format-item-json/format-item-json.component.scss
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.scss
diff --git a/ui/src/app/connect/components/format-item-json/format-item-json.component.ts b/ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.ts
similarity index 100%
rename from ui/src/app/connect/components/format-item-json/format-item-json.component.ts
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item-json/format-item-json.component.ts
diff --git a/ui/src/app/connect/components/format-item/format-item.component.html b/ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.html
similarity index 100%
rename from ui/src/app/connect/components/format-item/format-item.component.html
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.html
diff --git a/ui/src/app/connect/components/format-item/format-item.component.scss b/ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.scss
similarity index 100%
rename from ui/src/app/connect/components/format-item/format-item.component.scss
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.scss
diff --git a/ui/src/app/connect/components/format-item/format-item.component.ts b/ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.ts
similarity index 95%
rename from ui/src/app/connect/components/format-item/format-item.component.ts
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.ts
index 6d7db6059..77f2662a1 100644
--- a/ui/src/app/connect/components/format-item/format-item.component.ts
+++ b/ui/src/app/connect/components/new-adapter/format-configuration/format-item/format-item.component.ts
@@ -17,7 +17,7 @@
*/
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ShepherdService } from '../../../services/tour/shepherd.service';
+import { ShepherdService } from '../../../../../services/tour/shepherd.service';
import { FormatDescription } from '@streampipes/platform-services';
@Component({
diff --git a/ui/src/app/connect/components/format-list/format-list.component.html b/ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.html
similarity index 100%
rename from ui/src/app/connect/components/format-list/format-list.component.html
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.html
diff --git a/ui/src/app/connect/components/format-list/format-list.component.scss b/ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.scss
similarity index 100%
rename from ui/src/app/connect/components/format-list/format-list.component.scss
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.scss
diff --git a/ui/src/app/connect/components/format-list/format-list.component.ts b/ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.ts
similarity index 97%
rename from ui/src/app/connect/components/format-list/format-list.component.ts
rename to ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.ts
index bcc1afd68..65d18a4b7 100644
--- a/ui/src/app/connect/components/format-list/format-list.component.ts
+++ b/ui/src/app/connect/components/new-adapter/format-configuration/format-list/format-list.component.ts
@@ -18,7 +18,7 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { FormatDescription } from '@streampipes/platform-services';
-import { RestService } from '../../services/rest.service';
+import { RestService } from '../../../../services/rest.service';
@Component({
selector: 'sp-format-list',
diff --git a/ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.html b/ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.html
similarity index 100%
rename from ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.html
rename to ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.html
diff --git a/ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.scss b/ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.scss
similarity index 100%
rename from ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.scss
rename to ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.scss
diff --git a/ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.ts b/ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.ts
similarity index 100%
rename from ui/src/app/connect/components/generic-adapter-configuration/generic-adapter-configuration.component.ts
rename to ui/src/app/connect/components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component.ts
diff --git a/ui/src/app/connect/components/new-adapter/new-adapter.component.ts b/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
index cfdb080ff..dc8a1d8cc 100644
--- a/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
+++ b/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
@@ -41,7 +41,7 @@ import { ShepherdService } from '../../../services/tour/shepherd.service';
import { ConnectService } from '../../services/connect.service';
import { ConfigurationInfo } from '../../model/ConfigurationInfo';
import { RestService } from '../../services/rest.service';
-import { EventSchemaComponent } from '../schema-editor/event-schema/event-schema.component';
+import { EventSchemaComponent } from './schema-editor/event-schema/event-schema.component';
import { TransformationRuleService } from '../../services/transformation-rule.service';
import { IconService } from '../../services/icon.service';
import { ActivatedRoute, Router } from '@angular/router';
diff --git a/ui/src/app/connect/components/schema-editor/error-message/error-message.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/error-message/error-message.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.html
diff --git a/ui/src/app/connect/components/schema-editor/error-message/error-message.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/error-message/error-message.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/error-message/error-message.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.ts
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/error-message/error-message.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/error-message/error-message.component.ts
diff --git a/ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.html
diff --git a/ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.ts
similarity index 98%
rename from ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.ts
index 4186a367e..514d79e81 100644
--- a/ui/src/app/connect/components/schema-editor/event-property-row/event-property-row.component.ts
+++ b/ui/src/app/connect/components/new-adapter/schema-editor/event-property-row/event-property-row.component.ts
@@ -28,7 +28,7 @@ import {
EventPropertyUnion,
EventSchema
} from '@streampipes/platform-services';
-import { EditEventPropertyComponent } from '../../../dialog/edit-event-property/edit-event-property.component';
+import { EditEventPropertyComponent } from '../../../../dialog/edit-event-property/edit-event-property.component';
@Component({
selector: 'event-property-row',
diff --git a/ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.html
diff --git a/ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.ts
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-schema-preview/event-schema-preview.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component.ts
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.html
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.ts
similarity index 97%
rename from ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.ts
index 8cf453f9e..9a1c89cee 100644
--- a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts
+++ b/ui/src/app/connect/components/new-adapter/schema-editor/event-schema/event-schema.component.ts
@@ -17,10 +17,10 @@
*/
import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewChild } from '@angular/core';
-import { RestService } from '../../../services/rest.service';
+import { RestService } from '../../../../services/rest.service';
import { ITreeOptions, TreeComponent } from '@circlon/angular-tree-component';
import { UUID } from 'angular2-uuid';
-import { DataTypesService } from '../../../services/data-type.service';
+import { DataTypesService } from '../../../../services/data-type.service';
import {
AdapterDescription,
EventProperty,
@@ -31,7 +31,7 @@ import {
Notification
} from '@streampipes/platform-services';
import { MatStepper } from '@angular/material/stepper';
-import { UserErrorMessage } from '../../../../core-model/base/UserErrorMessage';
+import { UserErrorMessage } from '../../../../../core-model/base/UserErrorMessage';
@Component({
selector: 'sp-event-schema',
diff --git a/ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.html
diff --git a/ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.ts
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/loading-message/loading-message.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/loading-message/loading-message.component.ts
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.html b/ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.html
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.html
rename to ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.html
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.scss b/ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.scss
similarity index 100%
rename from ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.scss
rename to ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.scss
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts b/ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.ts
similarity index 96%
rename from ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts
rename to ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.ts
index 1b757bacb..b4011383b 100644
--- a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts
+++ b/ui/src/app/connect/components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component.ts
@@ -17,7 +17,7 @@
*/
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { UserErrorMessage } from '../../../../core-model/base/UserErrorMessage';
+import { UserErrorMessage } from '../../../../../core-model/base/UserErrorMessage';
@Component({
selector: 'sp-schema-editor-header',
diff --git a/ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.html b/ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.html
similarity index 100%
rename from ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.html
rename to ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.html
diff --git a/ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.scss b/ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.scss
similarity index 100%
rename from ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.scss
rename to ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.scss
diff --git a/ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.ts b/ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.ts
similarity index 100%
rename from ui/src/app/connect/components/specific-adapter-configuration/specific-adapter-configuration.component.ts
rename to ui/src/app/connect/components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component.ts
diff --git a/ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.html b/ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.html
similarity index 100%
rename from ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.html
rename to ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.html
diff --git a/ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.scss b/ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.scss
similarity index 100%
rename from ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.scss
rename to ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.scss
diff --git a/ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.ts b/ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.ts
similarity index 94%
rename from ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.ts
rename to ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.ts
index 5c59ac060..c694cb1ac 100644
--- a/ui/src/app/connect/components/start-adapter-configuration/start-adapter-configuration.component.ts
+++ b/ui/src/app/connect/components/new-adapter/start-adapter-configuration/start-adapter-configuration.component.ts
@@ -28,11 +28,11 @@ import {
} from '@streampipes/platform-services';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { MatStepper } from '@angular/material/stepper';
-import { AdapterStartedDialog } from '../../dialog/adapter-started/adapter-started-dialog.component';
+import { AdapterStartedDialog } from '../../../dialog/adapter-started/adapter-started-dialog.component';
import { PanelType, DialogService } from '@streampipes/shared-ui';
-import { ShepherdService } from '../../../services/tour/shepherd.service';
-import { ConnectService } from '../../services/connect.service';
-import { TimestampPipe } from '../../filter/timestamp.pipe';
+import { ShepherdService } from '../../../../services/tour/shepherd.service';
+import { ConnectService } from '../../../services/connect.service';
+import { TimestampPipe } from '../../../filter/timestamp.pipe';
import { MatCheckboxChange } from '@angular/material/checkbox';
@Component({
diff --git a/ui/src/app/connect/connect.module.ts b/ui/src/app/connect/connect.module.ts
index d95ec367d..8726839d8 100644
--- a/ui/src/app/connect/connect.module.ts
+++ b/ui/src/app/connect/connect.module.ts
@@ -28,7 +28,7 @@ import { ConnectComponent } from './connect.component';
import { NewAdapterComponent } from './components/new-adapter/new-adapter.component';
import { EditEventPropertyPrimitiveComponent } from './dialog/edit-event-property/components/edit-event-property-primitive/edit-event-property-primitive.component';
-import { EventSchemaComponent } from './components/schema-editor/event-schema/event-schema.component';
+import { EventSchemaComponent } from './components/new-adapter/schema-editor/event-schema/event-schema.component';
import { CustomMaterialModule } from '../CustomMaterial/custom-material.module';
@@ -43,8 +43,8 @@ import { ConnectService } from './services/connect.service';
import { AdapterDescriptionComponent } from './components/data-marketplace/adapter-description/adapter-description.component';
import { DataMarketplaceComponent } from './components/data-marketplace/data-marketplace.component';
import { DataMarketplaceService } from './services/data-marketplace.service';
-import { FormatItemComponent } from './components/format-item/format-item.component';
-import { FormatListComponent } from './components/format-list/format-list.component';
+import { FormatItemComponent } from './components/new-adapter/format-configuration/format-item/format-item.component';
+import { FormatListComponent } from './components/new-adapter/format-configuration/format-list/format-list.component';
import { IconService } from './services/icon.service';
import { UnitProviderService } from './services/unit-provider.service';
@@ -63,24 +63,24 @@ import { EditTimestampPropertyComponent } from './dialog/edit-event-property/com
import { EditUnitTransformationComponent } from './dialog/edit-event-property/components/edit-unit-transformation/edit-unit-transformation.component';
import { EditEventPropertyComponent } from './dialog/edit-event-property/edit-event-property.component';
import { PipelineElementRuntimeInfoComponent } from './components/runtime-info/pipeline-element-runtime-info.component';
-import { EventPropertyRowComponent } from './components/schema-editor/event-property-row/event-property-row.component';
-import { EventSchemaPreviewComponent } from './components/schema-editor/event-schema-preview/event-schema-preview.component';
+import { EventPropertyRowComponent } from './components/new-adapter/schema-editor/event-property-row/event-property-row.component';
+import { EventSchemaPreviewComponent } from './components/new-adapter/schema-editor/event-schema-preview/event-schema-preview.component';
import { CoreUiModule } from '../core-ui/core-ui.module';
// tslint:disable-next-line:max-line-length
import { EditCorrectionValueComponent } from './dialog/edit-event-property/components/edit-correction-value/edit-correction-value.component';
import { ExistingAdaptersComponent } from './components/existing-adapters/existing-adapters.component';
// tslint:disable-next-line:max-line-length
-import { SpecificAdapterConfigurationComponent } from './components/specific-adapter-configuration/specific-adapter-configuration.component';
+import { SpecificAdapterConfigurationComponent } from './components/new-adapter/specific-adapter-configuration/specific-adapter-configuration.component';
import { ConfigurationGroupComponent } from './components/configuration-group/configuration-group.component';
-import { FormatConfigurationComponent } from './components/format-configuration/format-configuration.component';
-import { GenericAdapterConfigurationComponent } from './components/generic-adapter-configuration/generic-adapter-configuration.component';
-import { ErrorMessageComponent } from './components/schema-editor/error-message/error-message.component';
-import { LoadingMessageComponent } from './components/schema-editor/loading-message/loading-message.component';
-import { SchemaEditorHeaderComponent } from './components/schema-editor/schema-editor-header/schema-editor-header.component';
-import { StartAdapterConfigurationComponent } from './components/start-adapter-configuration/start-adapter-configuration.component';
+import { FormatConfigurationComponent } from './components/new-adapter/format-configuration/format-configuration.component';
+import { GenericAdapterConfigurationComponent } from './components/new-adapter/generic-adapter-configuration/generic-adapter-configuration.component';
+import { ErrorMessageComponent } from './components/new-adapter/schema-editor/error-message/error-message.component';
+import { LoadingMessageComponent } from './components/new-adapter/schema-editor/loading-message/loading-message.component';
+import { SchemaEditorHeaderComponent } from './components/new-adapter/schema-editor/schema-editor-header/schema-editor-header.component';
+import { StartAdapterConfigurationComponent } from './components/new-adapter/start-adapter-configuration/start-adapter-configuration.component';
import { DeleteAdapterDialogComponent } from './dialog/delete-adapter-dialog/delete-adapter-dialog.component';
import { PlatformServicesModule } from '@streampipes/platform-services';
-import { FormatItemJsonComponent } from './components/format-item-json/format-item-json.component';
+import { FormatItemJsonComponent } from './components/new-adapter/format-configuration/format-item-json/format-item-json.component';
import { RouterModule } from '@angular/router';
import { SharedUiModule } from '@streampipes/shared-ui';
import {
[incubator-streampipes] 01/04: [STREAMPIPES-558] Modify navigation flow of Connect module
Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch STREAMPIPES-558
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit 2a68ddda6b03fc308aec9c92dae4a1f826501765
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Fri Jul 8 22:44:54 2022 +0200
[STREAMPIPES-558] Modify navigation flow of Connect module
---
ui/deployment/modules.yml | 2 +-
.../data-marketplace.component.html | 105 ++++----------
.../data-marketplace/data-marketplace.component.ts | 64 +++-----
.../existing-adapters.component.html | 146 -------------------
.../existing-adapters.component.html | 154 ++++++++++++++++++++
.../existing-adapters.component.scss | 0
.../existing-adapters.component.ts | 44 +++---
.../filter-toolbar/filter-toolbar.component.html | 31 ++++
.../filter-toolbar/filter-toolbar.component.scss | 0
.../filter-toolbar/filter-toolbar.component.ts | 42 ++++++
.../new-adapter/new-adapter.component.html | 139 +++++++++---------
.../new-adapter/new-adapter.component.ts | 107 ++++++++------
ui/src/app/connect/connect.module.ts | 161 ++++++++++++---------
13 files changed, 532 insertions(+), 463 deletions(-)
diff --git a/ui/deployment/modules.yml b/ui/deployment/modules.yml
index a02603d6c..f12f05d4f 100644
--- a/ui/deployment/modules.yml
+++ b/ui/deployment/modules.yml
@@ -28,7 +28,7 @@ spEditor:
admin: false
pageNames: 'PageName.PIPELINE_EDITOR'
spConnect:
- componentImport: True
+ componentImport: False
ng5_moduleName: 'ConnectModule'
ng5_component: 'ConnectComponent'
ng5_componentPath: './connect/connect.component'
diff --git a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
index 07e0171dc..cd37e8489 100644
--- a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
+++ b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.html
@@ -16,17 +16,9 @@
~
-->
-<div fxLayout="column" fxFlex="100" class="page-container page-container-padding page-container-connect">
- <div fxLayout="row" style="padding:0px;" class="sp-tab-bg">
- <div fxLayout="fill" class="page-container-nav">
- <mat-tab-group [selectedIndex]="selectedIndex" (selectedIndexChange)="selectedIndexChange($event)"
- color="accent">
- <mat-tab label="Data Marketplace">
- </mat-tab>
- <mat-tab id="all-adapters" label="My Adapters">
- </mat-tab>
- </mat-tab-group>
- </div>
+<sp-basic-view showBackLink="true" [backLinkTarget]="['connect']" [padding]="true">
+
+ <div nav fxFlex="100">
<div fxFlex="100" fxLayout="row" fxLayoutAlign="end center"
style="padding-left:10px;padding-right:10px;font-size:14px;" class="page-container-nav"
*ngIf="selectedIndex === 0 && newAdapterFromDescription === undefined">
@@ -36,78 +28,39 @@
</button>
</div>
</div>
+ <div fxLayout="column" fxFlex="100">
- <div fxLayout="row" class="fixed-height data-marketplace-options">
-
- <div class="data-marketplace-options-item pl-5" style="margin-top:8px;" fxLayoutAlign="start center"
- fxLayout="row">
- <mat-icon color="accent">search</mat-icon>
- <mat-form-field class="form-style">
- <input matInput placeholder="Find Element" value="" (input)="updateFilterTerm($event.target.value)"
- name="something">
- </mat-form-field>
+ <div class="container-fluid marketplace-container" *ngIf="adapterLoadingError" fxFlex="100"
+ fxLayoutAlign="center center" fxLayout="row">
+ <h4>Available adapters could not be loaded. Did you start a Connect worker node?</h4>
</div>
- <div class="data-marketplace-options-item">
- <mat-form-field color="accent">
- <mat-select [(value)]="selectedType" (selectionChange)="filterAdapter($event)">
- <mat-option *ngFor="let type of adapterTypes" [value]="type">
- {{type}}
- </mat-option>
- </mat-select>
- </mat-form-field>
+ <div class="container-fluid marketplace-container" *ngIf="adaptersLoading" fxFlex="100"
+ fxLayoutAlign="center center" fxLayout="row">
+ <mat-spinner [mode]="'indeterminate'" [diameter]="20" color="accent"></mat-spinner>
+ <h4> Searching for available adapters, please wait...</h4>
</div>
- <div class="data-marketplace-options-item">
- <mat-form-field color="accent">
- <mat-select [(value)]="selectedCategory" (selectionChange)="filterAdapter($event)">
- <mat-option *ngFor="let category of adapterCategories" [value]="category.code">
- {{category.label}}
- </mat-option>
- </mat-select>
- </mat-form-field>
- </div>
- <span fxFlex></span>
-
- </div>
- <div class="container-fluid marketplace-container" *ngIf="adapterLoadingError" fxFlex="100"
- fxLayoutAlign="center center" fxLayout="row">
- <h4>Available adapters could not be loaded. Did you start a Connect worker node?</h4>
- </div>
- <div class="container-fluid marketplace-container" *ngIf="adaptersLoading" fxFlex="100"
- fxLayoutAlign="center center" fxLayout="row">
- <mat-spinner [mode]="'indeterminate'" [diameter]="20" color="accent"></mat-spinner>
- <h4> Searching for available adapters, please wait...</h4>
- </div>
- <div class="container-fluid marketplace-container" *ngIf="!adaptersLoading && !adapterLoadingError">
- <div *ngIf="selectedIndex === 0">
-
- <div *ngIf="newAdapterFromDescription===undefined" fxLayout="row wrap" fxLayoutAlign="start stretch"
- class="adapter-description-container">
- <sp-adapter-description attr.id="{{adapterDescription.name.replaceAll(' ', '_')}}"
- class="adapter-description"
- fxFlex="33" (click)="selectAdapter(adapterDescription)"
- *ngFor="let adapterDescription of filteredAdapterDescriptions | filter:filterTerm"
- [adapter]="adapterDescription"
- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-adapter-description>
- </div>
+ <div class="container-fluid marketplace-container" *ngIf="!adaptersLoading && !adapterLoadingError">
+ <div *ngIf="selectedIndex === 0">
+ <div *ngIf="newAdapterFromDescription===undefined" fxLayout="row wrap" fxLayoutAlign="start stretch"
+ class="adapter-description-container">
+ <sp-adapter-description attr.id="{{adapterDescription.name.replaceAll(' ', '_')}}"
+ class="adapter-description"
+ fxFlex="33" (click)="selectAdapter(adapterDescription.appId)"
+ *ngFor="let adapterDescription of filteredAdapterDescriptions | filter:filterTerm"
+ [adapter]="adapterDescription"
+ (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-adapter-description>
+ </div>
- <div class="new-adapter-container" fxFlex="100" fxLayout="row" fxLayoutAlign="start start"
- *ngIf="newAdapterFromDescription!==undefined">
- <sp-new-adapter fxFlex="100" (removeSelectionEmitter)="removeSelection($event)"
- [adapter]="newAdapterFromDescription"
- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-new-adapter>
- </div>
- </div>
- <div *ngIf="selectedIndex === 1">
- <div fxFlex="100" class="adapter-container">
- <sp-existing-adapters [existingAdapters]="filteredAdapters"
- [filterTerm]="filterTerm"
- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"
- (createTemplateEmitter)="templateFromRunningAdapter($event)">
+<!-- <div class="new-adapter-container" fxFlex="100" fxLayout="row" fxLayoutAlign="start start"-->
+<!-- *ngIf="newAdapterFromDescription!==undefined">-->
+<!-- <sp-new-adapter fxFlex="100" (removeSelectionEmitter)="removeSelection($event)"-->
+<!-- [adapter]="newAdapterFromDescription"-->
+<!-- (updateAdapterEmitter)="updateDescriptionsAndRunningAdatpers()"></sp-new-adapter>-->
+<!-- </div>-->
- </sp-existing-adapters>
</div>
</div>
</div>
-</div>
+</sp-basic-view>
diff --git a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
index a49adcd4f..95e454535 100644
--- a/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
+++ b/ui/src/app/connect/components/data-marketplace/data-marketplace.component.ts
@@ -23,6 +23,7 @@ import { ConnectService } from '../../services/connect.service';
import { FilterPipe } from '../../filter/filter.pipe';
import { AdapterDescriptionUnion } from '@streampipes/platform-services';
import { DialogService } from '@streampipes/shared-ui';
+import { Router } from '@angular/router';
@Component({
selector: 'sp-data-marketplace',
@@ -43,11 +44,7 @@ export class DataMarketplaceComponent implements OnInit {
selectedIndex = 0;
filterTerm = '';
pipe: FilterPipe = new FilterPipe();
- adapterTypes: string[] = ['All types', 'Data Set', 'Data Stream'];
- selectedType = 'All types';
- adapterCategories: any;
- selectedCategory: any = 'All';
adaptersLoading = true;
adapterLoadingError = false;
@@ -55,25 +52,17 @@ export class DataMarketplaceComponent implements OnInit {
constructor(private dataMarketplaceService: DataMarketplaceService,
private shepherdService: ShepherdService,
private connectService: ConnectService,
- private dialogService: DialogService) {
+ private dialogService: DialogService,
+ private router: Router) {
}
ngOnInit() {
this.updateDescriptionsAndRunningAdatpers();
- this.loadAvailableTypeCategories();
this.visibleAdapters = this.adapters;
}
- loadAvailableTypeCategories() {
- this.dataMarketplaceService.getAdapterCategories().subscribe(res => {
- this.adapterCategories = res;
- this.adapterCategories.unshift({ label: 'All categories', description: '', code: 'All' });
- });
- }
-
updateDescriptionsAndRunningAdatpers() {
this.getAdapterDescriptions();
- this.getAdaptersRunning();
}
getAdapterDescriptions(): void {
@@ -96,12 +85,7 @@ export class DataMarketplaceComponent implements OnInit {
});
}
- getAdaptersRunning(): void {
- this.dataMarketplaceService.getAdapters().subscribe(adapters => {
- this.adapters = adapters;
- this.filteredAdapters = this.adapters;
- });
- }
+
selectedIndexChange(index: number) {
this.selectedIndex = index;
@@ -119,20 +103,16 @@ export class DataMarketplaceComponent implements OnInit {
this.shepherdService.startAdapterTour3();
}
- selectAdapter(adapterDescription: AdapterDescriptionUnion) {
- this.newAdapterFromDescription = this.dataMarketplaceService.cloneAdapterDescription(adapterDescription);
- (this.newAdapterFromDescription as any).templateTitle = this.newAdapterFromDescription.name;
- this.newAdapterFromDescription.name = '';
- this.newAdapterFromDescription.description = '';
-
- this.shepherdService.trigger('select-adapter');
+ selectAdapter(appId: string) {
+ this.router.navigate(['connect', 'create', appId]);
+ // this.shepherdService.trigger('select-adapter');
}
templateFromRunningAdapter(adapter: AdapterDescriptionUnion) {
adapter.elementId = undefined;
adapter._rev = undefined;
this.selectedIndexChange(0);
- this.selectAdapter(adapter);
+ //this.selectAdapter(adapter);
}
@@ -156,21 +136,25 @@ export class DataMarketplaceComponent implements OnInit {
}
filterAdapterCategory(currentElements: AdapterDescriptionUnion[]): AdapterDescriptionUnion[] {
- if (this.selectedCategory === this.adapterCategories[0].code) {
- return currentElements;
- } else {
- return currentElements.filter(adapterDescription => adapterDescription.category.indexOf(this.selectedCategory) !== -1);
- }
+ // TODO
+ // if (this.selectedCategory === this.adapterCategories[0].code) {
+ // return currentElements;
+ // } else {
+ // return currentElements.filter(adapterDescription => adapterDescription.category.indexOf(this.selectedCategory) !== -1);
+ // }
+ return [];
}
filterAdapterType(currentElements: AdapterDescriptionUnion[]): AdapterDescriptionUnion[] {
- if (this.selectedType === this.adapterTypes[0]) {
- return currentElements;
- } else if (this.selectedType === this.adapterTypes[1]) {
- return currentElements.filter(adapterDescription => this.connectService.isDataSetDescription(adapterDescription));
- } else if (this.selectedType === this.adapterTypes[2]) {
- return currentElements.filter(adapterDescription => !this.connectService.isDataSetDescription(adapterDescription));
- }
+ // TODO
+ // if (this.selectedType === this.adapterTypes[0]) {
+ // return currentElements;
+ // } else if (this.selectedType === this.adapterTypes[1]) {
+ // return currentElements.filter(adapterDescription => this.connectService.isDataSetDescription(adapterDescription));
+ // } else if (this.selectedType === this.adapterTypes[2]) {
+ // return currentElements.filter(adapterDescription => !this.connectService.isDataSetDescription(adapterDescription));
+ // }
+ return [];
}
}
diff --git a/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.html b/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.html
deleted file mode 100644
index d1ee145a8..000000000
--- a/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.html
+++ /dev/null
@@ -1,146 +0,0 @@
-<!--
- ~ Licensed to the Apache Software Foundation (ASF) under one or more
- ~ contributor license agreements. See the NOTICE file distributed with
- ~ this work for additional information regarding copyright ownership.
- ~ The ASF licenses this file to You under the Apache License, Version 2.0
- ~ (the "License"); you may not use this file except in compliance with
- ~ the License. You may obtain a copy of the License at
- ~
- ~ http://www.apache.org/licenses/LICENSE-2.0
- ~
- ~ Unless required by applicable law or agreed to in writing, software
- ~ distributed under the License is distributed on an "AS IS" BASIS,
- ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- ~ See the License for the specific language governing permissions and
- ~ limitations under the License.
- ~
- -->
-
-<div fxFlex="100" fxLayout="column">
- <div class="assemblyOptions sp-blue-bg mt-20" style="padding:5px;">
- <div fxLayout="row" fxLayoutAlign="start center">
- <h4>My adapters</h4>
- <span fxFlex></span>
- <button mat-button mat-icon-button matTooltip="Refresh adapters" matTooltipPosition="above"
- (click)="updateAdapterEmitter.emit()">
- <i class="material-icons">
- refresh
- </i>
- </button>
- </div>
- </div>
- <div class="sp-blue-border">
- <table fxFlex="100" mat-table [dataSource]="dataSource" style="width: 100%;" matSort>
- <ng-container matColumnDef="start">
- <th mat-header-cell *matHeaderCellDef> Start</th>
- <td mat-cell *matCellDef="let adapter">
- <button color="accent" mat-button mat-icon-button matTooltip="Start adapter"
- matTooltipPosition="above"
- (click)="startAdapter(adapter)"
- *ngIf="(connectService.isDataStreamDescription(adapter)) && !adapter.running">
- <i class="material-icons">play_arrow</i>
- </button>
- <button color="accent" mat-button mat-icon-button matTooltip="Stop adapter"
- matTooltipPosition="above"
- (click)="stopAdapter(adapter)"
- *ngIf="(connectService.isDataStreamDescription(adapter)) && adapter.running">
- <i class="material-icons">stop</i>
- </button>
- </td>
- </ng-container>
-
- <ng-container matColumnDef="name">
- <th mat-header-cell mat-sort-header *matHeaderCellDef> Name</th>
- <td mat-cell *matCellDef="let adapter">
- <h4 style="margin-bottom:0px;">{{adapter.name}}</h4>
- <h5>{{adapter.description != '' ? adapter.description : '-'}}</h5>
- </td>
- </ng-container>
- <ng-container matColumnDef="adapterBase">
- <th mat-header-cell *matHeaderCellDef> Adapter</th>
- <td mat-cell *matCellDef="let adapter">
- <img *ngIf="getIconUrl(adapter) && !adapter.icon" [src]="getIconUrl(adapter)" class="adapter-icon"/>
- <img *ngIf="adapter.icon" [src]="adapter.icon" class="adapter-icon"/>
- </td>
- </ng-container>
- <ng-container matColumnDef="adapterType">
- <th mat-header-cell *matHeaderCellDef> Type</th>
- <td mat-cell *matCellDef="let adapter">
- <div class="type-data" fxLayout="row" fxLayoutAlign="start start">
- <div fxLayout="row" fxLayoutAlign="center center">
- <mat-icon *ngIf="connectService.isDataSetDescription(adapter)" class="historic">lens
- </mat-icon>
- <mat-icon *ngIf="connectService.isDataStreamDescription(adapter)" class="real-time">lens
- </mat-icon>
- <div fxFlex="100" fxLayoutAlign="center center">
- <span *ngIf="connectService.isDataSetDescription(adapter)"> Data Set</span>
- <span *ngIf="connectService.isDataStreamDescription(adapter)"> Data Stream</span>
- </div>
- </div>
- </div>
- </td>
- </ng-container>
- <ng-container matColumnDef="lastModified">
- <th mat-header-cell *matHeaderCellDef> Created</th>
- <td mat-cell *matCellDef="let adapter">
- <h5>{{adapter.createdAt | date:'dd.MM.yyyy HH:mm'}}</h5>
- </td>
- </ng-container>
-
- <ng-container matColumnDef="action">
- <th mat-header-cell *matHeaderCellDef> Action</th>
- <td mat-cell *matCellDef="let adapter">
- <div fxLayout="row">
- <!-- <span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">-->
- <!-- <button color="primary" mat-button mat-icon-button matTooltip="Show adapter"-->
- <!-- matTooltipPosition="above"><i-->
- <!-- class="material-icons">search</i>-->
- <!-- </button>-->
- <!-- </span>-->
- <!-- <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">-->
- <!-- <button color="primary" mat-button mat-icon-button matTooltip="Modify adapter"-->
- <!-- matTooltipPosition="above"-->
- <!-- [disabled]="adapter.running">-->
- <!-- <i class="material-icons">mode_edit</i>-->
- <!-- </button>-->
- <!-- </span>-->
- <span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">
- <button color="accent" mat-button mat-icon-button matTooltip="Show info"
- matTooltipPosition="above" (click)="openHelpDialog(adapter)"><i
- class="material-icons">help_outline</i>
- </button>
- </span>
- <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">
- <button color="accent" mat-button mat-icon-button matTooltip="Create adapter template"
- matTooltipPosition="above" (click)="createTemplate(adapter)"><i
- class="material-icons">content_copy</i>
- </button>
- </span>
- <span fxFlex fxFlexOrder="3" fxLayout="row" fxLayoutAlign="center center" *ngIf="isAdmin">
- <button color="accent" mat-button mat-icon-button matTooltip="Manage permissions"
- matTooltipPosition="above" (click)="showPermissionsDialog(adapter)"><i
- class="material-icons">share</i>
- </button>
- </span>
- <span fxFlex fxFlexOrder="4" fxLayout="row" fxLayoutAlign="center center">
- <button color="accent" mat-button mat-icon-button matTooltip="Delete adapter"
- data-cy="delete" matTooltipPosition="above" (click)="deleteAdapter(adapter)">
- <i class="material-icons">delete</i>
- </button>
- </span>
- </div>
- </td>
- </ng-container>
-
- <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
- <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-
- </table>
- </div>
- <div fxFlex="100" fxLayoutAlign="end end">
- <mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" [pageSize]="20"></mat-paginator>
- </div>
- <div fxFlex="100" fxLayout="column" fxLayoutAlign="center center" *ngIf="existingAdapters.length == 0">
- <h5>(no adapters available)</h5>
- </div>
-</div>
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
new file mode 100644
index 000000000..8ee8694a0
--- /dev/null
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
@@ -0,0 +1,154 @@
+<!--
+ ~ Licensed to the Apache Software Foundation (ASF) under one or more
+ ~ contributor license agreements. See the NOTICE file distributed with
+ ~ this work for additional information regarding copyright ownership.
+ ~ The ASF licenses this file to You under the Apache License, Version 2.0
+ ~ (the "License"); you may not use this file except in compliance with
+ ~ the License. You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ ~
+ -->
+<sp-basic-view [showBackLink]="false" padding="0">
+
+ <div nav fxFlex="100" fxLayoutAlign="start center" fxLayout="row" class="pl-10">
+ <button mat-button mat-raised-button color="accent" (click)="createNewAdapter()">
+ <i class="material-icons">add</i> New adapter
+ </button>
+ </div>
+ <div fxFlex="100" fxLayout="column">
+ <div class="assemblyOptions sp-blue-bg mt-20" style="padding:5px;">
+ <div fxLayout="row" fxLayoutAlign="start center">
+ <h4>My adapters</h4>
+ <span fxFlex></span>
+ <button mat-button mat-icon-button matTooltip="Refresh adapters" matTooltipPosition="above"
+ (click)="updateAdapterEmitter.emit()">
+ <i class="material-icons">
+ refresh
+ </i>
+ </button>
+ </div>
+ </div>
+ <div class="sp-blue-border">
+ <table fxFlex="100" mat-table [dataSource]="dataSource" style="width: 100%;" matSort>
+ <ng-container matColumnDef="start">
+ <th mat-header-cell *matHeaderCellDef> Start</th>
+ <td mat-cell *matCellDef="let adapter">
+ <button color="accent" mat-button mat-icon-button matTooltip="Start adapter"
+ matTooltipPosition="above"
+ (click)="startAdapter(adapter)"
+ *ngIf="(connectService.isDataStreamDescription(adapter)) && !adapter.running">
+ <i class="material-icons">play_arrow</i>
+ </button>
+ <button color="accent" mat-button mat-icon-button matTooltip="Stop adapter"
+ matTooltipPosition="above"
+ (click)="stopAdapter(adapter)"
+ *ngIf="(connectService.isDataStreamDescription(adapter)) && adapter.running">
+ <i class="material-icons">stop</i>
+ </button>
+ </td>
+ </ng-container>
+
+ <ng-container matColumnDef="name">
+ <th mat-header-cell mat-sort-header *matHeaderCellDef> Name</th>
+ <td mat-cell *matCellDef="let adapter">
+ <h4 style="margin-bottom:0px;">{{adapter.name}}</h4>
+ <h5>{{adapter.description != '' ? adapter.description : '-'}}</h5>
+ </td>
+ </ng-container>
+ <ng-container matColumnDef="adapterBase">
+ <th mat-header-cell *matHeaderCellDef> Adapter</th>
+ <td mat-cell *matCellDef="let adapter">
+ <img *ngIf="getIconUrl(adapter) && !adapter.icon" [src]="getIconUrl(adapter)"
+ class="adapter-icon"/>
+ <img *ngIf="adapter.icon" [src]="adapter.icon" class="adapter-icon"/>
+ </td>
+ </ng-container>
+ <ng-container matColumnDef="adapterType">
+ <th mat-header-cell *matHeaderCellDef> Type</th>
+ <td mat-cell *matCellDef="let adapter">
+ <div class="type-data" fxLayout="row" fxLayoutAlign="start start">
+ <div fxLayout="row" fxLayoutAlign="center center">
+ <mat-icon *ngIf="connectService.isDataSetDescription(adapter)" class="historic">lens
+ </mat-icon>
+ <mat-icon *ngIf="connectService.isDataStreamDescription(adapter)" class="real-time">lens
+ </mat-icon>
+ <div fxFlex="100" fxLayoutAlign="center center">
+ <span *ngIf="connectService.isDataSetDescription(adapter)"> Data Set</span>
+ <span *ngIf="connectService.isDataStreamDescription(adapter)"> Data Stream</span>
+ </div>
+ </div>
+ </div>
+ </td>
+ </ng-container>
+ <ng-container matColumnDef="lastModified">
+ <th mat-header-cell *matHeaderCellDef> Created</th>
+ <td mat-cell *matCellDef="let adapter">
+ <h5>{{adapter.createdAt | date:'dd.MM.yyyy HH:mm'}}</h5>
+ </td>
+ </ng-container>
+
+ <ng-container matColumnDef="action">
+ <th mat-header-cell *matHeaderCellDef> Action</th>
+ <td mat-cell *matCellDef="let adapter">
+ <div fxLayout="row">
+ <!-- <span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">-->
+ <!-- <button color="primary" mat-button mat-icon-button matTooltip="Show adapter"-->
+ <!-- matTooltipPosition="above"><i-->
+ <!-- class="material-icons">search</i>-->
+ <!-- </button>-->
+ <!-- </span>-->
+ <!-- <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">-->
+ <!-- <button color="primary" mat-button mat-icon-button matTooltip="Modify adapter"-->
+ <!-- matTooltipPosition="above"-->
+ <!-- [disabled]="adapter.running">-->
+ <!-- <i class="material-icons">mode_edit</i>-->
+ <!-- </button>-->
+ <!-- </span>-->
+ <span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">
+ <button color="accent" mat-button mat-icon-button matTooltip="Show info"
+ matTooltipPosition="above" (click)="openHelpDialog(adapter)"><i
+ class="material-icons">help_outline</i>
+ </button>
+ </span>
+ <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">
+ <button color="accent" mat-button mat-icon-button matTooltip="Create adapter template"
+ matTooltipPosition="above" (click)="createTemplate(adapter)"><i
+ class="material-icons">content_copy</i>
+ </button>
+ </span>
+ <span fxFlex fxFlexOrder="3" fxLayout="row" fxLayoutAlign="center center" *ngIf="isAdmin">
+ <button color="accent" mat-button mat-icon-button matTooltip="Manage permissions"
+ matTooltipPosition="above" (click)="showPermissionsDialog(adapter)"><i
+ class="material-icons">share</i>
+ </button>
+ </span>
+ <span fxFlex fxFlexOrder="4" fxLayout="row" fxLayoutAlign="center center">
+ <button color="accent" mat-button mat-icon-button matTooltip="Delete adapter"
+ data-cy="delete" matTooltipPosition="above" (click)="deleteAdapter(adapter)">
+ <i class="material-icons">delete</i>
+ </button>
+ </span>
+ </div>
+ </td>
+ </ng-container>
+
+ <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+ <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+
+ </table>
+ </div>
+ <div fxFlex="100" fxLayoutAlign="end end">
+ <mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" [pageSize]="20"></mat-paginator>
+ </div>
+ <div fxFlex="100" fxLayout="column" fxLayoutAlign="center center" *ngIf="existingAdapters.length == 0">
+ <h5>(no adapters available)</h5>
+ </div>
+ </div>
+</sp-basic-view>
diff --git a/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.scss b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
similarity index 100%
rename from ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.scss
rename to ui/src/app/connect/components/existing-adapters/existing-adapters.component.scss
diff --git a/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.ts b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
similarity index 79%
rename from ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.ts
rename to ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
index 6b3f42eb0..53bc49661 100644
--- a/ui/src/app/connect/components/data-marketplace/existing-adapters/existing-adapters.component.ts
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
@@ -19,16 +19,17 @@
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { AdapterDescriptionUnion, PipelineElementService } from '@streampipes/platform-services';
import { MatTableDataSource } from '@angular/material/table';
-import { ConnectService } from '../../../services/connect.service';
-import { DataMarketplaceService } from '../../../services/data-marketplace.service';
+import { ConnectService } from '../../services/connect.service';
+import { DataMarketplaceService } from '../../services/data-marketplace.service';
import { DialogRef, PanelType, DialogService } from '@streampipes/shared-ui';
-import { DeleteAdapterDialogComponent } from '../../../dialog/delete-adapter-dialog/delete-adapter-dialog.component';
+import { DeleteAdapterDialogComponent } from '../../dialog/delete-adapter-dialog/delete-adapter-dialog.component';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
-import { ObjectPermissionDialogComponent } from '../../../../core-ui/object-permission-dialog/object-permission-dialog.component';
-import { UserRole } from '../../../../_enums/user-role.enum';
-import { AuthService } from '../../../../services/auth.service';
-import { HelpComponent } from '../../../../editor/dialog/help/help.component';
+import { ObjectPermissionDialogComponent } from '../../../core-ui/object-permission-dialog/object-permission-dialog.component';
+import { UserRole } from '../../../_enums/user-role.enum';
+import { AuthService } from '../../../services/auth.service';
+import { HelpComponent } from '../../../editor/dialog/help/help.component';
+import { Router } from '@angular/router';
@Component({
selector: 'sp-existing-adapters',
@@ -37,7 +38,7 @@ import { HelpComponent } from '../../../../editor/dialog/help/help.component';
})
export class ExistingAdaptersComponent implements OnInit {
- _existingAdapters: AdapterDescriptionUnion[];
+ existingAdapters: AdapterDescriptionUnion[] = [];
@Input()
filterTerm: string;
@@ -61,18 +62,15 @@ export class ExistingAdaptersComponent implements OnInit {
private dataMarketplaceService: DataMarketplaceService,
private dialogService: DialogService,
private authService: AuthService,
- private pipelineElementService: PipelineElementService) {
+ private pipelineElementService: PipelineElementService,
+ private router: Router) {
}
ngOnInit(): void {
this.authService.user$.subscribe(user => {
this.isAdmin = user.roles.indexOf(UserRole.ROLE_ADMIN) > -1;
- });
- this.dataSource = new MatTableDataSource(this.existingAdapters);
- setTimeout(() => {
- this.dataSource.paginator = this.paginator;
- this.dataSource.sort = this.sort;
+ this.getAdaptersRunning();
});
}
@@ -154,14 +152,20 @@ export class ExistingAdaptersComponent implements OnInit {
this.createTemplateEmitter.emit(adapter);
}
- @Input()
- set existingAdapters(adapters: AdapterDescriptionUnion[]) {
- this._existingAdapters = adapters;
- this.dataSource = new MatTableDataSource(adapters);
+ getAdaptersRunning(): void {
+ this.dataMarketplaceService.getAdapters().subscribe(adapters => {
+ this.existingAdapters = adapters;
+ this.dataSource = new MatTableDataSource(this.existingAdapters);
+ setTimeout(() => {
+ this.dataSource.paginator = this.paginator;
+ this.dataSource.sort = this.sort;
+ });
+ //this.filteredAdapters = this.existingAdapters;
+ });
}
- get existingAdapters(): AdapterDescriptionUnion[] {
- return this._existingAdapters;
+ createNewAdapter(): void {
+ this.router.navigate(['connect', 'create']);
}
}
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html
new file mode 100644
index 000000000..ce79d7fd7
--- /dev/null
+++ b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.html
@@ -0,0 +1,31 @@
+<div fxLayout="row" class="fixed-height data-marketplace-options">
+
+ <div class="data-marketplace-options-item pl-5" style="margin-top:8px;" fxLayoutAlign="start center"
+ fxLayout="row">
+ <mat-icon color="accent">search</mat-icon>
+ <mat-form-field class="form-style">
+ <input matInput placeholder="Find Element" value="" (input)="updateFilterTerm($event.target.value)"
+ name="something">
+ </mat-form-field>
+ </div>
+ <div class="data-marketplace-options-item">
+ <mat-form-field color="accent">
+ <mat-select [(value)]="selectedType" (selectionChange)="filterAdapter($event)">
+ <mat-option *ngFor="let type of adapterTypes" [value]="type">
+ {{type}}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
+ </div>
+ <div class="data-marketplace-options-item">
+ <mat-form-field color="accent">
+ <mat-select [(value)]="selectedCategory" (selectionChange)="filterAdapter($event)">
+ <mat-option *ngFor="let category of adapterCategories" [value]="category.code">
+ {{category.label}}
+ </mat-option>
+ </mat-select>
+ </mat-form-field>
+ </div>
+ <span fxFlex></span>
+
+</div>
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts
new file mode 100644
index 000000000..c8dd09a73
--- /dev/null
+++ b/ui/src/app/connect/components/filter-toolbar/filter-toolbar.component.ts
@@ -0,0 +1,42 @@
+import { Component, OnInit } from '@angular/core';
+import { DataMarketplaceService } from '../../services/data-marketplace.service';
+import { MatSelectChange } from '@angular/material/select';
+
+@Component({
+ selector: 'sp-connect-filter-toolbar',
+ templateUrl: './filter-toolbar.component.html',
+ styleUrls: ['./filter-toolbar.component.scss']
+})
+export class SpConnectFilterToolbarComponent implements OnInit {
+
+ adapterTypes: string[] = ['All types', 'Data Set', 'Data Stream'];
+ selectedType = 'All types';
+
+ adapterCategories: any;
+ selectedCategory: any = 'All';
+
+ constructor(private dataMarketplaceService: DataMarketplaceService) {
+
+ }
+
+ ngOnInit(): void {
+ this.loadAvailableTypeCategories();
+ }
+
+ loadAvailableTypeCategories() {
+ this.dataMarketplaceService.getAdapterCategories().subscribe(res => {
+ this.adapterCategories = res;
+ this.adapterCategories.unshift({ label: 'All categories', description: '', code: 'All' });
+ });
+ }
+
+ filterAdapter(event: MatSelectChange) {
+
+ }
+
+ updateFilterTerm(event: string) {
+
+ }
+
+
+}
diff --git a/ui/src/app/connect/components/new-adapter/new-adapter.component.html b/ui/src/app/connect/components/new-adapter/new-adapter.component.html
index c2777ee63..765d60e63 100644
--- a/ui/src/app/connect/components/new-adapter/new-adapter.component.html
+++ b/ui/src/app/connect/components/new-adapter/new-adapter.component.html
@@ -16,80 +16,83 @@
~
-->
-<div fxLayout="column" fxLayoutAlign="center stretch">
- <div fxLayout="column" fxFlex="100" class="p-10">
- <div fxLayout="row" fxLayoutAlign="start center">
- <mat-icon *ngIf="isDataSetDescription" class="historic">lens</mat-icon>
- <mat-icon *ngIf="isDataStreamDescription" class="real-time">lens
- </mat-icon>
- <div fxLayoutAlign="start center">
- <p *ngIf="isDataSetDescription">Data Set</p>
- <p *ngIf="isDataStreamDescription">Data Stream</p>
- </div>
- <span fxFlex></span>
- <div fxLayoutAlign="end start">
- <button mat-icon-button (click)="removeSelection()">
- <i class="material-icons">close</i>
- </button>
+<sp-basic-view [padding]="true" [showBackLink]="false">
+
+ <div nav fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
+ <button mat-icon-button (click)="removeSelection()">
+ <i class="material-icons">close</i>
+ </button>
+ </div>
+ <div fxLayout="column" fxLayoutAlign="center stretch" *ngIf="adapter">
+ <div fxLayout="column" fxFlex="100" class="p-10">
+ <div fxLayout="row" fxLayoutAlign="start center">
+ <mat-icon *ngIf="isDataSetDescription" class="historic">lens</mat-icon>
+ <mat-icon *ngIf="isDataStreamDescription" class="real-time">lens
+ </mat-icon>
+ <div fxLayoutAlign="start center">
+ <p *ngIf="isDataSetDescription">Data Set</p>
+ <p *ngIf="isDataStreamDescription">Data Stream</p>
+ </div>
+ <span fxFlex></span>
</div>
+ <h1 *ngIf="!fromTemplate" class="new-adapter-title">New Source: {{adapter.templateTitle}}</h1>
+ <h1 *ngIf="fromTemplate" class="new-adapter-title">From Template: {{adapter.templateTitle}}</h1>
</div>
- <h1 *ngIf="!fromTemplate" class="new-adapter-title">New Source: {{adapter.templateTitle}}</h1>
- <h1 *ngIf="fromTemplate" class="new-adapter-title">From Template: {{adapter.templateTitle}}</h1>
- </div>
- <mat-horizontal-stepper [linear]="true" #stepper color="accent" class="stepper">
- <mat-step *ngIf="!isGenericAdapter">
- <ng-template matStepLabel>Settings</ng-template>
- <sp-specific-adapter-configuration
- [adapterDescription]="adapter"
- (clickNextEmitter)="clickSpecificSettingsNextButton()"
- (removeSelectionEmitter)="removeSelection()">
- </sp-specific-adapter-configuration>
- </mat-step>
+ <mat-horizontal-stepper [linear]="true" #stepper color="accent" class="stepper">
+ <mat-step *ngIf="!isGenericAdapter">
+ <ng-template matStepLabel>Settings</ng-template>
+ <sp-specific-adapter-configuration
+ [adapterDescription]="adapter"
+ (clickNextEmitter)="clickSpecificSettingsNextButton()"
+ (removeSelectionEmitter)="removeSelection()">
+ </sp-specific-adapter-configuration>
+ </mat-step>
- <mat-step *ngIf="isGenericAdapter">
- <ng-template matStepLabel>Settings</ng-template>
- <sp-generic-adapter-configuration
- [adapterDescription]="adapter"
- (clickNextEmitter)="clickProtocolSettingsNextButton()"
- (removeSelectionEmitter)="removeSelection()">
- </sp-generic-adapter-configuration>
- </mat-step>
+ <mat-step *ngIf="isGenericAdapter">
+ <ng-template matStepLabel>Settings</ng-template>
+ <sp-generic-adapter-configuration
+ [adapterDescription]="adapter"
+ (clickNextEmitter)="clickProtocolSettingsNextButton()"
+ (removeSelectionEmitter)="removeSelection()">
+ </sp-generic-adapter-configuration>
+ </mat-step>
- <mat-step *ngIf="isGenericAdapter">
- <ng-template matStepLabel>Select Format</ng-template>
- <sp-format-configuration
- [adapterDescription]="adapter"
- (clickNextEmitter)="clickFormatSelectionNextButton()"
- (goBackEmitter)="goBack()"
- (removeSelectionEmitter)="removeSelection()">
- </sp-format-configuration>
- </mat-step>
+ <mat-step *ngIf="isGenericAdapter">
+ <ng-template matStepLabel>Select Format</ng-template>
+ <sp-format-configuration
+ [adapterDescription]="adapter"
+ (clickNextEmitter)="clickFormatSelectionNextButton()"
+ (goBackEmitter)="goBack()"
+ (removeSelectionEmitter)="removeSelection()">
+ </sp-format-configuration>
+ </mat-step>
- <mat-step>
- <ng-template matStepLabel>Define Event Schema</ng-template>
- <sp-event-schema #eschema fxLayout="column" fxFlex="100"
- [(isEditable)]="isEditable"
- [adapterDescription]="adapter"
- [(eventSchema)]="eventSchema"
- [(oldEventSchema)]="oldEventSchema"
- (clickNextEmitter)="clickEventSchemaNextButtonButton()"
- (goBackEmitter)="goBack()"
- (removeSelectionEmitter)="removeSelection()">
- </sp-event-schema>
- </mat-step>
+ <mat-step>
+ <ng-template matStepLabel>Define Event Schema</ng-template>
+ <sp-event-schema #eschema fxLayout="column" fxFlex="100"
+ [(isEditable)]="isEditable"
+ [adapterDescription]="adapter"
+ [(eventSchema)]="eventSchema"
+ [(oldEventSchema)]="oldEventSchema"
+ (clickNextEmitter)="clickEventSchemaNextButtonButton()"
+ (goBackEmitter)="goBack()"
+ (removeSelectionEmitter)="removeSelection()">
+ </sp-event-schema>
+ </mat-step>
- <mat-step>
- <ng-template matStepLabel>Start Adapter</ng-template>
- <sp-start-adapter-configuration
- [adapterDescription]="adapter"
- [eventSchema]="eventSchema"
- (removeSelectionEmitter)="removeSelection()"
- (goBackEmitter)="goBack()"
- (adapterStartedEmitter)="adapterWasStarted()">
- </sp-start-adapter-configuration>
- </mat-step>
+ <mat-step>
+ <ng-template matStepLabel>Start Adapter</ng-template>
+ <sp-start-adapter-configuration
+ [adapterDescription]="adapter"
+ [eventSchema]="eventSchema"
+ (removeSelectionEmitter)="removeSelection()"
+ (goBackEmitter)="goBack()"
+ (adapterStartedEmitter)="adapterWasStarted()">
+ </sp-start-adapter-configuration>
+ </mat-step>
- </mat-horizontal-stepper>
+ </mat-horizontal-stepper>
-</div>
+ </div>
+</sp-basic-view>
diff --git a/ui/src/app/connect/components/new-adapter/new-adapter.component.ts b/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
index 1b593b59f..cfdb080ff 100644
--- a/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
+++ b/ui/src/app/connect/components/new-adapter/new-adapter.component.ts
@@ -16,17 +16,26 @@
*
*/
-import { AfterViewInit, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
+import {
+ AfterViewInit,
+ ChangeDetectorRef,
+ Component,
+ EventEmitter,
+ Input,
+ OnInit,
+ Output,
+ ViewChild
+} from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { MatStepper } from '@angular/material/stepper';
import {
- AdapterDescriptionUnion,
- EventSchema,
- GenericAdapterSetDescription,
- GenericAdapterStreamDescription,
- SpecificAdapterSetDescription,
- SpecificAdapterStreamDescription,
- TransformationRuleDescriptionUnion
+ AdapterDescriptionUnion,
+ EventSchema,
+ GenericAdapterSetDescription,
+ GenericAdapterStreamDescription,
+ SpecificAdapterSetDescription,
+ SpecificAdapterStreamDescription,
+ TransformationRuleDescriptionUnion
} from '@streampipes/platform-services';
import { ShepherdService } from '../../../services/tour/shepherd.service';
import { ConnectService } from '../../services/connect.service';
@@ -35,6 +44,8 @@ import { RestService } from '../../services/rest.service';
import { EventSchemaComponent } from '../schema-editor/event-schema/event-schema.component';
import { TransformationRuleService } from '../../services/transformation-rule.service';
import { IconService } from '../../services/icon.service';
+import { ActivatedRoute, Router } from '@angular/router';
+import { DataMarketplaceService } from '../../services/data-marketplace.service';
@Component({
selector: 'sp-new-adapter',
@@ -54,15 +65,7 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
@Input()
adapter: AdapterDescriptionUnion;
- @Output()
- removeSelectionEmitter: EventEmitter<void> = new EventEmitter<void>();
-
- @Output()
- updateAdapterEmitter: EventEmitter<void> = new EventEmitter<void>();
-
-
- @ViewChild('stepper', { static: true }) myStepper: MatStepper;
-
+ myStepper: MatStepper;
protocolConfigurationValid: boolean;
formatConfigurationValid: boolean;
@@ -79,10 +82,8 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
// deactivates all edit functions when user starts a template
isEditable = true;
- @ViewChild(EventSchemaComponent, { static: true })
private eventSchemaComponent: EventSchemaComponent;
-
completedStaticProperty: ConfigurationInfo;
isPreviewEnabled = false;
@@ -98,7 +99,10 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
private connectService: ConnectService,
private _formBuilder: FormBuilder,
private iconService: IconService,
- private changeDetectorRef: ChangeDetectorRef) {
+ private changeDetectorRef: ChangeDetectorRef,
+ private route: ActivatedRoute,
+ private dataMarketplaceService: DataMarketplaceService,
+ private router: Router) {
}
handleFileInput(files: any) {
@@ -115,36 +119,44 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
ngOnInit() {
- this.parentForm = this._formBuilder.group({});
+ this.dataMarketplaceService.getAdapterDescriptions().subscribe(adapters => {
+ const adapter = adapters.find(a => a.appId === this.route.snapshot.params.appId);
+ this.adapter = this.dataMarketplaceService.cloneAdapterDescription(adapter);
+ (this.adapter as any).templateTitle = this.adapter.name;
+ this.adapter.name = '';
+ this.adapter.description = '';
+ this.parentForm = this._formBuilder.group({});
- this.isGenericAdapter = this.connectService.isGenericDescription(this.adapter);
- this.isDataSetDescription = this.connectService.isDataSetDescription(this.adapter);
- this.isDataStreamDescription = this.connectService.isDataStreamDescription(this.adapter);
- this.formatConfigurationValid = false;
+ this.isGenericAdapter = this.connectService.isGenericDescription(this.adapter);
+ this.isDataSetDescription = this.connectService.isDataSetDescription(this.adapter);
+ this.isDataStreamDescription = this.connectService.isDataStreamDescription(this.adapter);
+ this.formatConfigurationValid = false;
- // this.startAdapterFormGroup = this._formBuilder.group({
- // startAdapterFormCtrl: ['', Validators.required]
- // });
+ // this.startAdapterFormGroup = this._formBuilder.group({
+ // startAdapterFormCtrl: ['', Validators.required]
+ // });
- this.protocolConfigurationValid = false;
+ this.protocolConfigurationValid = false;
- this.eventSchema = this.connectService.getEventSchema(this.adapter);
+ this.eventSchema = this.connectService.getEventSchema(this.adapter);
- if (this.eventSchema.eventProperties.length > 0) {
+ if (this.eventSchema.eventProperties.length > 0) {
- // Timeout is needed for stepper to work correctly. Without the stepper is frozen when initializing with
- // step 2. Can be removed when a better solution is found.
- setTimeout(() => {
- this.goForward();
- this.goForward();
- }, 1);
+ // Timeout is needed for stepper to work correctly. Without the stepper is frozen when initializing with
+ // step 2. Can be removed when a better solution is found.
+ setTimeout(() => {
+ this.goForward();
+ this.goForward();
+ }, 1);
+
+ this.fromTemplate = true;
+ this.isEditable = false;
+ this.oldEventSchema = this.eventSchema;
+ }
+ });
- this.fromTemplate = true;
- this.isEditable = false;
- this.oldEventSchema = this.eventSchema;
- }
// this.parentForm.statusChanges.subscribe((status) => {
// this.genericadapterSettingsFormValid = this.viewInitialized && this.parentForm.valid;
@@ -159,7 +171,7 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
removeSelection() {
- this.removeSelectionEmitter.emit();
+ this.router.navigate(['connect', 'create']);
}
clickProtocolSettingsNextButton() {
@@ -230,7 +242,14 @@ export class NewAdapterComponent implements OnInit, AfterViewInit {
}
public adapterWasStarted() {
- this.updateAdapterEmitter.emit();
- this.removeSelectionEmitter.emit();
+ this.router.navigate(['connect']);
+ }
+
+ @ViewChild(EventSchemaComponent) set schemaComponent(eventSchemaComponent: EventSchemaComponent) {
+ this.eventSchemaComponent = eventSchemaComponent;
+ }
+
+ @ViewChild('stepper') set stepperComponent(stepperComponent: MatStepper) {
+ this.myStepper = stepperComponent;
}
}
diff --git a/ui/src/app/connect/connect.module.ts b/ui/src/app/connect/connect.module.ts
index cad1e3323..d95ec367d 100644
--- a/ui/src/app/connect/connect.module.ts
+++ b/ui/src/app/connect/connect.module.ts
@@ -68,7 +68,7 @@ import { EventSchemaPreviewComponent } from './components/schema-editor/event-sc
import { CoreUiModule } from '../core-ui/core-ui.module';
// tslint:disable-next-line:max-line-length
import { EditCorrectionValueComponent } from './dialog/edit-event-property/components/edit-correction-value/edit-correction-value.component';
-import { ExistingAdaptersComponent } from './components/data-marketplace/existing-adapters/existing-adapters.component';
+import { ExistingAdaptersComponent } from './components/existing-adapters/existing-adapters.component';
// tslint:disable-next-line:max-line-length
import { SpecificAdapterConfigurationComponent } from './components/specific-adapter-configuration/specific-adapter-configuration.component';
import { ConfigurationGroupComponent } from './components/configuration-group/configuration-group.component';
@@ -81,75 +81,100 @@ import { StartAdapterConfigurationComponent } from './components/start-adapter-c
import { DeleteAdapterDialogComponent } from './dialog/delete-adapter-dialog/delete-adapter-dialog.component';
import { PlatformServicesModule } from '@streampipes/platform-services';
import { FormatItemJsonComponent } from './components/format-item-json/format-item-json.component';
+import { RouterModule } from '@angular/router';
+import { SharedUiModule } from '@streampipes/shared-ui';
+import {
+ SpConnectFilterToolbarComponent
+} from './components/filter-toolbar/filter-toolbar.component';
@NgModule({
- imports: [
- CoreUiModule,
- FormsModule,
- ReactiveFormsModule,
- CommonModule,
- FlexLayoutModule,
- MatGridListModule,
- CustomMaterialModule,
- MatProgressSpinnerModule,
- MatChipsModule,
- MatInputModule,
- MatFormFieldModule,
- MatSliderModule,
- PlatformServicesModule,
- CoreUiModule,
- TreeModule
- ],
- exports: [
- PipelineElementRuntimeInfoComponent
- ],
- declarations: [
- AdapterDescriptionComponent,
- AdapterExportDialog,
- AdapterStartedDialog,
- AdapterUploadDialog,
- ConnectComponent,
- DataMarketplaceComponent,
- DeleteAdapterDialogComponent,
- EventSchemaComponent,
- EditEventPropertyPrimitiveComponent,
- EditEventPropertyComponent,
- EventPropertyRowComponent,
- EditEventPropertyListComponent,
- EditUnitTransformationComponent,
- EditTimestampPropertyComponent,
- EditDataTypeComponent,
- EventSchemaPreviewComponent,
- ExistingAdaptersComponent,
- FilterPipe,
- FormatItemComponent,
- FormatListComponent,
- NewAdapterComponent,
- PipelineElementRuntimeInfoComponent,
- TimestampPipe,
- EditCorrectionValueComponent,
- FormatConfigurationComponent,
- GenericAdapterConfigurationComponent,
- SpecificAdapterConfigurationComponent,
- ConfigurationGroupComponent,
- ErrorMessageComponent,
- LoadingMessageComponent,
- SchemaEditorHeaderComponent,
- StartAdapterConfigurationComponent,
- FormatItemJsonComponent
- ],
- providers: [
- RestService,
- ConnectService,
- DataTypesService,
- TransformationRuleService,
- StaticPropertyUtilService,
- DataMarketplaceService,
- IconService,
- UnitProviderService,
- TimestampPipe,
- XsService
- ]
+ imports: [
+ CoreUiModule,
+ FormsModule,
+ ReactiveFormsModule,
+ CommonModule,
+ FlexLayoutModule,
+ MatGridListModule,
+ CustomMaterialModule,
+ MatProgressSpinnerModule,
+ MatChipsModule,
+ MatInputModule,
+ MatFormFieldModule,
+ MatSliderModule,
+ PlatformServicesModule,
+ CoreUiModule,
+ TreeModule,
+ RouterModule.forChild([
+ {
+ path: 'connect',
+ children: [
+ {
+ path: '',
+ component: ExistingAdaptersComponent,
+ pathMatch: 'full'
+ },
+ {
+ path: 'create',
+ component: DataMarketplaceComponent,
+ },
+ {
+ path: 'create/:appId',
+ component: NewAdapterComponent,
+ }]
+ }]),
+ SharedUiModule
+ ],
+ exports: [
+ PipelineElementRuntimeInfoComponent
+ ],
+ declarations: [
+ AdapterDescriptionComponent,
+ AdapterExportDialog,
+ AdapterStartedDialog,
+ AdapterUploadDialog,
+ ConnectComponent,
+ DataMarketplaceComponent,
+ DeleteAdapterDialogComponent,
+ EventSchemaComponent,
+ EditEventPropertyPrimitiveComponent,
+ EditEventPropertyComponent,
+ EventPropertyRowComponent,
+ EditEventPropertyListComponent,
+ EditUnitTransformationComponent,
+ EditTimestampPropertyComponent,
+ EditDataTypeComponent,
+ EventSchemaPreviewComponent,
+ ExistingAdaptersComponent,
+ FilterPipe,
+ FormatItemComponent,
+ FormatListComponent,
+ NewAdapterComponent,
+ PipelineElementRuntimeInfoComponent,
+ TimestampPipe,
+ EditCorrectionValueComponent,
+ FormatConfigurationComponent,
+ GenericAdapterConfigurationComponent,
+ SpecificAdapterConfigurationComponent,
+ ConfigurationGroupComponent,
+ ErrorMessageComponent,
+ LoadingMessageComponent,
+ SchemaEditorHeaderComponent,
+ StartAdapterConfigurationComponent,
+ FormatItemJsonComponent,
+ SpConnectFilterToolbarComponent
+ ],
+ providers: [
+ RestService,
+ ConnectService,
+ DataTypesService,
+ TransformationRuleService,
+ StaticPropertyUtilService,
+ DataMarketplaceService,
+ IconService,
+ UnitProviderService,
+ TimestampPipe,
+ XsService
+ ]
})
export class ConnectModule {
}
[incubator-streampipes] 04/04: [STREAMPIPES-558] Add options toolbar to adapter overview component
Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch STREAMPIPES-558
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit dbfd35bad5ddcb60bd5a41914815e4f9f8d9ef4c
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Sat Jul 9 10:04:05 2022 +0200
[STREAMPIPES-558] Add options toolbar to adapter overview component
---
.../existing-adapters.component.html | 27 +++------------
.../existing-adapters.component.ts | 39 ++++++++++------------
ui/src/app/connect/connect.module.ts | 8 ++---
.../{filter.pipe.ts => adapter-filter.pipe.ts} | 16 +++++----
4 files changed, 33 insertions(+), 57 deletions(-)
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
index f15618f0a..b55acba35 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.html
@@ -32,7 +32,7 @@
<h4>My adapters</h4>
<span fxFlex></span>
<button mat-button mat-icon-button matTooltip="Refresh adapters" matTooltipPosition="above"
- (click)="updateAdapterEmitter.emit()">
+ (click)="getAdaptersRunning()">
<i class="material-icons">
refresh
</i>
@@ -102,38 +102,19 @@
<th mat-header-cell *matHeaderCellDef> Action</th>
<td mat-cell *matCellDef="let adapter">
<div fxLayout="row">
- <!-- <span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">-->
- <!-- <button color="primary" mat-button mat-icon-button matTooltip="Show adapter"-->
- <!-- matTooltipPosition="above"><i-->
- <!-- class="material-icons">search</i>-->
- <!-- </button>-->
- <!-- </span>-->
- <!-- <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">-->
- <!-- <button color="primary" mat-button mat-icon-button matTooltip="Modify adapter"-->
- <!-- matTooltipPosition="above"-->
- <!-- [disabled]="adapter.running">-->
- <!-- <i class="material-icons">mode_edit</i>-->
- <!-- </button>-->
- <!-- </span>-->
<span fxFlex fxFlexOrder="1" fxLayout="row" fxLayoutAlign="center center">
<button color="accent" mat-button mat-icon-button matTooltip="Show info"
matTooltipPosition="above" (click)="openHelpDialog(adapter)"><i
class="material-icons">help_outline</i>
</button>
- </span>
- <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center">
- <button color="accent" mat-button mat-icon-button matTooltip="Create adapter template"
- matTooltipPosition="above" (click)="createTemplate(adapter)"><i
- class="material-icons">content_copy</i>
- </button>
- </span>
- <span fxFlex fxFlexOrder="3" fxLayout="row" fxLayoutAlign="center center" *ngIf="isAdmin">
+ </span>
+ <span fxFlex fxFlexOrder="2" fxLayout="row" fxLayoutAlign="center center" *ngIf="isAdmin">
<button color="accent" mat-button mat-icon-button matTooltip="Manage permissions"
matTooltipPosition="above" (click)="showPermissionsDialog(adapter)"><i
class="material-icons">share</i>
</button>
</span>
- <span fxFlex fxFlexOrder="4" fxLayout="row" fxLayoutAlign="center center">
+ <span fxFlex fxFlexOrder="3" fxLayout="row" fxLayoutAlign="center center">
<button color="accent" mat-button mat-icon-button matTooltip="Delete adapter"
data-cy="delete" matTooltipPosition="above" (click)="deleteAdapter(adapter)">
<i class="material-icons">delete</i>
diff --git a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
index 275a1f9a8..b25e49f1c 100644
--- a/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
+++ b/ui/src/app/connect/components/existing-adapters/existing-adapters.component.ts
@@ -16,7 +16,7 @@
*
*/
-import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
import { AdapterDescriptionUnion, PipelineElementService } from '@streampipes/platform-services';
import { MatTableDataSource } from '@angular/material/table';
import { ConnectService } from '../../services/connect.service';
@@ -31,6 +31,7 @@ import { AuthService } from '../../../services/auth.service';
import { HelpComponent } from '../../../editor/dialog/help/help.component';
import { Router } from '@angular/router';
import { AdapterFilterSettingsModel } from '../../model/adapter-filter-settings.model';
+import { AdapterFilterPipe } from '../../filter/adapter-filter.pipe';
@Component({
selector: 'sp-existing-adapters',
@@ -40,15 +41,9 @@ import { AdapterFilterSettingsModel } from '../../model/adapter-filter-settings.
export class ExistingAdaptersComponent implements OnInit {
existingAdapters: AdapterDescriptionUnion[] = [];
+ filteredAdapters: AdapterDescriptionUnion[] = [];
- @Input()
- filterTerm: string;
-
- @Output()
- updateAdapterEmitter: EventEmitter<void> = new EventEmitter<void>();
-
- @Output()
- createTemplateEmitter: EventEmitter<AdapterDescriptionUnion> = new EventEmitter<AdapterDescriptionUnion>();
+ currentFilter: AdapterFilterSettingsModel;
@ViewChild(MatPaginator) paginator: MatPaginator;
pageSize = 1;
@@ -64,7 +59,8 @@ export class ExistingAdaptersComponent implements OnInit {
private dialogService: DialogService,
private authService: AuthService,
private pipelineElementService: PipelineElementService,
- private router: Router) {
+ private router: Router,
+ private adapterFilter: AdapterFilterPipe) {
}
@@ -77,13 +73,13 @@ export class ExistingAdaptersComponent implements OnInit {
startAdapter(adapter: AdapterDescriptionUnion) {
this.dataMarketplaceService.startAdapter(adapter).subscribe(response => {
- this.updateAdapterEmitter.emit();
+ this.getAdaptersRunning();
});
}
stopAdapter(adapter: AdapterDescriptionUnion) {
this.dataMarketplaceService.stopAdapter(adapter).subscribe(response => {
- this.updateAdapterEmitter.emit();
+ this.getAdaptersRunning();
});
}
@@ -109,7 +105,7 @@ export class ExistingAdaptersComponent implements OnInit {
dialogRef.afterClosed().subscribe(refresh => {
if (refresh) {
- this.updateAdapterEmitter.emit();
+ this.getAdaptersRunning();
}
});
}
@@ -126,7 +122,7 @@ export class ExistingAdaptersComponent implements OnInit {
dialogRef.afterClosed().subscribe(data => {
if (data) {
- this.updateAdapterEmitter.emit();
+ this.getAdaptersRunning();
}
});
}
@@ -148,20 +144,16 @@ export class ExistingAdaptersComponent implements OnInit {
});
}
-
- createTemplate(adapter: AdapterDescriptionUnion): void {
- this.createTemplateEmitter.emit(adapter);
- }
-
getAdaptersRunning(): void {
this.dataMarketplaceService.getAdapters().subscribe(adapters => {
this.existingAdapters = adapters;
- this.dataSource = new MatTableDataSource(this.existingAdapters);
+ this.existingAdapters.sort((a, b) => a.name.localeCompare(b.name));
+ this.filteredAdapters = this.adapterFilter.transform(this.existingAdapters, this.currentFilter);
+ this.dataSource = new MatTableDataSource(this.filteredAdapters);
setTimeout(() => {
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
});
- //this.filteredAdapters = this.existingAdapters;
});
}
@@ -170,7 +162,10 @@ export class ExistingAdaptersComponent implements OnInit {
}
applyFilter(filter: AdapterFilterSettingsModel) {
-
+ this.currentFilter = filter;
+ if (this.dataSource) {
+ this.dataSource.data = this.adapterFilter.transform(this.filteredAdapters, this.currentFilter);
+ }
}
}
diff --git a/ui/src/app/connect/connect.module.ts b/ui/src/app/connect/connect.module.ts
index 8726839d8..6a1e08d8e 100644
--- a/ui/src/app/connect/connect.module.ts
+++ b/ui/src/app/connect/connect.module.ts
@@ -49,7 +49,7 @@ import { IconService } from './services/icon.service';
import { UnitProviderService } from './services/unit-provider.service';
-import { FilterPipe } from './filter/filter.pipe';
+import { AdapterFilterPipe } from './filter/adapter-filter.pipe';
import { AdapterExportDialog } from './dialog/adapter-export/adapter-export-dialog.component';
import { AdapterUploadDialog } from './dialog/adapter-upload/adapter-upload-dialog.component';
import { EditEventPropertyListComponent } from './dialog/edit-event-property/components/edit-event-property-list/edit-event-property-list.component';
@@ -83,9 +83,7 @@ import { PlatformServicesModule } from '@streampipes/platform-services';
import { FormatItemJsonComponent } from './components/new-adapter/format-configuration/format-item-json/format-item-json.component';
import { RouterModule } from '@angular/router';
import { SharedUiModule } from '@streampipes/shared-ui';
-import {
- SpConnectFilterToolbarComponent
-} from './components/filter-toolbar/filter-toolbar.component';
+import { SpConnectFilterToolbarComponent } from './components/filter-toolbar/filter-toolbar.component';
@NgModule({
imports: [
@@ -145,7 +143,7 @@ import {
EditDataTypeComponent,
EventSchemaPreviewComponent,
ExistingAdaptersComponent,
- FilterPipe,
+ AdapterFilterPipe,
FormatItemComponent,
FormatListComponent,
NewAdapterComponent,
diff --git a/ui/src/app/connect/filter/filter.pipe.ts b/ui/src/app/connect/filter/adapter-filter.pipe.ts
similarity index 89%
rename from ui/src/app/connect/filter/filter.pipe.ts
rename to ui/src/app/connect/filter/adapter-filter.pipe.ts
index 37a8f775f..8691a938b 100644
--- a/ui/src/app/connect/filter/filter.pipe.ts
+++ b/ui/src/app/connect/filter/adapter-filter.pipe.ts
@@ -16,23 +16,25 @@
*
*/
-import { Pipe, PipeTransform } from '@angular/core';
+import { Injectable, Pipe, PipeTransform } from '@angular/core';
import { AdapterDescriptionUnion } from '@streampipes/platform-services';
import { AdapterFilterSettingsModel } from '../model/adapter-filter-settings.model';
import { ConnectService } from '../services/connect.service';
-@Pipe({
- name: 'adapterFilter'
-})
-
-export class FilterPipe implements PipeTransform {
+@Pipe({ name: 'adapterFilter' })
+@Injectable({ providedIn: 'root' })
+export class AdapterFilterPipe implements PipeTransform {
constructor(private connectService: ConnectService) {
}
transform(adapterDescriptions: AdapterDescriptionUnion[],
activeFilters: AdapterFilterSettingsModel): AdapterDescriptionUnion[] {
- return adapterDescriptions.filter(a => this.meetsFilterCondition(a, activeFilters));
+ if (!activeFilters) {
+ return adapterDescriptions;
+ } else {
+ return adapterDescriptions.filter(a => this.meetsFilterCondition(a, activeFilters));
+ }
}
private meetsFilterCondition(adapterDescription: AdapterDescriptionUnion,