ing

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

@@ -8,34 +8,55 @@ import {
   OnDestroy
 } from '@angular/core';
 import { Store, select, StateObservable } from '@ngrx/store';
+import { Observable, of } 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 { 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 extends MetaCrawlerComponent implements OnInit, AfterContentInit, OnDestroy {
+export class ServiceSelectorComponent implements OnInit, AfterContentInit, OnDestroy {
   @Output() crawlerSelected = new EventEmitter<MetaCrawler>();
   @Input() includeServices;
   @Input() disabled: boolean;
 
+  metaCrawlers$: Observable<MetaCrawler[]>;
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+
   constructor(
     protected store: Store<any>,
     protected metaCrawlerService: MetaCrawlerService,
   ) {
-    super(store, metaCrawlerService);
+
   }
 
   ngOnInit() {
-    super.ngOnInit();
+    this.metaCrawlers$ = this.metaCrawlerService.readAll()
+      .pipe(
+        tap(() => {
+          this.pending$ = of(true);
+        }),
+        map((metaCrawlers: MetaCrawler[]) => {
+          return metaCrawlers;
+        }),
+        catchError(error => {
+          this.error$ = of(error);
+          return of(null);
+        }),
+        tap(() => {
+          this.pending$ = of(false);
+        }),
+      ).take(1);
   }
 
   ngOnDestroy() {
-    super.ngOnDestroy();
+
   }
 
   ngAfterContentInit() {

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

@@ -1,43 +0,0 @@
-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/service/meta-crawler.service.ts

@@ -1,10 +1,13 @@
 import { Injectable } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
+import { shareReplay, map } from 'rxjs/operators';
+
 import { RPCService } from '@loafer/ng-rpc';
 import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
 
 @Injectable()
 export class MetaCrawlerService {
+  private metaCrawlerCache$: Observable<MetaCrawler[]>;
 
   public constructor(
     private rpcService: RPCService,
@@ -13,6 +16,12 @@ export class MetaCrawlerService {
   }
 
   public readAll(): Observable<MetaCrawler[]> {
-    return this.rpcService.call('MetaCrawlerService.readAll');
+    if (!this.metaCrawlerCache$) {
+      this.metaCrawlerCache$ = this.rpcService.call('MetaCrawlerService.readAll').pipe(
+        shareReplay<MetaCrawler[]>(1),
+      );
+    }
+
+    return this.metaCrawlerCache$;
   }
 }