diff --git a/@overflow/infra/component/index.ts b/@overflow/infra/component/index.ts
index 8ecb3d3..6d30f48 100644
--- a/@overflow/infra/component/index.ts
+++ b/@overflow/infra/component/index.ts
@@ -1,7 +1,11 @@
 import { InfraMapComponent } from './infra-map.component';
 import { InfraTreeComponent } from './infra-tree.component';
+import { InfraHostOSComponent } from './infra-host-os.component';
+import { InfraHostIPsComponent } from './infra-host-ips.component';
 
 export const COMPONENTS = [
   InfraMapComponent,
-  InfraTreeComponent
+  InfraTreeComponent,
+  InfraHostOSComponent,
+  InfraHostIPsComponent
 ];
diff --git a/@overflow/infra/component/infra-host-ips.component.html b/@overflow/infra/component/infra-host-ips.component.html
new file mode 100644
index 0000000..d8a2f64
--- /dev/null
+++ b/@overflow/infra/component/infra-host-ips.component.html
@@ -0,0 +1,29 @@
+<div class="ui-g">
+  <div class="ui-g-6 ui-nopad">
+    <h3>NICs</h3>
+  </div>
+
+  <!-- info -->
+  <div class="ui-g ui-bottom-space-10">
+    <p-table *ngIf="infraHostIPs" [value]="infraHostIPs" selectionMode="single" (onRowSelect)="select.emit($event.data)" [resizableColumns]="true">
+      <ng-template pTemplate="header">
+        <tr>
+          <th>Interface</th>
+          <th style="width:3em">Ver.</th>
+          <th>Address</th>
+          <th>Mac address</th>
+          <th>Gateway</th>
+        </tr>
+      </ng-template>
+      <ng-template pTemplate="body" let-rowData>
+        <tr [pSelectableRow]="rowData">
+          <td>{{rowData.iface}}</td>
+          <td>{{rowData.metaIPType.key}}</td>
+          <td>{{rowData.address}}</td>
+          <td>{{rowData.mac}}</td>
+          <td>{{rowData.gateway}}</td>
+        </tr>
+      </ng-template>
+    </p-table>
+  </div>
+</div>
\ No newline at end of file
diff --git a/@overflow/infra/component/infra-host-ips.component.ts b/@overflow/infra/component/infra-host-ips.component.ts
new file mode 100644
index 0000000..604f38e
--- /dev/null
+++ b/@overflow/infra/component/infra-host-ips.component.ts
@@ -0,0 +1,18 @@
+import {
+  Component, Input, Output, EventEmitter
+} from '@angular/core';
+import { InfraHostIP } from '@overflow/commons-typescript';
+
+@Component({
+  selector: 'of-infra-host-ips',
+  templateUrl: './infra-host-ips.component.html',
+})
+export class InfraHostIPsComponent {
+
+  @Input() infraHostIPs: InfraHostIP[];
+  @Output() select = new EventEmitter<InfraHostIP>();
+
+  constructor(
+  ) {
+  }
+}
diff --git a/@overflow/infra/component/infra-host-os.component.html b/@overflow/infra/component/infra-host-os.component.html
new file mode 100644
index 0000000..0a1f0a8
--- /dev/null
+++ b/@overflow/infra/component/infra-host-os.component.html
@@ -0,0 +1,35 @@
+<div class="ui-g">
+  <div class="ui-g-6 ui-nopad">
+    <h3>Host</h3>
+  </div>
+
+  <!-- info -->
+  <div class="ui-g ui-bottom-space-10">
+    <div class="ui-g-12 ui-nopad">
+      <p-panel [showHeader]="false">
+        <div *ngIf="infraHostOS">
+          <div class="ui-g">
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.name">
+              <of-key-value [key]="'Name'" [value]="infraHostOS.name"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.os">
+              <of-key-value [key]="'OS'" [value]="infraHostOS.os"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.platform">
+              <of-key-value [key]="'Platform'" [value]="infraHostOS.platform"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.platformFamily">
+              <of-key-value [key]="'PlatformFamily'" [value]="infraHostOS.platformFamily"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.kervelVersion">
+              <of-key-value [key]="'Kernel'" [value]="infraHostOS.kervelVersion"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value" *ngIf="infraHostOS.hostID">
+              <of-key-value [key]="'Host ID'" [value]="infraHostOS.hostID"></of-key-value>
+            </div>
+          </div>
+        </div>
+      </p-panel>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/@overflow/infra/component/infra-host-os.component.ts b/@overflow/infra/component/infra-host-os.component.ts
new file mode 100644
index 0000000..eff7d40
--- /dev/null
+++ b/@overflow/infra/component/infra-host-os.component.ts
@@ -0,0 +1,17 @@
+import {
+  Component, Input
+} from '@angular/core';
+import { InfraHostOS } from '@overflow/commons-typescript/model/infra';
+
+@Component({
+  selector: 'of-infra-host-os',
+  templateUrl: './infra-host-os.component.html',
+})
+export class InfraHostOSComponent {
+
+  @Input() infraHostOS: InfraHostOS;
+
+  constructor(
+  ) {
+  }
+}
diff --git a/@overflow/noauth-probe/component/index.ts b/@overflow/noauth-probe/component/index.ts
index 4bf7e89..f06cb63 100644
--- a/@overflow/noauth-probe/component/index.ts
+++ b/@overflow/noauth-probe/component/index.ts
@@ -1,7 +1,9 @@
 import { NoAuthProbeListComponent } from './noauth-probe-list.component';
 import { NoAuthProbeDetailComponent } from './noauth-probe-detail.component';
+import { NoAuthProbeGeneralComponent } from './noauth-probe-general.component';
 
 export const COMPONENTS = [
     NoAuthProbeListComponent,
-    NoAuthProbeDetailComponent
+    NoAuthProbeDetailComponent,
+    NoAuthProbeGeneralComponent,
 ];
diff --git a/@overflow/noauth-probe/component/noauth-probe-detail.component.html b/@overflow/noauth-probe/component/noauth-probe-detail.component.html
index ab4b2fa..97dc1fc 100644
--- a/@overflow/noauth-probe/component/noauth-probe-detail.component.html
+++ b/@overflow/noauth-probe/component/noauth-probe-detail.component.html
@@ -1,11 +1,18 @@
-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>
+<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
+<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
+
+<p-panel *ngIf="noAuthProbe" #content [showHeader]="false" class="block-panel">
+  <of-noauth-probe-general [noAuthProbe]="noAuthProbe"></of-noauth-probe-general>
+  <!-- <<of-infra-host-machine></of-infra-host-machine> -->
+  <of-infra-host-os [infraHostOS]="noAuthProbe.infraHost.infraHostOS"></of-infra-host-os>
+  <of-infra-host-ips [infraHostIPs]="noAuthProbe.infraHost.infraHostIPs" (select)="onNICSelect($event)"></of-infra-host-ips>
+
 
   <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>
+    <button class="ui-button-width-fit" [disabled]="!selectedNIC" type="button" label="Accept" icon="ui-icon-check" pButton (click)="accept()"></button>
+    <button class="ui-button-danger ui-button-width-fit" [disabled]="!selectedNIC" type="button" label="Deny" icon="ui-icon-close"
+      pButton (click)="deny()"></button>
   </div>
-</p-panel> -->
\ No newline at end of file
+</p-panel>
+
+<p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
\ No newline at end of file
diff --git a/@overflow/noauth-probe/component/noauth-probe-detail.component.ts b/@overflow/noauth-probe/component/noauth-probe-detail.component.ts
index 000bcfb..69f6e7b 100644
--- a/@overflow/noauth-probe/component/noauth-probe-detail.component.ts
+++ b/@overflow/noauth-probe/component/noauth-probe-detail.component.ts
@@ -4,42 +4,86 @@ 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';
+import { NoAuthProbe, InfraHostIP } from '@overflow/commons-typescript';
+import { ConfirmationService } from 'primeng/primeng';
 
 @Component({
   selector: 'of-noauth-probe-detail',
   templateUrl: './noauth-probe-detail.component.html',
+  providers: [ConfirmationService]
 })
 export class NoAuthProbeDetailComponent implements OnInit {
 
-  // @Input() probeHostID;
+  @Input() id: number;
   pending$: Observable<boolean>;
+  noAuthProbe: NoAuthProbe;
   error$: Observable<any>;
-
-  @Output() discovery = new EventEmitter<number>();
+  selectedNIC: InfraHostIP;
+  @Output() back = new EventEmitter();
 
   constructor(
     private noAuthProbeService: NoAuthProbeService,
+    private confirmationService: ConfirmationService,
   ) {
   }
 
   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();
+    this.noAuthProbeService.read(this.id)
+      .pipe(
+        tap(() => {
+          this.pending$ = of(true);
+        }),
+        map((noauthProbe: NoAuthProbe) => {
+          noauthProbe.infraHost = JSON.parse(noauthProbe.infraHostMeta);
+          this.noAuthProbe = noauthProbe;
+        }),
+        catchError(error => {
+          this.error$ = of(error);
+          return of();
+        }),
+        tap(() => {
+          this.pending$ = of(false);
+        }),
+        take(1),
+    ).subscribe();
   }
 
+  onNICSelect(infraHostIP: InfraHostIP) {
+    this.selectedNIC = infraHostIP;
+    console.log(this.selectedNIC);
+  }
+
+  accept() {
+    this.confirmationService.confirm({
+      header: 'Are you sure to accept this Probe?',
+      message: 'Start collecting data as a Probe.',
+      icon: 'fa-check',
+      accept: () => {
+        this.noAuthProbeService.acceptNoAuthProbe(this.id, this.selectedNIC.address)
+          .pipe(
+            tap(() => {
+              this.pending$ = of(true);
+            }),
+            map((noauthProbes: NoAuthProbe[]) => {
+              this.back.emit();
+            }),
+            catchError(error => {
+              this.error$ = of(error);
+              return of();
+            }),
+            tap(() => {
+              this.pending$ = of(false);
+            }),
+            take(1),
+        ).subscribe();
+      },
+      reject: () => {
+
+      }
+    });
+  }
+
+  deny() {
+    alert('609호에 있는 강아지 deny');
+  }
 }
diff --git a/@overflow/noauth-probe/component/noauth-probe-general.component.html b/@overflow/noauth-probe/component/noauth-probe-general.component.html
new file mode 100644
index 0000000..483ff4d
--- /dev/null
+++ b/@overflow/noauth-probe/component/noauth-probe-general.component.html
@@ -0,0 +1,36 @@
+<div class="ui-g">
+  <div class="ui-g-6 ui-nopad">
+    <h3>General</h3>
+  </div>
+
+  <!-- info -->
+  <div class="ui-g ui-bottom-space-10">
+    <div class="ui-g-12 ui-nopad">
+      <p-panel [showHeader]="false">
+        <div *ngIf="noAuthProbe">
+          <div class="ui-g">
+            <div class="ui-g-12 ui-md-6 ui-key-value">
+              <of-key-value [key]="'API Key'" [value]="noAuthProbe.apiKey"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value">
+              <of-key-value [key]="'Created at'" [value]="noAuthProbe.createDate | date: 'dd/MM/yyyy'"></of-key-value>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value">
+              <ng-container [ngSwitch]="noAuthProbe.connectDate">
+                <ng-container *ngSwitchCase="undefined">
+                  <of-key-value [key]="'Connection'" [value]="'Not connected.'"></of-key-value>
+                </ng-container>
+                <ng-container *ngSwitchDefault>
+                  <of-key-value [key]="'Connection'" [value]="noAuthProbe.connectDate | date: 'dd/MM/yyyy' (noAuthProbe.connectAddress)"></of-key-value>
+                </ng-container>
+              </ng-container>
+            </div>
+            <div class="ui-g-12 ui-md-6 ui-key-value">
+              <of-key-value [key]="'Uptime'" [value]="'TODO'"></of-key-value>
+            </div>
+          </div>
+        </div>
+      </p-panel>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/@overflow/noauth-probe/component/noauth-probe-general.component.ts b/@overflow/noauth-probe/component/noauth-probe-general.component.ts
new file mode 100644
index 0000000..810165e
--- /dev/null
+++ b/@overflow/noauth-probe/component/noauth-probe-general.component.ts
@@ -0,0 +1,18 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { NoAuthProbe } from '@overflow/commons-typescript';
+
+@Component({
+  selector: 'of-noauth-probe-general',
+  templateUrl: './noauth-probe-general.component.html',
+})
+export class NoAuthProbeGeneralComponent implements OnInit {
+
+  @Input() noAuthProbe: NoAuthProbe;
+
+  constructor(
+  ) {
+  }
+
+  ngOnInit() {
+  }
+}
diff --git a/@overflow/noauth-probe/noauth-probe.module.ts b/@overflow/noauth-probe/noauth-probe.module.ts
index 23bfe2c..1dbe2c5 100644
--- a/@overflow/noauth-probe/noauth-probe.module.ts
+++ b/@overflow/noauth-probe/noauth-probe.module.ts
@@ -8,6 +8,7 @@ import { NoAuthProbeLoggerModule } from './noauth-probe-logger.module';
 import { COMPONENTS } from './component';
 
 import { SERVICES } from './service';
+import { InfraModule } from '../infra/infra.module';
 
 @NgModule({
   imports: [
@@ -15,6 +16,7 @@ import { SERVICES } from './service';
     NoAuthProbeRPCModule,
     NoAuthProbeLoggerModule,
     UIModule,
+    InfraModule
   ],
   declarations: [
     COMPONENTS,
diff --git a/@overflow/noauth-probe/service/noauth-probe.service.ts b/@overflow/noauth-probe/service/noauth-probe.service.ts
index 9ea0de3..4b71874 100644
--- a/@overflow/noauth-probe/service/noauth-probe.service.ts
+++ b/@overflow/noauth-probe/service/noauth-probe.service.ts
@@ -28,4 +28,8 @@ export class NoAuthProbeService {
   public denyNoauthProbe(id: number): Observable<NoAuthProbe[]> {
     return this.rpcService.call<NoAuthProbe[]>('NoAuthProbeService.denyNoauthProbe', id);
   }
+
+  public read(id: number): Observable<NoAuthProbe> {
+    return this.rpcService.call<NoAuthProbe>('NoAuthProbeService.read', id);
+  }
 }
diff --git a/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.html b/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.html
index 260b4ed..6c2dfb2 100644
--- a/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.html
+++ b/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.html
@@ -1 +1 @@
-<of-noauth-probe-detail [id]="id"></of-noauth-probe-detail>
\ No newline at end of file
+<of-noauth-probe-detail [id]="id" (back)="onBack($event)"></of-noauth-probe-detail>
\ No newline at end of file
diff --git a/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.ts b/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.ts
index 2073ce3..c1ac8d3 100644
--- a/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.ts
+++ b/src/app/pages/probes/noauth-probe/noauth-probe-detail-page.component.ts
@@ -1,7 +1,6 @@
 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',
@@ -14,14 +13,17 @@ export class NoAuthProbeDetailPageComponent {
   constructor(
     private breadcrumbService: BreadcrumbService,
     private activatedRoute: ActivatedRoute,
-    private router: Router,
+    private router: Router
   ) {
     breadcrumbService.setItems([
       { label: 'Probe', routerLink: ['/probe/list'] },
       { label: 'Unauthroized', routerLink: ['/probe/noauth'] },
     ]);
     this.id = this.activatedRoute.snapshot.params['id'];
+  }
 
+  onBack() {
+    this.router.navigate(['probe/noauth']);
   }
 
 }
diff --git a/src/app/pages/probes/probe/probe-detail-page.component.ts b/src/app/pages/probes/probe/probe-detail-page.component.ts
index 7e4e0c2..82db9bd 100644
--- a/src/app/pages/probes/probe/probe-detail-page.component.ts
+++ b/src/app/pages/probes/probe/probe-detail-page.component.ts
@@ -29,4 +29,8 @@ export class ProbeDetailPageComponent {
   onDiscovery(probeHostID: number) {
     this.router.navigate(['discovery', probeHostID]);
   }
+
+  onBack() {
+    this.router.navigate
+  }
 }