noauth list/detail

@overflow/noauth-probe/component/index.ts

@@ -1,5 +1,7 @@
 import { NoAuthProbeListComponent } from './noauth-probe-list.component';
+import { NoAuthProbeDetailComponent } from './noauth-probe-detail.component';
 
 export const COMPONENTS = [
     NoAuthProbeListComponent,
+    NoAuthProbeDetailComponent
 ];

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

@@ -0,0 +1,11 @@
+noauthprobe_detail
+<!-- <p-panel *ngIf="probeHost" #content [showHeader]="false" class="block-panel">
+  <of-probe-general [probe]="probeHost.probe" (modified)="modifiedGeneral($event)"></of-probe-general>
+  <of-probe-host [infraHost]="probeHost.infraHost"></of-probe-host>
+
+  <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)="remove(probeHost)"></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/noauth-probe/component/noauth-probe-detail.component.ts

@@ -0,0 +1,45 @@
+import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
+import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
+import { Store, select } from '@ngrx/store';
+import { Observable, of, Subscription } from 'rxjs';
+import { catchError, exhaustMap, map, tap, take } from 'rxjs/operators';
+import { NoAuthProbeService } from '../service/noauth-probe.service';
+
+@Component({
+  selector: 'of-noauth-probe-detail',
+  templateUrl: './noauth-probe-detail.component.html',
+})
+export class NoAuthProbeDetailComponent implements OnInit {
+
+  // @Input() probeHostID;
+  pending$: Observable<boolean>;
+  error$: Observable<any>;
+
+  @Output() discovery = new EventEmitter<number>();
+
+  constructor(
+    private noAuthProbeService: NoAuthProbeService,
+  ) {
+  }
+
+  ngOnInit() {
+    // this.noAuthProbeService.read(1)
+    //   .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();
+  }
+
+}

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

@@ -4,94 +4,22 @@
 <of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
 
 <p-panel #content [showHeader]="false" class="block-panel">
-  <p-table #dt [value]="noauthProbes" selectionMode="single" dataKey="id">
+  <p-table [value]="noauthProbes" selectionMode="single" dataKey="id" (onRowSelect)="select.emit($event.data)">
     <ng-template pTemplate="header">
       <tr>
-        <th style="width: 3.25em" pResizableColumn></th>
+        <th>Probe Key</th>
-        <th style="width: 20em">Probe Key</th>
         <th>Host Name</th>
         <th>OS</th>
-        <th style="width: 7em">Created at</th>
+        <th>Created at</th>
       </tr>
     </ng-template>
-    <ng-template pTemplate="body" let-rowData let-expanded="expanded" let-columns="columns">
+    <ng-template pTemplate="body" let-rowData>
-      <tr [pSelectableRow]="rowData" [pRowToggler]="rowData">
+      <tr [pSelectableRow]="rowData">
-        <td>
-          <a href="#">
-            <i [ngClass]="expanded ? 'fa fa-fw fa-chevron-circle-down' : 'fa fa-fw fa-chevron-circle-right'"></i>
-          </a>
-        </td>
         <td>{{rowData.tempProbeKey}}</td>
         <td>{{rowData.infraHost.infraHostOS.name}}</td>
         <td>{{rowData.infraHost.infraHostOS.os}}</td>
         <td>{{rowData.createDate | date: 'dd/MM/yyyy'}}</td>
       </tr>
     </ng-template>
-    <ng-template pTemplate="rowexpansion" let-rowData let-columns="columns">
-      <tr>
-        <td [attr.colspan]="5">
-          <div class="ui-g ui-g-12">
-
-            <div class="ui-g-12 ui-md-6">
-              <div class="ui-g-12">
-                <b>Platform:</b> {{rowData.infraHost.infraHostOS.platform}}
-              </div>
-
-              <div class="ui-g-12">
-                <b>Platform family:</b> {{rowData.infraHost.infraHostOS.platformFamily}}
-              </div>
-              <div class="ui-g-12">
-                <b>Kernel:</b> {{rowData.infraHost.infraHostOS.kernelVersion}}
-              </div>
-              <div class="ui-g-12">
-                <b>HostID:</b> {{rowData.infraHost.infraHostOS.hostID}}
-              </div>
-              <div class="ui-g-12">
-                <b>Connected:</b>
-                <ng-container [ngSwitch]="rowData.connectDate">
-                  <ng-container *ngSwitchCase="undefined"> Not Connected</ng-container>
-                  <ng-container *ngSwitchDefault> {{rowData.connectDate | date: 'dd/MM/yyyy'}} ({{rowData.connectAddress}})</ng-container>
-                </ng-container>
-              </div>
-            </div>
-
-            <div class="ui-g-12 ui-md-6">
-              <div class="ui-g">
-                <div class="ui-g-12">
-                  <b>NIC:</b> {{rowData.infraHost.infraHostIPs[0].iface}}
-                </div>
-                <div class="ui-g-12">
-                  <b>Network Address:</b> {{rowData.infraHost.infraHostIPs[0].address}}
-                </div>
-                <div class="ui-g-12">
-                  <b>Gateway:</b> {{rowData.infraHost.infraHostIPs[0].gateway}}
-                </div>
-                <div class="ui-g-12">
-                  <b>Mac Address:</b> {{rowData.infraHost.infraHostIPs[0].mac}}
-                </div>
-                <div class="ui-g-12">
-                </div>
-              </div>
-            </div>
-            <div class="ui-g-12" dir="rtl">
-              <button class="ui-button-danger ui-button-width-fit" type="button" label="Deny" icon="ui-icon-close" pButton (click)="onAcceptOrDeny(false, rowData.infraHost.infraHostIPs)"></button>
-              <button class=" ui-button-width-fit" type="button" label="Accept" icon="fa-check" pButton (click)="onAccept(rowData.infraHost)"></button>
-            </div>
-          </div>
-        </td>
-      </tr>
-    </ng-template>
   </p-table>
-
-  <p-dialog *ngIf="selectedInfraHost" [(visible)]="visibleNICs" [contentStyle]="{'max-height':'400px'}">
-    <ul>
-      <li *ngFor="let infraHostIP of selectedInfraHost.infraHostIPs">
-        <a style="cursor: pointer" (click)="onNICSelected(infraHostIP)">
-          {{infraHostIP.iface}} {{infraHostIP.address}} {{infraHostIP.gateway}} {{infraHostIP.mac}}
-        </a>
-        <li>
-    </ul>
-  </p-dialog>
-
-  <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
 </p-panel>

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

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

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

@@ -1,8 +1,7 @@
-import { Component, Input, Output, EventEmitter, AfterContentInit, OnInit, OnDestroy } from '@angular/core';
+import { Component, OnInit, OnDestroy, Output, EventEmitter } from '@angular/core';
 import { Store, select } from '@ngrx/store';
 import { Observable, of, Subscription } from 'rxjs';
 import { catchError, exhaustMap, map, tap, take } from 'rxjs/operators';
-import { ConfirmationService, Message } from 'primeng/primeng';
 
 import { NoAuthProbe } from '@overflow/commons-typescript/model/noauth';
 import { AuthSelector } from '@overflow/shared/auth/store';
@@ -10,12 +9,10 @@ import { DomainMember } from '@overflow/commons-typescript/model/domain';
 
 import { NoAuthProbeService } from '../service/noauth-probe.service';
 import { NoAuthProbeSubscriber, NoAuthProbeNotify } from '../subscriber/noauth-probe.subscriber';
-import { InfraHostIP, InfraHost } from '@overflow/commons-typescript';
 
 @Component({
   selector: 'of-noauth-probe-list',
   templateUrl: './noauth-probe-list.component.html',
-  providers: [ConfirmationService]
 })
 export class NoAuthProbeListComponent implements OnInit, OnDestroy {
   pending$: Observable<boolean>;
@@ -24,11 +21,9 @@ export class NoAuthProbeListComponent implements OnInit, OnDestroy {
   noauthProbes: NoAuthProbe[];
   noauthProbeSubscription: Subscription;
 
-  selectedInfraHost: InfraHost;
+  @Output() select = new EventEmitter<NoAuthProbe>();
-  visibleNICs: boolean;
 
   constructor(
-    private confirmationService: ConfirmationService,
     private store: Store<any>,
     private noAuthProbeService: NoAuthProbeService,
     private noAuthProbeSubscriber: NoAuthProbeSubscriber,
@@ -85,65 +80,6 @@ export class NoAuthProbeListComponent implements OnInit, OnDestroy {
     }
   }
 
-  onAccept(infraHost: InfraHost) {
-    this.selectedInfraHost = infraHost;
-    this.visibleNICs = true;
-  }
-
-  onAcceptOrDeny(isAccept: boolean, selected: NoAuthProbe) {
-    const title = isAccept ?
-      'Are you sure to accept this Probe?' : 'Are you sure to deny this Probe';
-    const message = isAccept ?
-      'Start collecting data as a Probe.' : 'It will be permanently deleted.';
-
-    this.confirmationService.confirm({
-      header: title,
-      message: message,
-      icon: isAccept ? 'fa-check' : 'fa fa-trash',
-      accept: () => {
-        if (isAccept) {
-          this.noAuthProbeService.acceptNoAuthProbe(selected.id, '')
-            .pipe(
-              tap(() => {
-                this.pending$ = of(true);
-              }),
-              map((noauthProbes: NoAuthProbe[]) => {
-                this.setNoauthProbes(noauthProbes);
-              }),
-              catchError(error => {
-                this.setError$(error);
-                return of();
-              }),
-              tap(() => {
-                this.pending$ = of(false);
-              }),
-              take(1),
-          ).subscribe();
-        } else {
-          this.noAuthProbeService.denyNoauthProbe(selected.id)
-            .pipe(
-              tap(() => {
-                this.pending$ = of(true);
-              }),
-              map((noauthProbes: NoAuthProbe[]) => {
-                this.setNoauthProbes(noauthProbes);
-              }),
-              catchError(error => {
-                this.setError$(error);
-                return of();
-              }),
-              tap(() => {
-                this.pending$ = of(false);
-              }),
-              take(1),
-          ).subscribe();
-        }
-      },
-      reject: () => {
-      }
-    });
-  }
-
   private setNoauthProbes(noauthProbes: NoAuthProbe[]): void {
     if (null === noauthProbes) {
       return;
@@ -158,7 +94,4 @@ export class NoAuthProbeListComponent implements OnInit, OnDestroy {
     this.error$ = of(error);
   }
 
-  onNICSelected(infraHostIP: InfraHostIP) {
-    console.log(infraHostIP);
-  }
 }

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

@@ -0,0 +1,97 @@
+<!-- <h1>Unauthorized</h1>
+
+<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
+<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
+
+<p-panel #content [showHeader]="false" class="block-panel">
+  <p-table #dt [value]="noauthProbes" selectionMode="single" dataKey="id">
+    <ng-template pTemplate="header">
+      <tr>
+        <th style="width: 3.25em" pResizableColumn></th>
+        <th style="width: 20em">Probe Key</th>
+        <th>Host Name</th>
+        <th>OS</th>
+        <th style="width: 7em">Created at</th>
+      </tr>
+    </ng-template>
+    <ng-template pTemplate="body" let-rowData let-expanded="expanded" let-columns="columns">
+      <tr [pSelectableRow]="rowData" [pRowToggler]="rowData">
+        <td>
+          <a href="#">
+            <i [ngClass]="expanded ? 'fa fa-fw fa-chevron-circle-down' : 'fa fa-fw fa-chevron-circle-right'"></i>
+          </a>
+        </td>
+        <td>{{rowData.tempProbeKey}}</td>
+        <td>{{rowData.infraHost.infraHostOS.name}}</td>
+        <td>{{rowData.infraHost.infraHostOS.os}}</td>
+        <td>{{rowData.createDate | date: 'dd/MM/yyyy'}}</td>
+      </tr>
+    </ng-template>
+    <ng-template pTemplate="rowexpansion" let-rowData let-columns="columns">
+      <tr>
+        <td [attr.colspan]="5">
+          <div class="ui-g ui-g-12">
+
+            <div class="ui-g-12 ui-md-6">
+              <div class="ui-g-12">
+                <b>Platform:</b> {{rowData.infraHost.infraHostOS.platform}}
+              </div>
+
+              <div class="ui-g-12">
+                <b>Platform family:</b> {{rowData.infraHost.infraHostOS.platformFamily}}
+              </div>
+              <div class="ui-g-12">
+                <b>Kernel:</b> {{rowData.infraHost.infraHostOS.kernelVersion}}
+              </div>
+              <div class="ui-g-12">
+                <b>HostID:</b> {{rowData.infraHost.infraHostOS.hostID}}
+              </div>
+              <div class="ui-g-12">
+                <b>Connected:</b>
+                <ng-container [ngSwitch]="rowData.connectDate">
+                  <ng-container *ngSwitchCase="undefined"> Not Connected</ng-container>
+                  <ng-container *ngSwitchDefault> {{rowData.connectDate | date: 'dd/MM/yyyy'}} ({{rowData.connectAddress}})</ng-container>
+                </ng-container>
+              </div>
+            </div>
+
+            <div class="ui-g-12 ui-md-6">
+              <div class="ui-g">
+                <div class="ui-g-12">
+                  <b>NIC:</b> {{rowData.infraHost.infraHostIPs[0].iface}}
+                </div>
+                <div class="ui-g-12">
+                  <b>Network Address:</b> {{rowData.infraHost.infraHostIPs[0].address}}
+                </div>
+                <div class="ui-g-12">
+                  <b>Gateway:</b> {{rowData.infraHost.infraHostIPs[0].gateway}}
+                </div>
+                <div class="ui-g-12">
+                  <b>Mac Address:</b> {{rowData.infraHost.infraHostIPs[0].mac}}
+                </div>
+                <div class="ui-g-12">
+                </div>
+              </div>
+            </div>
+            <div class="ui-g-12" dir="rtl">
+              <button class="ui-button-danger ui-button-width-fit" type="button" label="Deny" icon="ui-icon-close" pButton (click)="onAcceptOrDeny(false, rowData.infraHost.infraHostIPs)"></button>
+              <button class=" ui-button-width-fit" type="button" label="Accept" icon="fa-check" pButton (click)="onAccept(rowData.infraHost)"></button>
+            </div>
+          </div>
+        </td>
+      </tr>
+    </ng-template>
+  </p-table>
+
+  <p-dialog *ngIf="selectedInfraHost" [(visible)]="visibleNICs" [contentStyle]="{'max-height':'400px'}">
+    <ul>
+      <li *ngFor="let infraHostIP of selectedInfraHost.infraHostIPs">
+        <a style="cursor: pointer" (click)="onNICSelected(infraHostIP)">
+          {{infraHostIP.iface}} {{infraHostIP.address}} {{infraHostIP.gateway}} {{infraHostIP.mac}}
+        </a>
+        <li>
+    </ul>
+  </p-dialog>
+
+  <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
+</p-panel> -->

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

@@ -0,0 +1,164 @@
+// import { Component, Input, Output, EventEmitter, AfterContentInit, OnInit, OnDestroy } from '@angular/core';
+// import { Store, select } from '@ngrx/store';
+// import { Observable, of, Subscription } from 'rxjs';
+// import { catchError, exhaustMap, map, tap, take } from 'rxjs/operators';
+// import { ConfirmationService, Message } from 'primeng/primeng';
+
+// import { NoAuthProbe } from '@overflow/commons-typescript/model/noauth';
+// import { AuthSelector } from '@overflow/shared/auth/store';
+// import { DomainMember } from '@overflow/commons-typescript/model/domain';
+
+// import { NoAuthProbeService } from '../service/noauth-probe.service';
+// import { NoAuthProbeSubscriber, NoAuthProbeNotify } from '../subscriber/noauth-probe.subscriber';
+// import { InfraHostIP, InfraHost } from '@overflow/commons-typescript';
+
+// @Component({
+//   selector: 'of-noauth-probe-list',
+//   templateUrl: './noauth-probe-list.component.html',
+//   providers: [ConfirmationService]
+// })
+// export class NoAuthProbeListComponent implements OnInit, OnDestroy {
+//   pending$: Observable<boolean>;
+//   error$: Observable<any>;
+
+//   noauthProbes: NoAuthProbe[];
+//   noauthProbeSubscription: Subscription;
+
+//   selectedInfraHost: InfraHost;
+//   visibleNICs: boolean;
+
+//   constructor(
+//     private confirmationService: ConfirmationService,
+//     private store: Store<any>,
+//     private noAuthProbeService: NoAuthProbeService,
+//     private noAuthProbeSubscriber: NoAuthProbeSubscriber,
+//   ) {
+//     this.noauthProbes = [];
+//     this.noauthProbeSubscription = null;
+//   }
+
+//   ngOnInit() {
+//     this.store.pipe(
+//       tap(() => {
+//         this.pending$ = of(true);
+//       }),
+//       select(AuthSelector.selectDomainMember),
+//       exhaustMap((domainMember: DomainMember) =>
+//         this.noAuthProbeService.readAllByDomainID(domainMember.domain.id)
+//           .pipe(
+//             map((noauthProbes: NoAuthProbe[]) => {
+//               this.setNoauthProbes(noauthProbes);
+//             }),
+//             catchError(error => {
+//               this.setError$(error);
+//               return of();
+//             })
+//           )
+//       ),
+//       tap(() => {
+//         this.pending$ = of(false);
+//       }),
+//       take(1),
+//     ).subscribe();
+
+//     this.noauthProbeSubscription = this.noAuthProbeSubscriber.observable().pipe(
+//       tap((noAuthProbeNotify: NoAuthProbeNotify) => {
+//         const noauthProbes = [];
+//         this.noauthProbes.forEach(noauthProbe => {
+//           const n = noAuthProbeNotify.params;
+//           if (noauthProbe.id === n.id) {
+//             noauthProbes.push(n);
+//           } else {
+//             noauthProbes.push(noauthProbe);
+//           }
+//         });
+
+//         this.setNoauthProbes(noauthProbes);
+//       }
+//       ),
+//     ).subscribe();
+//   }
+
+//   ngOnDestroy(): void {
+//     if (null !== this.noauthProbeSubscription) {
+//       this.noauthProbeSubscription.unsubscribe();
+//     }
+//   }
+
+//   onAccept(infraHost: InfraHost) {
+//     this.selectedInfraHost = infraHost;
+//     this.visibleNICs = true;
+//   }
+
+//   onAcceptOrDeny(isAccept: boolean, selected: NoAuthProbe) {
+//     const title = isAccept ?
+//       'Are you sure to accept this Probe?' : 'Are you sure to deny this Probe';
+//     const message = isAccept ?
+//       'Start collecting data as a Probe.' : 'It will be permanently deleted.';
+
+//     this.confirmationService.confirm({
+//       header: title,
+//       message: message,
+//       icon: isAccept ? 'fa-check' : 'fa fa-trash',
+//       accept: () => {
+//         if (isAccept) {
+//           this.noAuthProbeService.acceptNoAuthProbe(selected.id)
+//             .pipe(
+//               tap(() => {
+//                 this.pending$ = of(true);
+//               }),
+//               map((noauthProbes: NoAuthProbe[]) => {
+//                 this.setNoauthProbes(noauthProbes);
+//               }),
+//               catchError(error => {
+//                 this.setError$(error);
+//                 return of();
+//               }),
+//               tap(() => {
+//                 this.pending$ = of(false);
+//               }),
+//               take(1),
+//           ).subscribe();
+//         } else {
+//           this.noAuthProbeService.denyNoauthProbe(selected.id)
+//             .pipe(
+//               tap(() => {
+//                 this.pending$ = of(true);
+//               }),
+//               map((noauthProbes: NoAuthProbe[]) => {
+//                 this.setNoauthProbes(noauthProbes);
+//               }),
+//               catchError(error => {
+//                 this.setError$(error);
+//                 return of();
+//               }),
+//               tap(() => {
+//                 this.pending$ = of(false);
+//               }),
+//               take(1),
+//           ).subscribe();
+//         }
+//       },
+//       reject: () => {
+//       }
+//     });
+//   }
+
+//   private setNoauthProbes(noauthProbes: NoAuthProbe[]): void {
+//     if (null === noauthProbes) {
+//       return;
+//     }
+//     noauthProbes.forEach(noauthProbe => {
+//       noauthProbe.infraHost = JSON.parse(noauthProbe.infraHostMeta);
+//     });
+//     this.noauthProbes = noauthProbes;
+//   }
+
+//   private setError$(error: any): void {
+//     this.error$ = of(error);
+//   }
+
+//   onNICSelected(infraHostIP: InfraHostIP) {
+//     console.log(infraHostIP);
+//   }
+// }

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

@@ -0,0 +1 @@
+<of-noauth-probe-detail [id]="id"></of-noauth-probe-detail>

src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.ts

@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
+import { ActivatedRoute, Router } from '@angular/router';
+import { NoAuthProbe } from '@overflow/commons-typescript';
+
+@Component({
+  selector: 'of-pages-noauth-probe-detail',
+  templateUrl: './noauth-probe-detail-page.component.html',
+})
+export class NoAuthProbeDetailPageComponent {
+
+  id: number;
+
+  constructor(
+    private breadcrumbService: BreadcrumbService,
+    private activatedRoute: ActivatedRoute,
+    private router: Router,
+  ) {
+    breadcrumbService.setItems([
+      { label: 'Probe', routerLink: ['/probe/list'] },
+      { label: 'Unauthroized', routerLink: ['/probe/noauth'] },
+    ]);
+    this.id = this.activatedRoute.snapshot.params['id'];
+
+  }
+
+}

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

@@ -0,0 +1 @@
+<of-noauth-probe-list (select)="onNoAuthProbeSelect($event)"></of-noauth-probe-list>

src/app/pages/probes/noauth-probe/noauth-probe-list-page.component.ts

@@ -0,0 +1,26 @@
+import { Component } from '@angular/core';
+import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
+import { Router } from '@angular/router';
+import { NoAuthProbe } from '@overflow/commons-typescript';
+
+@Component({
+  selector: 'of-pages-noauth-probe-list',
+  templateUrl: './noauth-probe-list-page.component.html',
+})
+export class NoAuthProbeListPageComponent {
+
+
+  constructor(
+    private breadcrumbService: BreadcrumbService,
+    private router: Router
+  ) {
+    breadcrumbService.setItems([
+      { label: 'Probe', routerLink: ['/probe/list'] },
+      { label: 'Unauthroized', routerLink: ['/probe/noauth'] },
+    ]);
+  }
+
+  onNoAuthProbeSelect(noAuthProbe: NoAuthProbe) {
+    this.router.navigate(['probe/noauth', noAuthProbe.id]);
+  }
+}

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

@@ -1 +0,0 @@
-<of-noauth-probe-list></of-noauth-probe-list>

src/app/pages/probes/noauth-probe/noauth-probe-page.component.ts

@@ -1,18 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
-
-@Component({
-  selector: 'of-pages-noauth-probe',
-  templateUrl: './noauth-probe-page.component.html',
-})
-export class NoAuthProbePageComponent {
-
-  constructor(
-    private breadcrumbService: BreadcrumbService
-  ) {
-    breadcrumbService.setItems([
-      { label: 'Probe', routerLink: ['/probe/list'] },
-      { label: 'Unauthroized', routerLink: ['/probe/noauth'] },
-    ]);
-  }
-}

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

@@ -3,8 +3,9 @@ import { Routes, RouterModule } from '@angular/router';
 import { ProbeTabPageComponent } from './probe-tab-page.component';
 import { ProbeListPageComponent } from '@app/pages/probes/probe/probe-list-page.component';
 import { ProbeDetailPageComponent } from '@app/pages/probes/probe/probe-detail-page.component';
-import { NoAuthProbePageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-page.component';
 import { ProbeDownloadPageComponent } from '@app/pages/probes/download/download-page.component';
+import { NoAuthProbeListPageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-list-page.component';
+import { NoAuthProbeDetailPageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-detail-page.component';
 
 const routes: Routes = [
   {
@@ -12,7 +13,8 @@ const routes: Routes = [
     component: ProbeTabPageComponent,
     children: [
       { path: 'list', component: ProbeListPageComponent },
-      { path: 'noauth', component: NoAuthProbePageComponent },
+      { path: 'noauth', component: NoAuthProbeListPageComponent },
+      { path: 'noauth/:id', component: NoAuthProbeDetailPageComponent },
       { path: 'download', component: ProbeDownloadPageComponent },
       { path: 'download/:idx', component: ProbeDownloadPageComponent },
       { path: ':id/info', component: ProbeDetailPageComponent },

src/app/pages/probes/probe-tab-page.module.ts

@@ -9,9 +9,10 @@ import { ProbeTabPageRoutingModule } from './probe-tab-page-routing.module';
 import { TabbarModule } from '../../commons/component/layout/tabbar/app.tabbar.module';
 import { ProbeListPageComponent } from '@app/pages/probes/probe/probe-list-page.component';
 import { ProbeDetailPageComponent } from '@app/pages/probes/probe/probe-detail-page.component';
-import { NoAuthProbePageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-page.component';
 import { ProbeDownloadPageComponent } from '@app/pages/probes/download/download-page.component';
 import { NoauthProbeModule } from '@overflow/noauth-probe/noauth-probe.module';
+import { NoAuthProbeDetailPageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-detail-page.component';
+import { NoAuthProbeListPageComponent } from '@app/pages/probes/noauth-probe/noauth-probe-list-page.component';
 
 @NgModule({
   imports: [
@@ -26,8 +27,9 @@ import { NoauthProbeModule } from '@overflow/noauth-probe/noauth-probe.module';
     ProbeTabPageComponent,
     ProbeListPageComponent,
     ProbeDetailPageComponent,
-    NoAuthProbePageComponent,
+    ProbeDownloadPageComponent,
-    ProbeDownloadPageComponent
+    NoAuthProbeListPageComponent,
+    NoAuthProbeDetailPageComponent
   ]
 })
 export class ProbeTabPageModule { }