arrange

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

@@ -2,14 +2,14 @@
 <!-- <div class="ui-g-12">
   <p-panel [showHeader]="false" >Temp Area</p-panel>
 </div> -->
+
 <div class="ui-g">
   <div class="ui-g-12 ui-md-3">
     <p-accordion (onClose)="onTabClose($event)" (onOpen)="OnTabOpen($event)">
       <p-accordionTab header="Probe Select Area" [selected]="true">
-        <of-probe-selector
+        <!-- <of-probe-selector
-          [preProbe]="probeHosts"
+          [preProbe]="selectedProbeHost"
-          (probeSelected)="onSelectedProbe($event)"
+          [probeHosts]="probeHosts"></of-probe-selector> -->
-        ></of-probe-selector>
       </p-accordionTab>
       <p-accordionTab header="Discovery Search Config Area" >
         <of-discovery-search-config

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

@@ -2,7 +2,7 @@ import {
   AfterContentInit, Component, Input,
   OnInit
 } from '@angular/core';
-import {Probe} from '@overflow/commons-typescript/model/probe';
+import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
 
 @Component({
   selector: 'of-discovery',
@@ -10,16 +10,19 @@ import {Probe} from '@overflow/commons-typescript/model/probe';
 })
 export class DiscoveryComponent implements OnInit, AfterContentInit {
 
-  @Input() probeHosts;
+  @Input() probeHostID: number;
 
   private tabIdx: number;
-  selectedProbe: Probe;
+  selectedProbeHost: ProbeHost;
 
   constructor(
   ) {
   }
 
   ngOnInit() {
+    // if (this.probeHostID) {
+    //   this.selectedProbeHost = this.probeHosts.find(probeHost => probeHost.id === this.probeHostID);
+    // }
   }
 
   ngAfterContentInit() {
@@ -43,7 +46,7 @@ export class DiscoveryComponent implements OnInit, AfterContentInit {
 
   onSelectedProbe(probe) {
     console.log(probe);
-    this.selectedProbe = probe;
+    // this.selectedProbe = probe;
   }
 
   onProbeSelect(probe) {

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

@@ -1,9 +0,0 @@
-<div *ngIf="!preProbe">
-  <p-dropdown #dropdown [options]="probes"
-              optionLabel="displayName"
-              placeholder="Select a Probe"
-              [(ngModel)]="selected"
-              (onChange)="onProbeSelect($event)"
-              [style]="{'width':'100%'}">
-  </p-dropdown>
-</div>

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

@@ -1,59 +0,0 @@
-import {
-  Component, OnInit, Input, AfterContentInit, Output,
-  EventEmitter, OnDestroy, ViewChild
-} from '@angular/core';
-
-import { Subscription } from 'rxjs/Subscription';
-import {Probe, ProbeHost} from '@overflow/commons-typescript/model/probe';
-
-@Component({
-  selector: 'of-probe-selector',
-  templateUrl: './probe-selector.component.html',
-})
-export class ProbeSelectorComponent implements OnInit, AfterContentInit, OnDestroy {
-
-  @Input() preProbe: ProbeHost;
-  probes: Probe[];
-  selected: Probe;
-
-  @Output() probeSelected = new EventEmitter<Probe>();
-
-  constructor(
-  ) {
-  }
-
-  ngOnInit() {
-
-  }
-
-  ngAfterContentInit() {
-    this.getProbes();
-  }
-
-  ngOnDestroy() {
-    this.selected = null;
-    this.probes = null;
-  }
-
-  getProbes() {
-
-  }
-
-  onProbeSelect(event) {
-    this.selected = event.value;
-    this.probeSelected.emit(this.selected);
-  }
-
-  registerOnChange(fn: any): void {
-  }
-
-  registerOnTouched(fn: any): void {
-  }
-
-  setDisabledState(isDisabled: boolean): void {
-  }
-
-  writeValue(obj: any): void {
-  }
-
-}

@overflow/discovery/component/index.ts

@@ -1,4 +1,3 @@
-import { ProbeSelectorComponent } from './discovery/probe-selector/probe-selector.component';
 import { ServiceSelectorComponent } from './discovery/service-selector/service-selector.component';
 import { DiscoveryComponent } from './discovery/discovery.component';
 import { SearchConfigComponent } from './discovery/search-config/search-config.component';
@@ -8,7 +7,6 @@ import { IpInputComponent } from './discovery/search-config/ip-input.component';
 
 export const COMPONENTS = [
   ServiceSelectorComponent,
-  ProbeSelectorComponent,
   DiscoveryComponent,
   SearchConfigComponent,
   SearchFilterComponent,

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

@@ -1 +1,2 @@
-<of-discovery [probeHosts]="probeHosts$ | async"></of-discovery>
+<of-probe-selector-container [probeHostID]="probeHostID"></of-probe-selector-container>
+<of-discovery [probeHostID]="probeHostID"></of-discovery>

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

@@ -1,53 +1,19 @@
 import {
-  AfterContentInit, Component, Input,
+  Component,
-  OnInit
+  Input,
 } from '@angular/core';
-import { select, Store} from '@ngrx/store';
-import { ActivatedRoute } from '@angular/router';
-import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
-
-import { AuthSelector } from '@overflow/member/store';
-import { Domain } from '@overflow/commons-typescript/model/domain';
-import * as ProbeEntityStore from '@overflow/probe/store/entity/probe';
-import {Observable} from 'rxjs';
-import { ProbeEntitySelector } from '@overflow/probe/store';
 
 @Component({
   selector: 'of-discovery-container',
   templateUrl: './discovery-container.component.html',
 })
-export class DiscoveryContainerComponent implements OnInit, AfterContentInit {
+export class DiscoveryContainerComponent {
 
-  // probe select ?
+  @Input() probeHostID;
-  // get probe list for server
-  // discovery start
-  // discovery stop
-  // get service list
-  @Input() hostID;
-
-  probeHosts$: Observable<Probe[]>;
-  selectProbes?: Probe[];
 
   constructor(
-    private activatedRoute: ActivatedRoute,
-    private store: Store<ProbeEntityStore.State>
   ) {
-      this.probeHosts$ = store.pipe(select(ProbeEntitySelector.selectAll));
-
   }
 
-  ngOnInit() {
-    this.store.select(AuthSelector.select('domain')).subscribe(
-      (domain: Domain) => {
-        this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domain.id));
-      },
-      (error) => {
-        console.log(error);
-      }
-    );
-  }
-
-  ngAfterContentInit() {
-  }
 
 }

@overflow/discovery/discovery.module.ts

@@ -11,6 +11,7 @@ import { SERVICES } from './service';
 import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
 import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
 import { CONTAINER_COMPONENTS } from './container';
+import { ProbeModule } from '../probe/probe.module';
 
 @NgModule({
   imports: [
@@ -21,7 +22,8 @@ import { CONTAINER_COMPONENTS } from './container';
     DiscoveryStoreModule,
     DiscoveryRPCModule,
     DiscoveryLoggerModule,
-    KeyValueModule
+    KeyValueModule,
+    ProbeModule
   ],
   declarations: [
     COMPONENTS,

@overflow/member/container/index.ts

@@ -3,5 +3,5 @@ import { MemberSignupContainerComponent } from './member-signup-container.compon
 
 export const CONTAINERS = [
   MemberSigninContainerComponent,
-  MemberSignupContainerComponent,
+  // MemberSignupContainerComponent,
 ];

@overflow/probe/component/index.ts

@@ -1,9 +1,11 @@
 import { ProbeDetailComponent } from './detail/detail.component';
 import { ProbeListComponent } from './list/list.component';
 import { ProbeDownloadComponent } from './download/download.component';
+import { ProbeSelectorComponent } from './selector/selector.component';
 
 export const COMPONENTS = [
   ProbeListComponent,
   ProbeDetailComponent,
   ProbeDownloadComponent,
+  ProbeSelectorComponent,
 ];

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

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

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

@@ -0,0 +1,29 @@
+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[];
+
+  constructor() {
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    this.options = [];
+    for (const ph of this.probeHosts) {
+      this.options.push(ph.probe);
+    }
+  }
+
+  onProbeSelect(event) {
+    this.select.emit(event.data);
+  }
+}

@overflow/probe/container/index.ts

@@ -1,7 +1,9 @@
 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.ts

@@ -1,9 +1,9 @@
 import { Component, OnInit, Input, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
 import { Observable } from 'rxjs';
-import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
+import { ProbeHost } from '@overflow/commons-typescript/model/probe';
 import { Store, select } from '@ngrx/store';
 import * as ProbeStore from '../store/entity/probe';
-import { ProbeEntitySelector, ProbeDetailContainerSelector } from '../store';
+import { ProbeDetailContainerSelector } from '../store';
 import { ActivatedRoute } from '@angular/router';
 
 @Component({
@@ -19,15 +19,15 @@ export class ProbeDetailContainerComponent implements OnInit, OnChanges {
   error$: Observable<any>;
 
   constructor(
-    private store: Store<ProbeStore.State>,
+    private store: Store<any>,
     private route: ActivatedRoute,
   ) {
-    this.pending$ = this.store.pipe(select(ProbeDetailContainerSelector.selectPending));
-    this.error$ = this.store.pipe(select(ProbeEntitySelector.selectError));
   }
 
   ngOnInit() {
-    this.probeHost$ = this.store.pipe(select(ProbeEntitySelector.selectOne(this.probeHostID)));
+    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 {

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

@@ -3,9 +3,9 @@ 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 { ProbeEntitySelector, ProbeListContainerSelector } from '../store';
+import { ProbeListContainerSelector } from '../store';
-import { AuthSelector } from '@overflow/member/store';
+import { AuthContainerSelector } from '../../shared/auth/store';
-import { Domain } from '@overflow/commons-typescript/model/domain';
+import { DomainMember } from '@overflow/commons-typescript/model/domain';
 
 @Component({
     selector: 'of-probe-list-container',
@@ -15,22 +15,20 @@ export class ProbeListContainerComponent implements OnInit {
 
     probeHosts$: Observable<ProbeHost[]>;
     pending$: Observable<boolean>;
+    error$:  Observable<any>;
     @Output() select = new EventEmitter();
 
     constructor(
-        private store: Store<ProbeEntityStore.State>,
+        private store: Store<any>,
     ) {
-        this.probeHosts$ = store.pipe(select(ProbeEntitySelector.selectAll));
-        this.pending$ = store.pipe(select(ProbeListContainerSelector.selectPending));
     }
 
     ngOnInit() {
-        this.store.select(AuthSelector.select('domain')).subscribe(
+        this.probeHosts$ = this.store.pipe(select(ProbeListContainerSelector.selectAll));
-            (domain: Domain) => {
+        this.pending$ = this.store.pipe(select(ProbeListContainerSelector.selectPending));
-                this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domain.id));
+        this.store.select(AuthContainerSelector.selectDomainMember).subscribe(
-            },
+            (domainMember: DomainMember) => {
-            (error) => {
+                this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domainMember.domain.id));
-                console.log(error);
             }
         );
     }

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

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

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

@@ -0,0 +1,39 @@
+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 { ProbeListContainerSelector } 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(ProbeListContainerSelector.selectAll));
+        this.store.select(AuthContainerSelector.selectDomainMember).subscribe(
+            (domainMember: DomainMember) => {
+                this.store.dispatch(new ProbeEntityStore.ReadAllByDomainID(domainMember.domain.id));
+            }
+        );
+    }
+
+    onSelect(probeHost: ProbeHost) {
+        alert(probeHost.probe.displayName);
+        // this.select.emit(probeHost);
+    }
+
+}

@overflow/probe/probe.module.ts

@@ -7,7 +7,6 @@ import { ProbeStoreModule } from './probe-store.module';
 import { SERVICES } from './service';
 import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 import { FormsModule } from '@angular/forms';
-import { DiscoveryModule } from '@overflow/discovery/discovery.module';
 import { MetaCrawlerModule } from '@overflow/meta/crawler/crawler.module';
 import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
 
@@ -17,7 +16,6 @@ import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.
     PrimeNGModules,
     ProbeStoreModule,
     FormsModule,
-    DiscoveryModule,
     KeyValueModule,
     MetaCrawlerModule
   ],

@overflow/probe/store/container/probe-detail/probe-detail.reducer.ts

@@ -2,6 +2,7 @@ import { ActionType, Actions } from '../../entity/probe';
 import {
   State,
   initialState,
+  probeListContainerAdapter
 } from './probe-detail.state';
 
 import { Probe } from '@overflow/commons-typescript/model/probe';
@@ -16,17 +17,11 @@ export function reducer(state = initialState, action: Actions): State {
     }
 
     case ActionType.ReadSuccess: {
-      return {
+      return probeListContainerAdapter.setOne(action.payload, {...state, pending: false});
-        ...state,
-        pending: false,
-      };
     }
 
     case ActionType.ReadFailure: {
-      return {
+      return probeListContainerAdapter.setError(action.payload, {...state, pending: false});
-        ...state,
-        pending: true,
-      };
     }
 
     default: {

@overflow/probe/store/container/probe-detail/probe-detail.state.ts

@@ -1,15 +1,19 @@
+import { RPCClientError } from '@loafer/ng-rpc';
+import { ProbeHost } from '@overflow/commons-typescript/model/probe';
 import { Selector, createSelector } from '@ngrx/store';
 import { createEntityAdapter, EntityState } from '@loafer/ng-entity';
 
-export interface State {
+export const probeListContainerAdapter = createEntityAdapter<ProbeHost, RPCClientError>();
+export interface State extends EntityState<ProbeHost, RPCClientError> {
   pending: boolean;
 }
-export const initialState: State = {
+export const initialState: State = probeListContainerAdapter.getInitialState({
   pending: false,
-};
+});
 
 export function getSelectors<S>(selector: Selector<any, State>) {
   return {
+    ...probeListContainerAdapter.getSelectors(selector),
     selectPending: createSelector(selector, (state: State) => state.pending),
   };
 }

@overflow/probe/store/container/probe-list/probe-list.reducer.ts

@@ -2,6 +2,7 @@ import { ActionType, Actions } from '../../entity/probe';
 import {
   State,
   initialState,
+  probeListContainerAdapter
 } from './probe-list.state';
 
 import { Probe } from '@overflow/commons-typescript/model/probe';
@@ -16,17 +17,11 @@ export function reducer(state = initialState, action: Actions): State {
     }
 
     case ActionType.ReadAllByDomainIDSuccess: {
-      return {
+      return probeListContainerAdapter.setAll(action.payload, {...state, pending: false});
-        ...state,
-        pending: false,
-      };
     }
 
     case ActionType.ReadAllByDomainIDFailure: {
-      return {
+      return probeListContainerAdapter.setError(action.payload, {...state, pending: false});
-        ...state,
-        pending: true,
-      };
     }
 
     default: {

@overflow/probe/store/container/probe-list/probe-list.state.ts

@@ -1,15 +1,21 @@
+import { RPCClientError } from '@loafer/ng-rpc';
+import { ProbeHost } from '@overflow/commons-typescript/model/probe';
 import { Selector, createSelector } from '@ngrx/store';
 import { createEntityAdapter, EntityState } from '@loafer/ng-entity';
 
-export interface State {
+export const probeListContainerAdapter = createEntityAdapter<ProbeHost, RPCClientError>();
+export interface State extends EntityState<ProbeHost, RPCClientError> {
   pending: boolean;
 }
-export const initialState: State = {
+export const initialState: State = probeListContainerAdapter.getInitialState({
   pending: false,
-};
+});
 
 export function getSelectors<S>(selector: Selector<any, State>) {
   return {
+    ...probeListContainerAdapter.getSelectors(selector),
     selectPending: createSelector(selector, (state: State) => state.pending),
   };
 }
+
+

@overflow/probe/store/entity/probe/index.ts

@@ -1,4 +1,2 @@
 export * from './probe.action';
 export * from './probe.effect';
-export * from './probe.reducer';
-export * from './probe.state';

@overflow/probe/store/entity/probe/probe.reducer.ts

@@ -1,65 +0,0 @@
-import {
-  ActionType,
-  Actions,
-} from './probe.action';
-
-import {
-  State,
-  initialState,
-  probeAdapter,
-} from './probe.state';
-
-import { Probe } from '@overflow/commons-typescript/model/probe';
-
-export function reducer(state = initialState, action: Actions): State {
-  switch (action.type) {
-    case ActionType.ReadAllByDomainID: {
-      return {
-        ...state,
-        error: null,
-      };
-    }
-
-    case ActionType.ReadAllByDomainIDSuccess: {
-      return probeAdapter.setAll(action.payload, state);
-    }
-
-    case ActionType.ReadAllByDomainIDFailure: {
-      return probeAdapter.setError(action.payload, state);
-    }
-
-    case ActionType.Read: {
-      return {
-        ...state,
-        error: null,
-      };
-    }
-
-    case ActionType.ReadSuccess: {
-      return probeAdapter.setOne(action.payload, state);
-    }
-
-    case ActionType.ReadFailure: {
-      return probeAdapter.setError(action.payload, state);
-    }
-
-    case ActionType.Modify: {
-      return {
-        ...state,
-        error: null,
-      };
-    }
-
-    case ActionType.ModifySuccess: {
-      return probeAdapter.upsertOne(action.payload, state);
-    }
-
-    case ActionType.ModifyFailure: {
-      return probeAdapter.setError(action.payload, state);
-    }
-
-    default: {
-      return state;
-    }
-  }
-}

@overflow/probe/store/entity/probe/probe.state.ts

@@ -1,14 +0,0 @@
-import { RPCClientError } from '@loafer/ng-rpc';
-import { ProbeHost } from '@overflow/commons-typescript/model/probe';
-import { Selector, createSelector } from '@ngrx/store';
-import { createEntityAdapter, EntityState } from '@loafer/ng-entity';
-
-export const probeAdapter = createEntityAdapter<ProbeHost, RPCClientError>();
-export interface State extends EntityState<ProbeHost, RPCClientError> {
-}
-export const initialState: State = probeAdapter.getInitialState();
-
-export function getSelectors<S>(selector: Selector<any, State>) {
-  return probeAdapter.getSelectors(selector);
-}
-

@overflow/probe/store/index.ts

@@ -13,13 +13,11 @@ import * as ProbeListContainerStore from './container/probe-list';
 import * as ProbeDetailContainerStore from './container/probe-detail';
 
 export interface State {
-  probe: ProbeEntityStore.State;
   probe_list_container: ProbeListContainerStore.State;
   probe_detail_container: ProbeDetailContainerStore.State;
 }
 
 export const REDUCERS = {
-  probe: ProbeEntityStore.reducer,
   probe_list_container: ProbeListContainerStore.reducer,
   probe_detail_container: ProbeDetailContainerStore.reducer
 };
@@ -30,11 +28,6 @@ export const EFFECTS = [
 
 export const selectState = createFeatureSelector<State>(MODULE.name);
 
-export const ProbeEntitySelector = ProbeEntityStore.getSelectors(createSelector(
-  selectState,
-  (state: State) => state.probe
-));
-
 export const ProbeListContainerSelector = ProbeListContainerStore.getSelectors(createSelector(
   selectState,
   (state: State) => state.probe_list_container

@overflow/sensor/component/detail/detail.component.html

@@ -1,4 +1,5 @@
-<div *ngIf="sensor">
+SENSOR_DETAIL_COMPONENT
+<!-- <div *ngIf="sensor">
     <h1>{{sensor.crawler.name}}</h1>
 
     <div class="ui-g">
@@ -52,4 +53,4 @@
     </div>
     <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
 </div>
-
+ -->

@overflow/sensor/component/list/list.component.html

@@ -77,7 +77,7 @@
                             <div class="ui-g-10">
                                 <div *ngFor="let sensor of item.sensors" class="ui-g-12">
                                     <i class="fa ui-icon-stop ui-status-icon ui-status-warn"></i>
-                                    <a href="javascript:void(0)" (click)="onSensorClick(sensor)">{{sensor.crawler.name}} | {{sensor.itemCount}} items | {{sensor.status.name}}</a>
+                                    <a href="javascript:void(0)" (click)="select.emit(sensor)">{{sensor.crawler.name}} | {{sensor.itemCount}} items | {{sensor.status.name}}</a>
                                 </div>
                             </div>
                             <div class="ui-g-2" style="text-align: center !important">

@overflow/sensor/component/list/list.component.ts

@@ -11,6 +11,7 @@ export class SensorListComponent implements OnChanges {
 
   @Input() page: Page<Sensor>;
   @Output() addSensor = new EventEmitter();
+  @Output() select = new EventEmitter<Sensor>();
 
   totalLength: number;
   targetSensors: Object;

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

@@ -1 +1 @@
-<of-sensor-list [page]="page$ | async" (addSensor)="addSensor.emit($event)"></of-sensor-list>
+<of-sensor-list [page]="page$ | async" (addSensor)="addSensor.emit($event)" (select)="select.emit($event)"></of-sensor-list>

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

@@ -3,7 +3,7 @@
         <div class="ui-g-12">
             <div class="card no-margin">
                 <!--<of-discovery></of-discovery>-->
-              <of-discovery-container (hostID)="hostId"></of-discovery-container>
+              <of-discovery-container [probeHostID]="probeHostID"></of-discovery-container>
             </div>
         </div>
     </div>

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

@@ -7,7 +7,7 @@ import { ActivatedRoute } from '@angular/router';
 })
 export class DiscoveryPageComponent implements OnInit {
 
-  hostId: number;
+  probeHostID: number;
 
   constructor(
     private route: ActivatedRoute
@@ -15,8 +15,7 @@ export class DiscoveryPageComponent implements OnInit {
 
   ngOnInit() {
     this.route.params.subscribe((params: any) => {
-      this.hostId = params['probeHostID'];
+      this.probeHostID = params['probeHostID'];
-      // console.log('probeHostID : ' + probeHostID);
     });
   }
 }

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

@@ -2,7 +2,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 { NoAuthProbeListComponent } from '@overflow/noauth-probe/component/list/list.component';
 import { ProbeDownloadComponent } from '@overflow/probe/component/download/download.component';
 
 const routes: Routes = [

src/app/pages/sensors/sensor/sensor-page.component.html

@@ -1,8 +1,4 @@
-<div *ngIf="!isDetail; else detailView">
+<of-sensor-list-container *ngIf="containerType === 1" (select)="onSensorSelect($event)" (addSensor)="onAddSensor($event)">
-    <of-sensor-list-container *ngIf="router.url === '/sensor/list'" (select)="onSensorSelect($event)" (addSensor)="onAddSensor($event)"> </of-sensor-list-container>
+</of-sensor-list-container>
-    <of-sensor-setting-container  *ngIf="router.url === '/sensor/setting'"></of-sensor-setting-container>
+<of-sensor-detail-container *ngIf="containerType === 2"></of-sensor-detail-container>
-</div>
+<of-sensor-setting-container *ngIf="containerType === 3"></of-sensor-setting-container>
-
-<ng-template #detailView>
-    <of-sensor-detail-container></of-sensor-detail-container>
-</ng-template>

src/app/pages/sensors/sensor/sensor-page.component.ts

@@ -4,13 +4,19 @@ import { Sensor } from '@overflow/commons-typescript/model/sensor';
 import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
 import { Target } from '@overflow/commons-typescript/model/target';
 
+enum CONTAINER_TYPES {
+  List = 1,
+  Detail,
+  Setting,
+}
+
 @Component({
   selector: 'of-pages-sensor',
   templateUrl: './sensor-page.component.html',
 })
 export class SensorPageComponent {
 
-  isDetail: boolean;
+  containerType: CONTAINER_TYPES;
   sensorID: string;
 
   constructor(
@@ -31,7 +37,11 @@ export class SensorPageComponent {
     this.breadcrumbService.setItems([
       { label: 'Sensor', routerLink: ['/sensor/list'], }
     ]);
-    this.isDetail = false;
+    if (this.router.url === '/sensor/list') {
+      this.containerType = CONTAINER_TYPES.List;
+    } else {
+      this.containerType = CONTAINER_TYPES.Setting;
+    }
   }
 
   onDetailContainer(sensorID: string) {
@@ -40,7 +50,7 @@ export class SensorPageComponent {
       { label: 'Sensor', routerLink: ['/sensor/list'] },
       { label: this.sensorID }
     ]);
-    this.isDetail = true;
+    this.containerType = CONTAINER_TYPES.Detail;
   }
 
   onSensorSelect(sensor: Sensor) {