ing

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

@@ -0,0 +1,5 @@
+import { NoAuthProbeListComponent } from './list/list.component';
+
+export const COMPONENTS = [
+    NoAuthProbeListComponent,
+];

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

@@ -0,0 +1,73 @@
+<h1>Unauthorized</h1>
+
+<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.descriptions.host.name}}</td>
+            <td>{{rowData.descriptions.host.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.descriptions.host.platform}}
+                        </div>
+
+                        <div class="ui-g-12">
+                            <b>Platform family:</b> {{rowData.descriptions.host.platformFamily}}
+                        </div>
+                        <div class="ui-g-12">
+                            <b>Kernel:</b> {{rowData.descriptions.host.kernelVersion}}
+                        </div>
+                        <div class="ui-g-12">
+                            <b>HostID:</b> {{rowData.descriptions.host.hostID}}
+                        </div>
+                    </div>
+
+                    <div class="ui-g-12 ui-md-6">
+                        <div class="ui-g">
+                            <div class="ui-g-12">
+                                <b>NIC:</b> {{rowData.descriptions.network.name}}
+                            </div>
+                            <div class="ui-g-12">
+                                <b>Network Address:</b> {{rowData.descriptions.network.address}}
+                            </div>
+                            <div class="ui-g-12">
+                                <b>Gateway:</b> {{rowData.descriptions.network.gateway}}
+                            </div>
+                            <div class="ui-g-12">
+                                <b>Mac Address:</b> {{rowData.descriptions.network.macAddress}}
+                            </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)"></button>
+                        <button class=" ui-button-width-fit" type="button" label="Accept" icon="fa-check" pButton (click)="onAcceptOrDeny(true, rowData)"></button>            
+                    </div>
+                </div>
+            </td>
+        </tr>
+    </ng-template>
+</p-table>
+<p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
+<p-growl [(value)]="msgs"></p-growl>

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

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

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

@@ -0,0 +1,42 @@
+import { Component, Input, Output, EventEmitter, AfterContentInit } from '@angular/core';
+import { NoAuthProbe } from '@overflow/commons-typescript/model/noauth';
+import { ConfirmationService, Message } from 'primeng/primeng';
+import { MessageService } from 'primeng/components/common/messageservice';
+
+@Component({
+  selector: 'of-noauth-list',
+  templateUrl: './list.component.html',
+  providers: [ConfirmationService, MessageService]
+})
+export class NoAuthProbeListComponent {
+  @Input() noauthProbes: NoAuthProbe[];
+  @Output() accept = new EventEmitter<NoAuthProbe>();
+  @Output() deny = new EventEmitter<NoAuthProbe>();
+  msgs: Message[];
+
+  constructor(
+    private confirmationService: ConfirmationService,
+    private messageService: MessageService
+  ) {
+  }
+
+  onAcceptOrDeny(isAccept: boolean, selected: NoAuthProbe) {
+    console.log(selected);
+    this.msgs = [];
+    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: () => {
+        isAccept ? this.accept.emit(selected) : this.deny.emit(selected);
+      },
+      reject: () => {
+      }
+    });
+  }
+}