version

@overflow/meta/component/meta-service-type-selector.component.html

@@ -0,0 +1,15 @@
+<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
+<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
+
+<p-panel *ngIf="probeHost" #content [showHeader]="false" class="block-panel">
+  <div *ngIf="metaTargetServiceTypes" class="ui-width-100-">
+    <p-orderList [value]="metaTargetServiceTypes" metaKeySelection="false" [listStyle]="{'height':'200px'}" [responsive]="true"
+      filterBy="name" (onSelectionChange)="selected.emit($event.value[0])" class="ui_orderlist_controls_none">
+      <ng-template let-service pTemplate="item">
+        <div class="ui-helper-clearfix">
+          <div *ngIf="service.isSupported" style="font-size:14px;margin:0">{{service.name}}</div>
+        </div>
+      </ng-template>
+    </p-orderList>
+  </div>
+</p-panel>

@overflow/meta/component/meta-service-type-selector.component.ts

@@ -0,0 +1,50 @@
+import { Component, OnInit, Input, OnChanges, Output, EventEmitter } from '@angular/core';
+import { Store, select } from '@ngrx/store';
+import { Observable, of, Subscription } from 'rxjs';
+import { catchError, exhaustMap, map, tap, take } from 'rxjs/operators';
+
+
+import { MetaCrawler, MetaTargetServiceType, MetaInfraTypeEnum, toMetaInfraTypeEnum, toMetaInfraType, MetaTargetType } from '@overflow/commons-typescript/model/meta';
+import { MetaCrawlerService } from '../service/meta-crawler.service';
+import { MetaTargetTypeService } from '../service/meta-target-type.service';
+
+
+@Component({
+  selector: 'of-meta-service-type-selector',
+  templateUrl: './meta-service-type-selector.component.html',
+})
+export class MetaServiceTypeSelectorComponent implements OnInit {
+
+  @Output() selected = new EventEmitter<MetaCrawler>();
+
+  metaTargetServiceTypes: MetaTargetServiceType[];
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+
+  constructor(
+    private metaTargetTypeService: MetaTargetTypeService,
+  ) { }
+
+  ngOnInit() {
+    this.metaTargetTypeService.readAllByMetaInfraType
+      (toMetaInfraType(MetaInfraTypeEnum.SERVICE))
+      .pipe(
+        tap(() => {
+          this.pending$ = of(true);
+        }),
+        map((metaTargetTypes: MetaTargetType[]) => {
+          this.metaTargetServiceTypes = metaTargetTypes;
+          console.log(this.metaTargetServiceTypes);
+        }),
+        catchError(error => {
+          this.error$ = of(error);
+          return of();
+        }),
+        tap(() => {
+          this.pending$ = of(false);
+        }),
+        take(1),
+    ).subscribe();
+  }
+
+}

@overflow/meta/service/meta-target-type.service.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { RPCService } from '@loafer/ng-rpc';
-import { MetaTargetType } from '@overflow/commons-typescript/model/meta';
+import { MetaTargetType, MetaInfraType } from '@overflow/commons-typescript/model/meta';
 
 @Injectable()
 export class MetaTargetTypeService {
@@ -19,4 +19,8 @@ export class MetaTargetTypeService {
   public readAll(): Observable<MetaTargetType[]> {
     return this.rpcService.call<MetaTargetType[]>('MetaTargetTypeService.readAll');
   }
+
+  public readAllByMetaInfraType(metaInfraType: MetaInfraType): Observable<MetaTargetType[]> {
+    return this.rpcService.call<MetaTargetType[]>('MetaTargetTypeService.readAllByMetaInfraType', metaInfraType);
+  }
 }