Added request/response command capability

Added copyright header to source files Added exact search in device/gateway list and service Signed-off-by: Hoang Sa Nguyen <[email protected]>
eclipse-hono · Oct 31, 2023 · 0c51c23 · 0c51c23
1 parent 02df08f
commit 0c51c23
Show file tree

Hide file tree

Showing 122 changed files with 2,123 additions and 786 deletions.
diff --git a/device-management-ui/package.json b/device-management-ui/package.json
@@ -35,6 +35,7 @@
     "@angular/compiler-cli": "^15.2.0",
     "@angular/localize": "^15.2.0",
     "@types/jasmine": "~4.3.0",
+    "@types/lodash": "^4.14.197",
     "jasmine-core": "~4.5.0",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.1.0",

diff --git a/device-management-ui/src/app/app.component.spec.ts b/device-management-ui/src/app/app.component.spec.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import { TestBed } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 import {HttpClientTestingModule} from "@angular/common/http/testing";

diff --git a/device-management-ui/src/app/app.component.ts b/device-management-ui/src/app/app.component.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import { Component } from '@angular/core';
 import './prototypes/string-prototype1'
 import {GoogleService} from "./services/google/google.service";

diff --git a/device-management-ui/src/app/app.module.ts b/device-management-ui/src/app/app.module.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import {NgModule} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
 import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
@@ -42,11 +57,11 @@ import {SortableTableDirective} from './services/sortable-table/sortable-table.d
 import {FaIconLibrary, FontAwesomeModule} from "@fortawesome/angular-fontawesome";
 import {fas} from "@fortawesome/free-solid-svg-icons";
 import {ToastContainerComponent} from './components/toast-container/toast-container.component';
-import {ConfigAccordionComponent} from './components/devices/device-detail/list-config/config-accordion/config-accordion.component';
 import {TruncatePipe} from './shared/truncate.pipe';
 import {GatewayListComponent} from './components/gateways/gateway-list/gateway-list.component';
 import { SelectDevicesComponent } from './components/modals/select-devices/select-devices.component';
 import { CreateAndBindModalComponent } from './components/modals/create-and-bind-modal/create-and-bind-modal.component';
+import { PaginationComponent } from './components/pagination/pagination.component';
 
 @NgModule({
   declarations: [
@@ -72,11 +87,11 @@ import { CreateAndBindModalComponent } from './components/modals/create-and-bind
     LoaderSpinnerComponent,
     SortableTableDirective,
     ToastContainerComponent,
-    ConfigAccordionComponent,
     TruncatePipe,
     GatewayListComponent,
     SelectDevicesComponent,
-    CreateAndBindModalComponent
+    CreateAndBindModalComponent,
+    PaginationComponent
   ],
   imports: [
     BrowserModule,

diff --git a/device-management-ui/src/app/components/date-time/date-time-picker.component.spec.ts b/device-management-ui/src/app/components/date-time/date-time-picker.component.spec.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {DateTimePickerComponent} from './date-time-picker.component';

diff --git a/device-management-ui/src/app/components/date-time/date-time-picker.component.ts b/device-management-ui/src/app/components/date-time/date-time-picker.component.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
 import {NgbCalendar, NgbDateStruct} from "@ng-bootstrap/ng-bootstrap";
 
@@ -8,15 +23,13 @@ import {NgbCalendar, NgbDateStruct} from "@ng-bootstrap/ng-bootstrap";
 })
 export class DateTimePickerComponent implements OnInit {
 
-  @Input()
-  public secretDate: string | undefined = '';
+  @Input() public secretDate: string | undefined = '';
 
-  @Output()
-  public dateTime: EventEmitter<any> = new EventEmitter<any>();
-  protected date: NgbDateStruct | any;
-  protected time: any = {hour: 0, minute: 0, second: 0};
+  @Output() public dateTime: EventEmitter<any> = new EventEmitter<any>();
 
-  protected maxDate: NgbDateStruct = {year: new Date().getUTCFullYear() + 100, month: 12, day: 31};
+  public date: NgbDateStruct | any;
+  public time: any = {hour: 0, minute: 0, second: 0};
+  public maxDate: NgbDateStruct = {year: new Date().getUTCFullYear() + 100, month: 12, day: 31};
 
   constructor(private calendar: NgbCalendar) {
   }
@@ -47,16 +60,16 @@ export class DateTimePickerComponent implements OnInit {
     });
   }
 
-  protected showTimezoneOffsetMessage(): boolean {
+  public showTimezoneOffsetMessage(): boolean {
     return this.timezoneOffset !== 0;
   }
 
-  protected getTimezoneOffsetMessage() {
+  public getTimezoneOffsetMessage() {
     return 'Your timezone differ to UTC time, please be aware that the UTC time (%h hour) will be taken.'
       .replace('%h', String(this.timezoneOffset));
   }
 
-  protected getTimeString(time: any): string {
+  public getTimeString(time: any): string {
     const paddedHour = String(time.hour).padStart(2, '0');
     const paddedMinute = String(time.minute).padStart(2, '0');
     const paddedSecond = String(time.second).padStart(2, '0');

diff --git a/device-management-ui/src/app/components/devices/device-detail/device-detail.component.html b/device-management-ui/src/app/components/devices/device-detail/device-detail.component.html
@@ -21,30 +21,35 @@
 
   <div class="page-functions small-buttons col-auto ml-auto">
     <div class="function-element">
-      <button (click)="updateConfig()" [ngbTooltip]="updateLabel" class="btn btn-sm btn-primary" type="button">
+      <button (click)="updateConfig()" class="btn btn-sm btn-primary" type="button">
         <fa-icon [icon]="['fas', 'gears']"></fa-icon>
+        <span>Update Config</span>
       </button>
     </div>
     <div class="function-element">
-      <button (click)="sendCommand()" [ngbTooltip]="sendLabel" class="btn btn-sm btn-primary" type="button">
+      <button (click)="sendCommand()" class="btn btn-sm btn-primary" type="button">
         <fa-icon [icon]="['fas', 'share']"></fa-icon>
+        <span>Send Command</span>
       </button>
     </div>
     <div class="function-element">
-      <button (click)="addAuthentication()" [ngbTooltip]="addAuthenticationLabel" class="btn btn-sm btn-primary"
+      <button (click)="addAuthentication()" class="btn btn-sm btn-primary"
               type="button">
           <fa-icon [icon]="['fas', 'key']"></fa-icon>
+          <span>Add Credentials</span>
       </button>
     </div>
     <div *ngIf="!isBoundDevice" class="function-element">
-      <button (click)="bindNewDevicesToGateway()" [ngbTooltip]="'Bind Device'" class="btn btn-sm btn-primary"
+      <button (click)="bindNewDevicesToGateway()" class="btn btn-sm btn-primary"
               type="button">
         <fa-icon [icon]="['fas', 'plus']"></fa-icon>
+        <span>Bind Device</span>
       </button>
     </div>
     <div class="function-element">
-      <button (click)="deleteDevice()" [ngbTooltip]="deleteLabel" class="btn btn-sm btn-secondary" type="button">
+      <button (click)="deleteDevice()" class="btn btn-sm btn-secondary" type="button">
         <fa-icon [icon]="['fas', 'trash']"></fa-icon>
+        <span>Delete</span>
       </button>
     </div>
 
@@ -65,7 +70,7 @@
 
   <div>
     <div class="d-inline-flex p-2 detail-label">
-      <span [innerHTML]="tenantIdLabel"></span>
+      <span>Tenant ID:</span>
     </div>
     <div class="d-inline-flex p-2 detail-value">
       <span [innerHTML]="tenant.id"></span>
@@ -74,7 +79,7 @@
 
   <div *ngIf="device.via">
     <div class="d-inline-flex p-2 detail-label">
-      <span [innerHTML]="viaLabel"></span>
+      <span>Via:</span>
     </div>
     <div class="d-inline-flex p-2 detail-value">
       <span [innerHTML]="device.via"></span>
@@ -83,7 +88,7 @@
 
   <div>
     <div class="d-inline-flex p-2 detail-label">
-      <span [innerHTML]="creationTimeLabel"></span>
+      <span>Created (UTC):</span>
     </div>
     <div class="d-inline-flex p-2 detail-value">
       <span [innerHTML]="getCreationTime(device.status)"></span>
@@ -96,15 +101,15 @@
 <div class="detail-tabs">
   <nav #nav="ngbNav" class="nav-tabs" ngbNav>
     <ng-container ngbNavItem>
-      <a [innerHTML]="configLabel" ngbNavLink></a>
+      <a ngbNavLink>Configuration</a>
       <ng-template ngbNavContent>
         <app-list-config
           [configs]="configs">
         </app-list-config>
       </ng-template>
     </ng-container>
     <ng-container ngbNavItem>
-      <a [innerHTML]="stateLabel" ngbNavLink></a>
+      <a ngbNavLink>State</a>
       <ng-template ngbNavContent>
         <app-list-state
           [deviceId]="device.id"
@@ -113,7 +118,7 @@
       </ng-template>
     </ng-container>
     <ng-container ngbNavItem>
-      <a [innerHTML]="authenticationLabel" ngbNavLink></a>
+      <a ngbNavLink>Authentication</a>
       <ng-template ngbNavContent>
         <app-list-authentication
           [deviceId]="device.id"
@@ -123,10 +128,10 @@
       </ng-template>
     </ng-container>
     <ng-container ngbNavItem *ngIf="isGateway">
-      <a [innerHTML]="boundDevices" ngbNavLink (click)="setBoundDevices()"></a>
+      <a [innerHTML]="'Bound Devices'" ngbNavLink (click)="setBoundDevices()"></a>
       <ng-template ngbNavContent>
         <app-device-list
-          [boundDeviceListCount]="boundDeviceListCount"
+          [deviceListCount]="boundDeviceListCount"
           [tenant]="tenant"
           [devices]="boundDevicesList"
           [boundDevicesToGateway]="true"

diff --git a/...ce-management-ui/src/app/components/devices/device-detail/device-detail.component.spec.ts b/...ce-management-ui/src/app/components/devices/device-detail/device-detail.component.spec.ts
@@ -1,3 +1,18 @@
+/*
+ * *******************************************************************************
+ *  * Copyright (c) 2023 Contributors to the Eclipse Foundation
+ *  *
+ *  * See the NOTICE file(s) distributed with this work for additional
+ *  * information regarding copyright ownership.
+ *  *
+ *  * This program and the accompanying materials are made available under the
+ *  * terms of the Eclipse Public License 2.0 which is available at
+ *  * http://www.eclipse.org/legal/epl-2.0
+ *  *
+ *  * SPDX-License-Identifier: EPL-2.0
+ *  *******************************************************************************
+ */
+
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {DeviceDetailComponent} from './device-detail.component';
 import {HttpClientTestingModule} from "@angular/common/http/testing";