probe / discovery module refactoring

@overflow/discovery/component/discovery/discovery.component.html

@@ -1,3 +1,4 @@
+<of-probe-selector [probeHostID]="probeHostID" (select)="selectedProbe=$event"></of-probe-selector>
 <of-probe-summary *ngIf="selectedProbe" @discoveryFilterAnim [probeHost]="selectedProbe"></of-probe-summary>
 <div class="ui-g">
   <div class="ui-g-12 ui-md-3">

@overflow/discovery/component/discovery/discovery.component.ts

@@ -12,12 +12,12 @@ import { Anim } from './animation';
 })
 export class DiscoveryComponent  {
 
-  @Input() selectedProbe: ProbeHost;
+  @Input() probeHostID;
-  @Output() requestDiscovery = new EventEmitter<DiscoverZone>();
+  selectedProbe: ProbeHost;
-  @Output() requestStop = new EventEmitter();
+  // @Output() requestDiscovery = new EventEmitter<DiscoverZone>();
+  // @Output() requestStop = new EventEmitter();
 
   discoverZone: DiscoverZone;
-
   requested: boolean;
 
   constructor(
@@ -27,12 +27,12 @@ export class DiscoveryComponent  {
   onRequestDiscovery(dz: DiscoverZone) {
     this.requested = true;
     this.discoverZone = dz;
-    this.requestDiscovery.emit(dz);
+    // this.requestDiscovery.emit(dz);
   }
 
   onRequestDiscoveryStop() {
     this.requested = false;
     this.discoverZone = null;
-    this.requestStop.emit();
+    // this.requestStop.emit();
   }
 }

@overflow/discovery/container/discovery/discovery-container.component.html

@@ -1,3 +0,0 @@
-<of-probe-selector-container [probeHostID]="probeHostID" (select)="onProbeSelect($event)"></of-probe-selector-container>
-<of-discovery [selectedProbe]="selectedProbe" (requestDiscovery)="onRequestDiscovery($event)"
-    (requestStop)="onRequestStop($event)"></of-discovery>

@overflow/discovery/container/discovery/discovery-container.component.ts

@@ -1,34 +0,0 @@
-import {
-  Component,
-  Input,
-} from '@angular/core';
-import { ProbeHost } from '@overflow/commons-typescript/model/probe';
-import { DiscoverZone } from '@overflow/commons-typescript/model/discovery';
-
-@Component({
-  selector: 'of-discovery-container',
-  templateUrl: './discovery-container.component.html',
-})
-export class DiscoveryContainerComponent {
-
-  @Input() probeHostID;
-  selectedProbe: ProbeHost;
-
-  constructor(
-  ) {
-  }
-
-  onProbeSelect(probe: ProbeHost) {
-    this.selectedProbe = probe;
-  }
-
-  onRequestDiscovery(dz: DiscoverZone) {
-    console.log(dz);
-    // this.discoverStore.dispatch(new DiscoverStore.DiscoverZone(
-    //   { probeID: this.selectedProbe.probeKey, discoverZone: discoverZone }));
-  }
-
-  onRequestStop() {
-    console.log('onRequestStop');
-  }
-}

@overflow/discovery/container/index.ts

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

@overflow/discovery/discovery.module.ts

@@ -8,7 +8,6 @@ import { DiscoveryLoggerModule } from './discovery-logger.module';
 
 import { COMPONENTS } from './component';
 import { SERVICES } from './service';
-import { CONTAINER_COMPONENTS } from './container';
 
 import { UIModule } from '@overflow/shared/ui/ui.module';
 import { ProbeModule } from '@overflow/probe/probe.module';
@@ -28,11 +27,9 @@ import { MetaModule } from '@overflow/meta/meta.module';
   ],
   declarations: [
     COMPONENTS,
-    CONTAINER_COMPONENTS
   ],
   exports: [
     COMPONENTS,
-    CONTAINER_COMPONENTS
   ],
   providers: [
     SERVICES,

@overflow/probe/component/detail/detail.component.spec.ts

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

@overflow/probe/component/download/download.component.spec.ts

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

@overflow/probe/component/index.ts

@@ -1,8 +1,8 @@
-import { ProbeDetailComponent } from './detail/detail.component';
+import { ProbeListComponent } from './probe-list.component';
-import { ProbeListComponent } from './list/list.component';
+import { ProbeDetailComponent } from './probe-detail.component';
-import { ProbeDownloadComponent } from './download/download.component';
+import { ProbeDownloadComponent } from './probe-download.component';
-import { ProbeSelectorComponent } from './selector/selector.component';
+import { ProbeSelectorComponent } from './probe-selector.component';
-import { ProbeSummaryComponent } from './summary/summary.component';
+import { ProbeSummaryComponent } from './probe-summary.component';
 
 export const COMPONENTS = [
   ProbeListComponent,

@overflow/probe/component/list/list.component.spec.ts

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

@overflow/probe/component/list/list.component.ts

@@ -1,36 +0,0 @@
-import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
-import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
-
-@Component({
-  selector: 'of-probe-list',
-  templateUrl: './list.component.html',
-})
-export class ProbeListComponent {
-  @Output() select = new EventEmitter<ProbeHost>();
-  @Input() pending: boolean;
-  @Input() probeHosts: ProbeHost[];
-  @Input() error: any;
-
-  constructor() {
-  }
-
-  onProbeSelect(event) {
-    this.select.emit(event.data);
-  }
-
-  getUptime(probe: Probe) {
-    if (!probe.connectDate) {
-      return 'Not Connected.';
-    }
-    const hours = Math.abs(new Date().getTime() - probe.connectDate.getTime());
-    return this.convertUptimeString(hours);
-  }
-
-  convertUptimeString(hours: number) {
-    if (hours === 0) {
-      return 'Less than an hour.';
-    } else {
-      return 'About ' + hours;
-    }
-  }
-}

@overflow/probe/component/probe-detail.component.html

@@ -1,5 +1,5 @@
-<of-error-message [error]="error" [closable]="false"></of-error-message>
+<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
-<of-block-progressbar [target]="content" [pending]="pending"></of-block-progressbar>
+<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
 
 <p-panel #content [showHeader]="false" class="block-panel">
 
@@ -14,7 +14,6 @@
       <button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Cancel" (click)="editMode = false"></button>
     </div>
   </div>
-  <p-messages [(value)]="connectionStatus" [closable]="false"></p-messages>
 
   <!-- Probe info -->
   <div class="ui-g ui-bottom-space-10">
@@ -54,20 +53,16 @@
           <div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
             <of-key-value [key]="'Authrozied by'" [value]="probeHost.probe.authorizeMember.name"></of-key-value>
           </div>
-
-          <!--
         </div>
       </div>
     </p-panel>
-  </div>-->
+  </div>
 
     <!-- Host info -->
-    <!--
   <div class="ui-g ui-bottom-space-10">
     <p-panel [showHeader]="false">
       <div *ngIf="probeHost">
         <div class="ui-g">
--->
           <div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
             <of-key-value [key]="'IPv4'" [value]="probeHost.host.ipv4"></of-key-value>
           </div>
@@ -83,7 +78,6 @@
           <div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
             <of-key-value [key]="'OS'" [value]="probeHost.host.os.vendor.name"></of-key-value>
           </div>
-
         </div>
       </div>
     </p-panel>
@@ -92,9 +86,8 @@
   <div class="ui-g" dir="rtl">
     <button class="ui-button-danger ui-button-width-fit" [disabled]="true" type="button" label="Remove this Probe" icon="ui-icon-close" pButton
       (click)="onRemoveClick()"></button>
-    <button class="ui-button-width-fit" type="button" label="Discovery" icon="ui-icon-search" pButton (click)="onDiscoveryClick()"></button>
+    <button class="ui-button-width-fit" type="button" label="Discovery" icon="ui-icon-search" pButton (click)="discovery.emit(probeHost.id)"></button>
   </div>
-
 </p-panel>
 
 

@overflow/probe/component/probe-detail.component.ts

@@ -1,21 +1,26 @@
-import { Component, Input, Output, EventEmitter, ViewChild, OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
 import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
-import { MessageService } from 'primeng/components/common/messageservice';
+import { Store, select } from '@ngrx/store';
-import { Message } from 'primeng/primeng';
+import { Observable, of, Subscription } from 'rxjs';
+import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
+import { AuthContainerSelector } from '@overflow/shared/auth/store';
+import { DomainMember } from '@overflow/commons-typescript/model/domain';
+import { ProbeHostService } from '../service/probe-host.service';
 
 @Component({
   selector: 'of-probe-detail',
-  templateUrl: './detail.component.html',
+  templateUrl: './probe-detail.component.html',
-  providers: [MessageService]
 })
-export class ProbeDetailComponent implements OnChanges {
+export class ProbeDetailComponent implements OnInit {
+
+  @Input() probeHostID;
+  pending$: Observable<boolean>;
+  probeHost: ProbeHost;
+  error$: Observable<any>;
 
-  @Input() pending: boolean;
-  @Input() probeHost: ProbeHost;
   @Output() modify = new EventEmitter<ProbeHost>();
   @Output() discovery = new EventEmitter<number>();
 
-  connectionStatus: Message[] = [];
 
   editMode = false;
   displayNameErrMsg: string;
@@ -23,27 +28,31 @@ export class ProbeDetailComponent implements OnChanges {
   displayName: string;
   description: string;
 
-  constructor(private messageService: MessageService) {
+  constructor(
+    private store: Store<any>,
+    private probeHostService: ProbeHostService
+  ) {
   }
 
-  ngOnChanges(changes: SimpleChanges): void {
+  ngOnInit() {
-    if (changes['probeHost'].currentValue) {
+    this.probeHostService.read(this.probeHostID)
-      this.checkConnectStatus();
+    .pipe(
-    }
+      tap(() => {
+        this.pending$ = of(true);
+      }),
+      map((probeHost: ProbeHost) => {
+        this.probeHost = probeHost;
+      }),
+      catchError(error => {
+        this.error$ = of(error);
+        return of();
+      }),
+      tap(() => {
+        this.pending$ = of(false);
+      }),
+  ).take(1).subscribe();
   }
 
-  checkConnectStatus() {
-    this.connectionStatus = [];
-    const msg = this.probeHost.probe.connectDate ? {
-      severity: 'success',
-      summary: 'Connected',
-      detail: this.probeHost.probe.connectAddress
-    } : {
-      severity: 'warn', // info, warn, error
-      summary: 'Not Connected',
-    };
-    this.connectionStatus.push(msg);
-  }
 
   onDisplayNameEditing(value: string) {
     const msg: string = this.checkValidDisplayName(value);
@@ -72,10 +81,6 @@ export class ProbeDetailComponent implements OnChanges {
     this.editMode = false;
   }
 
-  onDiscoveryClick() {
-    this.discovery.emit(this.probeHost.id);
-  }
-
   checkValidDisplayName(value: string): string | null {
     if (value.length <= 2 || value.length > 20) {
       return 'displayname length : 3 ~ 20';

@overflow/probe/component/probe-download.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'of-download',
-  templateUrl: './download.component.html',
+  templateUrl: './probe-download.component.html',
 })
 export class ProbeDownloadComponent implements OnInit {
 

@overflow/probe/component/probe-list.component.html

@@ -1,9 +1,9 @@
 <h1>Probes</h1>
-<of-error-message [error]="error" [closable]="false"></of-error-message>
+<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
-<of-block-progressbar [target]="content" [pending]="pending"></of-block-progressbar>
+<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
 
 <p-panel #content [showHeader]="false" class="block-panel">
-  <p-table [value]="probeHosts" selectionMode="single" (onRowSelect)="onProbeSelect($event)" [resizableColumns]="true">
+  <p-table [value]="probeHosts$ | async" selectionMode="single" (onRowSelect)="onProbeSelect($event)" [resizableColumns]="true">
     <ng-template pTemplate="header">
       <tr>
         <th>Probe Name</th>

@overflow/probe/component/probe-list.component.ts

@@ -0,0 +1,70 @@
+import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
+import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
+import { Store, select } from '@ngrx/store';
+import { Observable, of } from 'rxjs';
+import { ProbeHostService } from '../service/probe-host.service';
+import { AuthContainerSelector } from '@overflow/shared/auth/store';
+import { DomainMember } from '@overflow/commons-typescript/model/domain';
+import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
+
+@Component({
+  selector: 'of-probe-list',
+  templateUrl: './probe-list.component.html',
+})
+export class ProbeListComponent implements OnInit {
+
+  probeHosts$: Observable<ProbeHost[]>;
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+  @Output() select = new EventEmitter<ProbeHost>();
+
+  constructor(
+    private store: Store<any>,
+    private probeHostService: ProbeHostService,
+  ) {
+  }
+
+  ngOnInit(): void {
+    this.store.pipe(
+      tap(() => {
+        this.pending$ = of(true);
+      }),
+      select(AuthContainerSelector.selectDomainMember),
+      exhaustMap((domainMember: DomainMember) =>
+        this.probeHostService.readAllByDomainID(domainMember.domain.id)
+          .pipe(
+            map((probeHosts: ProbeHost[]) => {
+              this.probeHosts$ = of(probeHosts);
+            }),
+            catchError(error => {
+              this.error$ = of(error);
+              return of();
+            })
+          )
+      ),
+      tap(() => {
+        this.pending$ = of(false);
+      }),
+    ).take(1).subscribe();
+  }
+
+  onProbeSelect(event) {
+    this.select.emit(event.data);
+  }
+
+  getUptime(probe: Probe) {
+    if (!probe.connectDate) {
+      return 'Not Connected.';
+    }
+    const hours = Math.abs(new Date().getTime() - probe.connectDate.getTime());
+    return this.convertUptimeString(hours);
+  }
+
+  convertUptimeString(hours: number) {
+    if (hours === 0) {
+      return 'Less than an hour.';
+    } else {
+      return 'About ' + hours;
+    }
+  }
+}

@overflow/probe/component/probe-selector.component.html

@@ -0,0 +1,4 @@
+<div *ngIf="!probeHostID">
+  <p-dropdown [options]="options" [(ngModel)]="selected" optionLabel="displayName" placeholder="Select a Probe"
+    (onChange)="onSelect()"></p-dropdown>
+</div>

@overflow/probe/component/probe-selector.component.ts

@@ -0,0 +1,85 @@
+import { Component, Input, Output, EventEmitter, OnChanges, SimpleChanges, OnInit } from '@angular/core';
+import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
+import { Store, select } from '@ngrx/store';
+import { Observable, of, Subscription } from 'rxjs';
+import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
+import { AuthContainerSelector } from '@overflow/shared/auth/store';
+import { DomainMember } from '@overflow/commons-typescript/model/domain';
+import { ProbeHostService } from '../service/probe-host.service';
+
+
+@Component({
+  selector: 'of-probe-selector',
+  templateUrl: './probe-selector.component.html',
+})
+export class ProbeSelectorComponent implements OnInit, OnChanges {
+
+  @Input() probeHostID: number;
+  probeHosts: ProbeHost[];
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+  @Output() select = new EventEmitter<ProbeHost>();
+
+  options: Probe[];
+  selected: Probe;
+
+  constructor(
+    private store: Store<any>,
+    private probeHostService: ProbeHostService,
+
+  ) {
+  }
+
+  ngOnInit() {
+    this.store.pipe(
+      tap(() => {
+        this.pending$ = of(true);
+      }),
+      select(AuthContainerSelector.selectDomainMember),
+      exhaustMap((domainMember: DomainMember) =>
+        this.probeHostService.readAllByDomainID(domainMember.domain.id)
+          .pipe(
+            map((probeHosts: ProbeHost[]) => {
+              this.probeHosts = probeHosts;
+            }),
+            catchError(error => {
+              this.error$ = of(error);
+              return of();
+            })
+          )
+      ),
+      tap(() => {
+        this.generate();
+        this.pending$ = of(false);
+      }),
+    ).take(1).subscribe();
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+
+  }
+
+  generate() {
+    this.checkPreselected();
+    this.options = [];
+    for (const ph of this.probeHosts) {
+      this.options.push(ph.probe);
+    }
+  }
+
+  checkPreselected() {
+    if (!this.probeHosts || !this.probeHostID) {
+      return;
+    }
+    setTimeout(() => {
+      const preselected = this.probeHosts.find(probeHost => probeHost.id === Number(this.probeHostID));
+      this.select.emit(preselected);
+    });
+  }
+
+  onSelect() {
+    const optionselected = this.probeHosts.find(probeHost => probeHost.probe.id === this.selected.id);
+    this.select.emit(optionselected);
+  }
+
+}

@overflow/probe/component/probe-summary.component.ts

@@ -3,7 +3,7 @@ import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
 
 @Component({
   selector: 'of-probe-summary',
-  templateUrl: './summary.component.html',
+  templateUrl: './probe-summary.component.html',
 })
 export class ProbeSummaryComponent implements OnChanges {
 

@overflow/probe/component/selector/selector.component.html

@@ -1,4 +0,0 @@
-<div *ngIf="!probeHostID">
-  <p-dropdown *ngIf="options.length > 0" [options]="options" [(ngModel)]="selected" optionLabel="displayName" placeholder="Select a Probe"
-    (onChange)="onSelect()"></p-dropdown>
-</div>

@overflow/probe/component/selector/selector.component.ts

@@ -1,43 +0,0 @@
-import { Component, Input, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
-import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
-
-@Component({
-  selector: 'of-probe-selector',
-  templateUrl: './selector.component.html',
-})
-export class ProbeSelectorComponent implements OnChanges {
-
-  @Output() select = new EventEmitter<ProbeHost>();
-  @Input() probeHosts: ProbeHost[];
-  @Input() probeHostID: number;
-
-  options: Probe[];
-  selected: Probe;
-
-  constructor() {
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    this.checkPreselected();
-    this.options = [];
-    for (const ph of this.probeHosts) {
-      this.options.push(ph.probe);
-    }
-  }
-
-  checkPreselected() {
-    if (!this.probeHosts || !this.probeHostID) {
-      return;
-    }
-    setTimeout(() => {
-      const preselected = this.probeHosts.find(probeHost => probeHost.id === Number(this.probeHostID));
-      this.select.emit(preselected);
-    });
-  }
-
-  onSelect() {
-    const optionselected = this.probeHosts.find(probeHost => probeHost.probe.id === this.selected.id);
-    this.select.emit(optionselected);
-  }
-
-}

@overflow/probe/container/index.ts

@@ -1,9 +0,0 @@
-import { ProbeListContainerComponent } from '../container/probe-list-container.component';
-import { ProbeDetailContainerComponent } from '../container/probe-detail-container.component';
-import { ProbeSelectorContainerComponent } from './probe-selector-container.component';
-
-export const CONTAINER_COMPONENTS = [
-  ProbeListContainerComponent,
-  ProbeDetailContainerComponent,
-  ProbeSelectorContainerComponent
-];

@overflow/probe/container/probe-detail-container.component.html

@@ -1 +0,0 @@
-<of-probe-detail [pending]="pending$ |async" [probeHost]="probeHost$ | async" (modify)="onModify($event)" (discovery)="onDiscovery($event)"></of-probe-detail>

@overflow/probe/container/probe-detail-container.component.ts

@@ -1,44 +0,0 @@
-import { Component, OnInit, Input, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
-import { Observable } from 'rxjs';
-import { ProbeHost } from '@overflow/commons-typescript/model/probe';
-import { Store, select } from '@ngrx/store';
-import * as ProbeStore from '../store/entity/probe';
-import { ProbeDetailContainerSelector } from '../store';
-import { ActivatedRoute } from '@angular/router';
-
-@Component({
-  selector: 'of-probe-detail-container',
-  templateUrl: './probe-detail-container.component.html',
-})
-export class ProbeDetailContainerComponent implements OnInit, OnChanges {
-
-  @Input() probeHostID: number;
-  @Output() discovery = new EventEmitter<number>();
-  probeHost$: Observable<ProbeHost>;
-  pending$: Observable<boolean>;
-  error$: Observable<any>;
-
-  constructor(
-    private store: Store<any>,
-    private route: ActivatedRoute,
-  ) {
-  }
-
-  ngOnInit() {
-    this.pending$ = this.store.pipe(select(ProbeDetailContainerSelector.selectPending));
-    this.error$ = this.store.pipe(select(ProbeDetailContainerSelector.selectError));
-    this.probeHost$ = this.store.pipe(select(ProbeDetailContainerSelector.selectOne(this.probeHostID)));
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    this.store.dispatch(new ProbeStore.Read(this.probeHostID));
-  }
-
-  onModify(probeHost: ProbeHost) {
-    this.store.dispatch(new ProbeStore.Modify(probeHost.probe));
-  }
-
-  onDiscovery(probeHostID: number) {
-    this.discovery.emit(probeHostID);
-  }
-}

@overflow/probe/container/probe-list-container.component.html

@@ -1 +0,0 @@
-<of-probe-list [pending]="pending$ | async" (select)="onSelect($event)" [probeHosts]="probeHosts$ | async" [error]="error$ | async"></of-probe-list>

@overflow/probe/container/probe-list-container.component.ts

@@ -1,42 +0,0 @@
-import { Component, EventEmitter, Output, OnInit } from '@angular/core';
-import { ProbeHost } from '@overflow/commons-typescript/model/probe';
-import { Observable } from 'rxjs';
-import { Store, select } from '@ngrx/store';
-import * as ProbeEntityStore from '../store/entity/probe';
-import { ProbeListContainerSelector } from '../store';
-import { AuthContainerSelector } from '../../shared/auth/store';
-import { DomainMember } from '@overflow/commons-typescript/model/domain';
-
-@Component({
-    selector: 'of-probe-list-container',
-    templateUrl: './probe-list-container.component.html',
-})
-export class ProbeListContainerComponent implements OnInit {
-
-    probeHosts$: Observable<ProbeHost[]>;
-    pending$: Observable<boolean>;
-    error$:  Observable<any>;
-    @Output() select = new EventEmitter();
-
-    constructor(
-        private store: Store<any>,
-    ) {
-    }
-
-    ngOnInit() {
-        this.probeHosts$ = this.store.pipe(select(ProbeListContainerSelector.selectAll));
-        this.pending$ = this.store.pipe(select(ProbeListContainerSelector.selectPending));
-        this.error$ = this.store.pipe(select(ProbeListContainerSelector.selectError));
-
-        this.store.select(AuthContainerSelector.selectDomainMember).subscribe(
-            (domainMember: DomainMember) => {
-                this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domainMember.domain.id));
-            }
-        );
-    }
-
-    onSelect(probeHost: ProbeHost) {
-        this.select.emit(probeHost);
-    }
-
-}

@overflow/probe/container/probe-selector-container.component.html

@@ -1 +0,0 @@
-<of-probe-selector (select)="select.emit($event)" [probeHosts]="probeHosts$ | async" [probeHostID]="probeHostID"></of-probe-selector>

@overflow/probe/container/probe-selector-container.component.ts

@@ -1,33 +0,0 @@
-import { Component, EventEmitter, Output, OnInit, Input } from '@angular/core';
-import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
-import { Observable } from 'rxjs';
-import { Store, select } from '@ngrx/store';
-import * as ProbeEntityStore from '@overflow/probe/store/entity/probe';
-import { ProbeSelectorContainerSelector } from '@overflow/probe/store';
-import { AuthContainerSelector } from '@overflow/shared/auth/store';
-import { DomainMember } from '@overflow/commons-typescript/model/domain';
-
-@Component({
-    selector: 'of-probe-selector-container',
-    templateUrl: './probe-selector-container.component.html',
-})
-export class ProbeSelectorContainerComponent implements OnInit {
-
-    probeHosts$: Observable<ProbeHost[]>;
-    @Output() select = new EventEmitter();
-    @Input() probeHostID: number;
-
-    constructor(
-        private store: Store<any>,
-    ) {
-    }
-
-    ngOnInit() {
-        this.probeHosts$ = this.store.pipe(select(ProbeSelectorContainerSelector.selectAll));
-        this.store.select(AuthContainerSelector.selectDomainMember).subscribe(
-            (domainMember: DomainMember) => {
-                this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domainMember.domain.id));
-            }
-        );
-    }
-}

@overflow/probe/probe.module.ts

@@ -2,7 +2,6 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 import { COMPONENTS } from './component';
-import { CONTAINER_COMPONENTS } from './container';
 import { ProbeStoreModule } from './probe-store.module';
 import { SERVICES } from './service';
 import { FormsModule } from '@angular/forms';
@@ -18,11 +17,9 @@ import { UIModule } from '@overflow/shared/ui/ui.module';
     MetaModule,
   ],
   declarations: [
-    CONTAINER_COMPONENTS,
     COMPONENTS,
   ],
   exports: [
-    CONTAINER_COMPONENTS,
     COMPONENTS,
   ],
   providers: [

src/app/pages/discovery/discovery-page.component.html

@@ -2,8 +2,7 @@
     <div class="ui-g">
         <div class="ui-g-12">
             <div class="card no-margin">
-                <!--<of-discovery></of-discovery>-->
+                <of-discovery [probeHostID]="probeHostID"></of-discovery>
-              <of-discovery-container [probeHostID]="probeHostID"></of-discovery-container>
             </div>
         </div>
     </div>

src/app/pages/probes/noauth-probe/noauth-probe-page-routing.module.ts

@@ -1,8 +1,6 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { NoAuthProbePageComponent } from './noauth-probe-page.component';
-import { ProbeListComponent } from '@overflow/probe/component/list/list.component';
-import { ProbeDownloadComponent } from '@overflow/probe/component/download/download.component';
 
 const routes: Routes = [
   {

src/app/pages/probes/probe/probe-page.component.html

@@ -1,10 +1,7 @@
 <div *ngIf="!isDetail; else detailView">
-    <of-probe-list-container (select)="onProbeSelect($event)"></of-probe-list-container>
+    <of-probe-list (select)="onProbeSelect($event)"></of-probe-list>
 </div>
 
 <ng-template #detailView>
-    <of-probe-detail-container [probeHostID]="probeHostID"
+    <of-probe-detail [probeHostID]="probeHostID" (discovery)="onDiscovery($event)"></of-probe-detail>
-     (targetSelect)="onTargetSelect($event)"
-     (discovery)="onDiscovery($event)"
-     ></of-probe-detail-container>
 </ng-template>