ing

@overflow/discovery/component/discovery/search-config.component.html

@@ -84,7 +84,7 @@
   </div>
 
   <div class="ui-g-12 ui-g-nopad">
-    <!-- <of-service-selector [disabled]="!serviceChecked" [(includeServices)]="includeServices"></of-service-selector> -->
+    <of-service-selector [disabled]="!serviceChecked" [(includeServices)]="includeServices"></of-service-selector>
   </div>
 
   <div class="ui-g-12" dir="rtl">

@overflow/discovery/component/discovery/service-selector/service-selector.component.html

@@ -1,7 +1,7 @@
 <div class="ui-g-12">
   <p-pickList
       [disabled]="disabled"
-      [source]="crawlers"
+      [source]="metaCrawlers$ | async"
       [target]="includeServices"
       sourceHeader="Available"
       targetHeader="Selected"

@overflow/discovery/component/discovery/service-selector/service-selector.component.ts

@@ -11,47 +11,35 @@ import { Store, select, StateObservable } from '@ngrx/store';
 import { RPCClientError } from '@loafer/ng-rpc';
 import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
 import { Subscription } from 'rxjs/Subscription';
+import { MetaCrawlerComponent } from '../../../../meta/component/abstract/meta-crawler.component';
+import { MetaCrawlerService } from '../../../../meta/service/meta-crawler.service';
 
 @Component({
   selector: 'of-service-selector',
   templateUrl: './service-selector.component.html',
 })
-export class ServiceSelectorComponent implements OnInit, AfterContentInit, OnDestroy {
-
-  crawlersSubscription$: Subscription;
-  crawlers$: StateObservable;
-  crawlers: MetaCrawler[];
+export class ServiceSelectorComponent extends MetaCrawlerComponent implements OnInit, AfterContentInit, OnDestroy {
   @Output() crawlerSelected = new EventEmitter<MetaCrawler>();
   @Input() includeServices;
   @Input() disabled: boolean;
 
   constructor(
-    private listStore: Store<any>,
+    protected store: Store<any>,
+    protected metaCrawlerService: MetaCrawlerService,
   ) {
-    // this.crawlers$ = listStore.pipe(select(ReadAllCrawlerSelector.select('metaCrawlerList')));
+    super(store, metaCrawlerService);
   }
 
   ngOnInit() {
-    // this.crawlersSubscription$ = this.crawlers$.subscribe(
-    //   (list: MetaCrawler[]) => {
-    //     if (list !== null) {
-    //       this.crawlers = [];
-    //       this.crawlers = list;
-    //     }
-    //   },
-    //   (error: RPCClientError) => {
-    //     console.log(error);
-    //   }
-    // );
+    super.ngOnInit();
+  }
+
+  ngOnDestroy() {
+    super.ngOnDestroy();
   }
 
   ngAfterContentInit() {
     // this.listStore.dispatch(new ListStore.ReadAll());
   }
 
-  ngOnDestroy() {
-    if (this.crawlersSubscription$) {
-      this.crawlersSubscription$.unsubscribe();
-    }
-  }
 }

@overflow/meta/component/abstract/meta-crawler.component.ts

@@ -0,0 +1,43 @@
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { Store, select } from '@ngrx/store';
+import { Observable, of, Subscription } from 'rxjs';
+import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
+
+import { RPCClientError } from '@loafer/ng-rpc';
+
+import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
+
+import { MetaCrawlerEntitySelector } from '../../store';
+import * as MetaCrawlerEntityStore from '../../store/entity/meta-crawler';
+import { MetaCrawlerService } from '../../service/meta-crawler.service';
+
+export abstract class MetaCrawlerComponent implements OnInit, OnDestroy {
+  metaCrawlers$: Observable<MetaCrawler[]>;
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+
+  constructor(
+    protected store: Store<any>,
+    protected metaCrawlerService: MetaCrawlerService,
+  ) {
+  }
+
+  ngOnInit() {
+    this.metaCrawlers$ = this.store.pipe(select(MetaCrawlerEntitySelector.selectAll));
+    this.pending$ = this.store.pipe(select(MetaCrawlerEntitySelector.selectPending));
+    this.error$ = this.store.pipe(select(MetaCrawlerEntitySelector.selectError));
+
+    this.store.pipe(
+      select(MetaCrawlerEntitySelector.selectAll),
+      map((metaCrawlers: MetaCrawler[]) => {
+        if (0 < metaCrawlers.length) {
+          return;
+        }
+        this.store.dispatch(new MetaCrawlerEntityStore.ReadAll());
+      }),
+    ).take(1).subscribe();
+  }
+
+  ngOnDestroy(): void {
+  }
+}

@overflow/meta/component/index.ts

@@ -1,2 +1,3 @@
 export const COMPONENTS = [
+
 ];

@overflow/meta/container/index.ts

@@ -1,5 +0,0 @@
-import { MetaCrawlerContainerComponent } from './meta-crawler-container.component';
-
-export const CONTAINER_COMPONENTS = [
-  MetaCrawlerContainerComponent,
-];

@overflow/meta/container/meta-crawler-container.component.spec.ts

@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { MetaCrawlerContainerComponent } from './meta-crawler-container.component';
-
-describe('MetaCrawlerContainerComponent', () => {
-  let component: MetaCrawlerContainerComponent;
-  let fixture: ComponentFixture<MetaCrawlerContainerComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ MetaCrawlerContainerComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(MetaCrawlerContainerComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

@overflow/meta/container/meta-crawler-container.component.ts

@@ -1,34 +0,0 @@
-import { Component, OnInit, OnDestroy } from '@angular/core';
-import { Store, select } from '@ngrx/store';
-import { Observable, Subscription } from 'rxjs';
-
-import { NoAuthProbe } from '@overflow/commons-typescript/model/noauth';
-import { AuthContainerSelector } from '@overflow/shared/auth/store';
-import { Domain, DomainMember } from '@overflow/commons-typescript/model/domain';
-import { ConfirmationService } from 'primeng/primeng';
-import { MessageService } from 'primeng/components/common/messageservice';
-import { RPCClientError } from '@loafer/ng-rpc';
-
-import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
-
-import { MetaCrawlerEntitySelector } from '../store';
-
-@Component({
-  selector: 'of-meta-crawler-container',
-  templateUrl: './meta-crawler-container.component.html'
-})
-export class MetaCrawlerContainerComponent implements OnInit, OnDestroy {
-  metaCrawlers$: Observable<MetaCrawler[]>;
-
-  constructor(
-    private store: Store<any>,
-  ) {
-  }
-
-  ngOnInit() {
-    this.metaCrawlers$ = this.store.pipe(select(MetaCrawlerEntitySelector.selectAll));
-  }
-
-  ngOnDestroy(): void {
-  }
-}

@overflow/meta/meta.module.ts

@@ -1,8 +1,9 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
+import { UIModule } from '@overflow/shared/ui/ui.module';
+
 import { COMPONENTS } from './component';
-import { CONTAINER_COMPONENTS } from './container';
 import { SERVICES } from './service';
 
 import { MetaStoreModule } from './meta-store.module';
@@ -10,15 +11,14 @@ import { MetaStoreModule } from './meta-store.module';
 @NgModule({
   imports: [
     CommonModule,
+    UIModule,
     MetaStoreModule,
   ],
   declarations: [
     COMPONENTS,
-    CONTAINER_COMPONENTS
   ],
   exports: [
     COMPONENTS,
-    CONTAINER_COMPONENTS
   ],
   providers: [
     SERVICES,

@overflow/meta/store/entity/meta-crawler/meta-crawler.state.ts

@@ -6,12 +6,15 @@ import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
 
 export const metaCrawlerEntityAdapter = createEntityAdapter<MetaCrawler, RPCClientError>();
 export interface State extends EntityState<MetaCrawler, RPCClientError> {
+  pending: boolean;
 }
 export const initialState: State = metaCrawlerEntityAdapter.getInitialState({
+  pending: false,
 });
 
 export function getSelectors(selector: Selector<any, State>) {
   return {
     ...metaCrawlerEntityAdapter.getSelectors(selector),
+    selectPending: createSelector(selector, (state: State) => state.pending),
   };
 }