probe list store

src/packages/member/member.module.ts

@@ -5,7 +5,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { MaterialModule } from 'app/commons/ui/material/material.module';
 
-import { AuthGuard } from './guard/auth.guard';
+// import { AuthGuard } from './guard/auth.guard';
 
 import { MemberStoreModule } from './member-store.module';
 

src/packages/probe/component/list/list.component.html

@@ -3,17 +3,17 @@
 
     <ng-container matColumnDef="name">
       <mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.name}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.displayName}} </mat-cell>
     </ng-container>
 
     <ng-container matColumnDef="ip">
       <mat-header-cell *matHeaderCellDef mat-sort-header> IP </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.ip}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.host.ip}} </mat-cell>
     </ng-container>
 
     <ng-container matColumnDef="os">
       <mat-header-cell *matHeaderCellDef mat-sort-header> OS </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.os}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.host.os.meta}} </mat-cell>
     </ng-container>
 
     <ng-container matColumnDef="cidr">
@@ -23,17 +23,17 @@
 
     <ng-container matColumnDef="targetCnt">
       <mat-header-cell *matHeaderCellDef mat-sort-header> Targets </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.targetCnt}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.targets.length}} </mat-cell>
     </ng-container>
 
     <ng-container matColumnDef="date">
       <mat-header-cell *matHeaderCellDef mat-sort-header> Date </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.date}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.authorizeDate.toLocaleString()}} </mat-cell>
     </ng-container>
 
     <ng-container matColumnDef="authBy">
       <mat-header-cell *matHeaderCellDef mat-sort-header> AuthBy </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.authBy}} </mat-cell>
+      <mat-cell *matCellDef="let element"> {{element.authorizeMember.name}} </mat-cell>
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="displayedColumns" ></mat-header-row>

src/packages/probe/component/list/list.component.ts

@@ -2,17 +2,7 @@ import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core';
 import { MatTableDataSource, MatSort } from '@angular/material';
 import { AfterContentInit } from '@angular/core/src/metadata/lifecycle_hooks';
 import { Router } from '@angular/router';
-
-export interface Probe {
-  id: string;
-  name: string;
-  ip: string;
-  os: string;
-  cidr: string;
-  targetCnt: number;
-  date: string;
-  authBy: string;
-}
+import { Probe } from '../../model';
 
 
 @Component({
@@ -35,14 +25,24 @@ export class ListComponent implements OnInit, AfterContentInit {
     const data: Probe[] = new Array();
     for (let i = 0; i < 10; i++) {
       const p: Probe = {
-        id: String('id' + i),
-        name: String('name' + i),
-        ip: String('ip' + i),
-        os: String('os' + i),
+        id: i,
+        displayName: String('displayName' + i),
+        host: {
+          ip: i,
+          os: {
+            meta: 'blahblahblah'
+          },
+        },
         cidr: String('cidr' + i),
-        targetCnt: i,
-        date: String('date' + i),
-        authBy: String('insanity')
+        targets: [
+          {
+            id: i,
+          },
+        ],
+        authorizeDate: new Date(),
+        authorizeMember: {
+          'name': String('insanity')
+        },
       };
       data.push(p);
     }

src/packages/probe/probe-store.module.ts

@@ -0,0 +1,24 @@
+import { NgModule } from '@angular/core';
+import { StoreModule } from '@ngrx/store';
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+import {
+  StoreRouterConnectingModule,
+  RouterStateSerializer,
+} from '@ngrx/router-store';
+import { EffectsModule } from '@ngrx/effects';
+import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store';
+
+import {
+  REDUCERS,
+  EFFECTS,
+} from './store';
+
+import { MODULE } from './probe.constant';
+
+@NgModule({
+  imports: [
+    StoreModule.forFeature(MODULE.name, REDUCERS),
+    EffectsModule.forFeature(EFFECTS),
+  ],
+})
+export class ProbeStoreModule { }

src/packages/probe/probe.constant.ts

@@ -0,0 +1,3 @@
+export const MODULE = {
+    name: 'probe'
+};

src/packages/probe/probe.module.ts

@@ -4,12 +4,15 @@ import { MaterialModule } from 'app/commons/ui/material/material.module';
 import { InfoTableModule } from 'app/commons/component/info-table/info-table.module';
 
 import { COMPONENTS } from './component';
+import { ProbeStoreModule } from './probe-store.module';
+import { SERVICES } from './service';
 
 @NgModule({
   imports: [
     CommonModule,
     MaterialModule,
     InfoTableModule,
+    ProbeStoreModule
   ],
   declarations: [
     COMPONENTS,
@@ -17,5 +20,8 @@ import { COMPONENTS } from './component';
   exports: [
     COMPONENTS,
   ],
+  providers: [
+    SERVICES,
+  ],
 })
 export class ProbeModule { }

src/packages/probe/service/probe.service.ts

@@ -5,6 +5,10 @@ import 'rxjs/add/operator/map';
 
 import { RPCService } from 'packages/commons/service/rpc.service';
 
+import { Domain } from 'packages/domain/model';
+
+import { Probe } from '../model';
+
 
 @Injectable()
 export class ProbeService {
@@ -15,4 +19,7 @@ export class ProbeService {
 
   }
 
+  public readAllByDomain(domain: Domain): Observable<Probe[]> {
+    return this.rpcService.call<Probe[]>('ProbeService.readAllByDomain', domain);
+  }
 }

src/packages/probe/store/index.ts

@@ -0,0 +1,13 @@
+import * as ProbeStore from './list';
+
+export interface State {
+  probe: ProbeStore.State;
+}
+
+export const REDUCERS = {
+  probe: ProbeStore.reducer,
+};
+
+export const EFFECTS = [
+  ProbeStore.Effects,
+];

src/packages/probe/store/list/index.ts

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

src/packages/probe/store/list/probe.action.ts

@@ -0,0 +1,38 @@
+import { Action } from '@ngrx/store';
+
+import { ErrorResponse } from 'packages/commons/service/error-response';
+
+import { Domain } from 'packages/domain/model';
+import { Probe } from '../../model';
+
+
+export enum ActionType {
+  ReadAllByDomain = '[probe.list] ReadAllByDomain',
+  ReadAllByDomainSuccess = '[probe.list] ReadAllByDomainSuccess',
+  ReadAllByDomainFailure = '[probe.list] ReadAllByDomainFailure',
+}
+
+export class ReadAllByDomain implements Action {
+  readonly type = ActionType.ReadAllByDomain;
+
+  constructor(public payload: Domain) {}
+}
+
+export class ReadAllByDomainSuccess implements Action {
+  readonly type = ActionType.ReadAllByDomainSuccess;
+
+  constructor(public payload: Probe[]) {}
+}
+
+export class ReadAllByDomainFailure implements Action {
+  readonly type = ActionType.ReadAllByDomainFailure;
+
+  constructor(public payload: ErrorResponse) {}
+}
+
+
+export type Actions =
+  | ReadAllByDomain
+  | ReadAllByDomainSuccess
+  | ReadAllByDomainFailure
+;

src/packages/probe/store/list/probe.effect.spec.ts

@@ -0,0 +1,15 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { Effects } from './probe.effect';
+
+describe('NoAuth-Probe.Effects', () => {
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [Effects]
+    });
+  });
+
+  it('should be created', inject([Effects], (effects: Effects) => {
+    expect(effects).toBeTruthy();
+  }));
+});

src/packages/probe/store/list/probe.effect.ts

@@ -0,0 +1,51 @@
+import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
+
+import { Effect, Actions, ofType } from '@ngrx/effects';
+import { Action } from '@ngrx/store';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/exhaustMap';
+import 'rxjs/add/operator/switchMap';
+import 'rxjs/add/operator/map';
+import 'rxjs/add/operator/take';
+
+import { ErrorResponse } from 'packages/commons/service/error-response';
+
+import { Domain } from 'packages/domain/model';
+
+import { Probe } from '../../model';
+import { ProbeService } from '../../service/probe.service';
+
+import {
+  ReadAllByDomain,
+  ReadAllByDomainFailure,
+  ReadAllByDomainSuccess,
+  ActionType
+} from './probe.action';
+
+@Injectable()
+export class Effects {
+
+  constructor(
+    private actions$: Actions,
+    private probeService: ProbeService,
+    private router: Router
+  ) { }
+
+  @Effect()
+  readAllByDomain$: Observable<Action> = this.actions$
+    .ofType(ActionType.ReadAllByDomain)
+    .map((action: ReadAllByDomain) => action.payload)
+    .switchMap(payload => this.probeService.readAllByDomain(payload))
+    .map(probes => {
+      return new ReadAllByDomainSuccess(probes);
+    })
+    .catch((error: ErrorResponse) => {
+      return of(new ReadAllByDomainFailure(error));
+    });
+}

src/packages/probe/store/list/probe.reducer.ts

@@ -0,0 +1,50 @@
+import { ErrorResponse } from 'packages/commons/service/error-response';
+
+import {
+  ReadAllByDomain,
+  ReadAllByDomainFailure,
+  ReadAllByDomainSuccess,
+  ActionType,
+  Actions,
+} from './probe.action';
+
+import {
+  State,
+  initialState,
+} from './probe.state';
+
+import { Probe } from '../../model';
+
+export function reducer(state = initialState, action: Actions): State {
+  switch (action.type) {
+    case ActionType.ReadAllByDomain: {
+      return {
+        ...state,
+        error: null,
+        isPending: true,
+      };
+    }
+
+    case ActionType.ReadAllByDomainSuccess: {
+      return {
+        ...state,
+        error: null,
+        isPending: false,
+        probes: action.payload,
+      };
+    }
+
+    case ActionType.ReadAllByDomainFailure: {
+      return {
+        ...state,
+        error: action.payload,
+        isPending: false,
+        probes: null,
+      };
+    }
+
+    default: {
+      return state;
+    }
+  }
+}

src/packages/probe/store/list/probe.state.ts

@@ -0,0 +1,19 @@
+import { ErrorResponse } from 'packages/commons/service/error-response';
+
+import { Probe } from '../../model';
+
+export interface State {
+  error: ErrorResponse | null;
+  isPending: boolean;
+  probes: Probe[] | null;
+}
+
+export const initialState: State = {
+  error: null,
+  isPending: false,
+  probes: null,
+};
+
+export const getProbes = (state: State) => state.probes;
+export const getError = (state: State) => state.error;
+export const isPending = (state: State) => state.isPending;

yarn.lock

@@ -403,6 +403,12 @@ amqplib@^0.5.2:
     readable-stream "1.x >=1.1.9"
     safe-buffer "^5.0.1"
 
+angular-l10n@^4.1.5:
+  version "4.1.5"
+  resolved "https://registry.yarnpkg.com/angular-l10n/-/angular-l10n-4.1.5.tgz#4b65cdb819be4daaaadc006ecf873d6ed1fd0fd4"
+  dependencies:
+    tslib "^1.7.1"
+
 ansi-html@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e"