简柏林 / thingskit · Commits

Commit 9dcb7b9b5bc13c39b7531322259ee90ceb52050c

Authored by Vladyslav
Committed by GitHub
1 parent 99a25cab

UI: Refactoring for the build rule node ui (#4460) 

* UI: Refactoring LWM2M; fixed build ui rule node

* UI: Refactoring LWM2M security config
Inline Side-by-side
Showing 26 changed files with 863 additions and 991 deletions
@@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
20 <mat-label translate>device.credentials-type</mat-label> 20 <mat-label translate>device.credentials-type</mat-label>
21 <mat-select formControlName="credentialsType"> 21 <mat-select formControlName="credentialsType">
22 <mat-option *ngFor="let credentialsType of credentialsTypes" [value]="credentialsType"> 22 <mat-option *ngFor="let credentialsType of credentialsTypes" [value]="credentialsType">
23 - {{ credentialTypeNamesMap.get(deviceCredentialsType[credentialsType]) }} 23 + {{ credentialTypeNamesMap.get(credentialsType) }}
24 </mat-option> 24 </mat-option>
25 </mat-select> 25 </mat-select>
26 </mat-form-field> 26 </mat-form-field>
@@ -85,7 +85,7 @@ @@ -85,7 +85,7 @@
85 <mat-form-field class="mat-block"> 85 <mat-form-field class="mat-block">
86 <mat-label translate>device.lwm2m-value</mat-label> 86 <mat-label translate>device.lwm2m-value</mat-label>
87 <textarea matInput formControlName="credentialsValue" rows="10" required 87 <textarea matInput formControlName="credentialsValue" rows="10" required
88 - [matTooltip]="lwm2mCredentialsValueTip(deviceCredentialsFormGroup.get('credentialsValue').hasError('jsonError'))" 88 + [matTooltip]="lwm2mCredentialsValueTooltip(deviceCredentialsFormGroup.get('credentialsValue').hasError('jsonError'))"
89 matTooltipPosition="above" 89 matTooltipPosition="above"
90 ></textarea> 90 ></textarea>
91 <mat-error *ngIf="deviceCredentialsFormGroup.get('credentialsValue').hasError('required')"> 91 <mat-error *ngIf="deviceCredentialsFormGroup.get('credentialsValue').hasError('required')">
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef, Input, OnDestroy, OnInit} from '@angular/core'; 17 +import { Component, forwardRef, Input, OnDestroy, OnInit } from '@angular/core';
18 import { 18 import {
19 ControlValueAccessor, 19 ControlValueAccessor,
20 FormBuilder, 20 FormBuilder,
@@ -33,9 +33,9 @@ import { @@ -33,9 +33,9 @@ import {
33 DeviceCredentials, 33 DeviceCredentials,
34 DeviceCredentialsType 34 DeviceCredentialsType
35 } from '@shared/models/device.models'; 35 } from '@shared/models/device.models';
36 -import {Subscription} from 'rxjs';  
37 -import {distinctUntilChanged} from 'rxjs/operators';  
38 -import {SecurityConfigComponent} from '@home/pages/device/lwm2m/security-config.component'; 36 +import { Subject } from 'rxjs';
  37 +import { distinctUntilChanged, takeUntil } from 'rxjs/operators';
  38 +import { SecurityConfigLwm2mComponent } from '@home/components/device/security-config-lwm2m.component';
39 import { 39 import {
40 ClientSecurityConfig, 40 ClientSecurityConfig,
41 DEFAULT_END_POINT, 41 DEFAULT_END_POINT,
@@ -44,10 +44,10 @@ import { @@ -44,10 +44,10 @@ import {
44 getDefaultSecurityConfig, 44 getDefaultSecurityConfig,
45 JSON_ALL_CONFIG, 45 JSON_ALL_CONFIG,
46 validateSecurityConfig 46 validateSecurityConfig
47 -} from '@home/pages/device/lwm2m/security-config.models';  
48 -import {TranslateService} from '@ngx-translate/core';  
49 -import {MatDialog} from '@angular/material/dialog';  
50 -import {isDefinedAndNotNull} from '@core/utils'; 47 +} from '@shared/models/lwm2m-security-config.models';
  48 +import { TranslateService } from '@ngx-translate/core';
  49 +import { MatDialog } from '@angular/material/dialog';
  50 +import { isDefinedAndNotNull } from '@core/utils';
51 51
52 @Component({ 52 @Component({
53 selector: 'tb-device-credentials', 53 selector: 'tb-device-credentials',
@@ -67,20 +67,16 @@ import {isDefinedAndNotNull} from '@core/utils'; @@ -67,20 +67,16 @@ import {isDefinedAndNotNull} from '@core/utils';
67 }) 67 })
68 export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, Validator, OnDestroy { 68 export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, Validator, OnDestroy {
69 69
70 - deviceCredentialsFormGroup: FormGroup;  
71 -  
72 - subscriptions: Subscription[] = [];  
73 -  
74 @Input() 70 @Input()
75 disabled: boolean; 71 disabled: boolean;
76 72
77 - deviceCredentials: DeviceCredentials = null; 73 + private destroy$ = new Subject();
78 74
79 - submitted = false; 75 + deviceCredentialsFormGroup: FormGroup;
80 76
81 deviceCredentialsType = DeviceCredentialsType; 77 deviceCredentialsType = DeviceCredentialsType;
82 78
83 - credentialsTypes = Object.keys(DeviceCredentialsType); 79 + credentialsTypes = Object.values(DeviceCredentialsType);
84 80
85 credentialTypeNamesMap = credentialTypeNames; 81 credentialTypeNamesMap = credentialTypeNames;
86 82
@@ -102,16 +98,17 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -102,16 +98,17 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
102 }, {validators: this.atLeastOne(Validators.required, ['clientId', 'userName'])}) 98 }, {validators: this.atLeastOne(Validators.required, ['clientId', 'userName'])})
103 }); 99 });
104 this.deviceCredentialsFormGroup.get('credentialsBasic').disable(); 100 this.deviceCredentialsFormGroup.get('credentialsBasic').disable();
105 - this.subscriptions.push(  
106 - this.deviceCredentialsFormGroup.valueChanges.pipe(distinctUntilChanged()).subscribe(() => {  
107 - this.updateView();  
108 - })  
109 - );  
110 - this.subscriptions.push(  
111 - this.deviceCredentialsFormGroup.get('credentialsType').valueChanges.subscribe(() => {  
112 - this.credentialsTypeChanged();  
113 - })  
114 - ); 101 + this.deviceCredentialsFormGroup.valueChanges.pipe(
  102 + distinctUntilChanged(),
  103 + takeUntil(this.destroy$)
  104 + ).subscribe(() => {
  105 + this.updateView();
  106 + });
  107 + this.deviceCredentialsFormGroup.get('credentialsType').valueChanges.pipe(
  108 + takeUntil(this.destroy$)
  109 + ).subscribe((type) => {
  110 + this.credentialsTypeChanged(type);
  111 + });
115 } 112 }
116 113
117 ngOnInit(): void { 114 ngOnInit(): void {
@@ -121,12 +118,12 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -121,12 +118,12 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
121 } 118 }
122 119
123 ngOnDestroy() { 120 ngOnDestroy() {
124 - this.subscriptions.forEach(s => s.unsubscribe()); 121 + this.destroy$.next();
  122 + this.destroy$.complete();
125 } 123 }
126 124
127 writeValue(value: DeviceCredentials | null): void { 125 writeValue(value: DeviceCredentials | null): void {
128 if (isDefinedAndNotNull(value)) { 126 if (isDefinedAndNotNull(value)) {
129 - this.deviceCredentials = value;  
130 let credentialsBasic = {clientId: null, userName: null, password: null}; 127 let credentialsBasic = {clientId: null, userName: null, password: null};
131 let credentialsValue = null; 128 let credentialsValue = null;
132 if (value.credentialsType === DeviceCredentialsType.MQTT_BASIC) { 129 if (value.credentialsType === DeviceCredentialsType.MQTT_BASIC) {
@@ -179,10 +176,11 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -179,10 +176,11 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
179 }; 176 };
180 } 177 }
181 178
182 - credentialsTypeChanged(): void { 179 + credentialsTypeChanged(credentialsType: DeviceCredentialsType): void {
  180 + const credentialsValue = credentialsType === DeviceCredentialsType.LWM2M_CREDENTIALS ? this.lwm2mDefaultConfig : null;
183 this.deviceCredentialsFormGroup.patchValue({ 181 this.deviceCredentialsFormGroup.patchValue({
184 credentialsId: null, 182 credentialsId: null,
185 - credentialsValue: JSON.stringify(getDefaultSecurityConfig(), null, 2), 183 + credentialsValue,
186 credentialsBasic: {clientId: '', userName: '', password: ''} 184 credentialsBasic: {clientId: '', userName: '', password: ''}
187 }); 185 });
188 this.updateValidators(); 186 this.updateValidators();
@@ -264,7 +262,7 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -264,7 +262,7 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
264 } 262 }
265 } 263 }
266 const credentialsId = this.deviceCredentialsFormGroup.get('credentialsId').value || DEFAULT_END_POINT; 264 const credentialsId = this.deviceCredentialsFormGroup.get('credentialsId').value || DEFAULT_END_POINT;
267 - this.dialog.open<SecurityConfigComponent, DeviceCredentialsDialogLwm2mData, object>(SecurityConfigComponent, { 265 + this.dialog.open<SecurityConfigLwm2mComponent, DeviceCredentialsDialogLwm2mData, object>(SecurityConfigLwm2mComponent, {
268 disableClose: true, 266 disableClose: true,
269 panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], 267 panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
270 data: { 268 data: {
@@ -275,8 +273,8 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -275,8 +273,8 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
275 (res) => { 273 (res) => {
276 if (res) { 274 if (res) {
277 this.deviceCredentialsFormGroup.patchValue({ 275 this.deviceCredentialsFormGroup.patchValue({
278 - credentialsValue: this.isDefautLw2mResponse(res[JSON_ALL_CONFIG]) ? null : JSON.stringify(res[JSON_ALL_CONFIG]),  
279 - credentialsId: this.isDefautLw2mResponse(res[END_POINT]) ? null : JSON.stringify(res[END_POINT]).split('\"').join('') 276 + credentialsValue: this.isDefaultLw2mResponse(res[JSON_ALL_CONFIG]) ? null : JSON.stringify(res[JSON_ALL_CONFIG]),
  277 + credentialsId: this.isDefaultLw2mResponse(res[END_POINT]) ? null : JSON.stringify(res[END_POINT]).split('\"').join('')
280 }); 278 });
281 this.deviceCredentialsFormGroup.get('credentialsValue').markAsDirty(); 279 this.deviceCredentialsFormGroup.get('credentialsValue').markAsDirty();
282 } 280 }
@@ -284,16 +282,19 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit, @@ -284,16 +282,19 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
284 ); 282 );
285 } 283 }
286 284
287 - private isDefautLw2mResponse(response: object): boolean { 285 + private isDefaultLw2mResponse(response: object): boolean {
288 return Object.keys(response).length === 0 || JSON.stringify(response) === '[{}]'; 286 return Object.keys(response).length === 0 || JSON.stringify(response) === '[{}]';
289 } 287 }
290 288
291 private lwm2mConfigJsonValidator(control: FormControl) { 289 private lwm2mConfigJsonValidator(control: FormControl) {
292 - return validateSecurityConfig(control.value) ? null: {jsonError: {parsedJson: "error"}}; 290 + return validateSecurityConfig(control.value) ? null : {jsonError: {parsedJson: 'error'}};
  291 + }
  292 +
  293 + private get lwm2mDefaultConfig(): string {
  294 + return JSON.stringify(getDefaultSecurityConfig(), null, 2);
293 } 295 }
294 296
295 - lwm2mCredentialsValueTip (flag: boolean): string {  
296 - let jsonConfigDef = JSON.stringify(getDefaultSecurityConfig(), null, 2);  
297 - return !flag ? "" : 'Example (mode=\"NoSec\"):\n\r ' + jsonConfigDef; 297 + lwm2mCredentialsValueTooltip(flag: boolean): string {
  298 + return !flag ? '' : 'Example (mode=\"NoSec\"):\n\r ' + this.lwm2mDefaultConfig;
298 } 299 }
299 } 300 }
ui-ngx/src/app/modules/home/components/device/security-config-lwm2m-server.component.html renamed from ui-ngx/src/app/modules/home/pages/device/lwm2m/security-config-server.component.html
@@ -15,87 +15,65 @@ @@ -15,87 +15,65 @@
15 limitations under the License. 15 limitations under the License.
16 16
17 --> 17 -->
18 -<section [formGroup]="serverFormGroup" style="min-width: 400px;">  
19 - <div class="mat-padding">  
20 - <div fxLayout="column">  
21 - <div fxLayout="row" fxLayoutGap="8px">  
22 - <mat-form-field class="mat-block">  
23 - <mat-label translate>device.lwm2m-security-config.mode</mat-label>  
24 - <mat-select formControlName="securityMode"  
25 - (ngModelChange)="securityModeChanged($event)">  
26 - <mat-option *ngFor="let securityMode of securityConfigLwM2MTypes"  
27 - [value]="securityMode">  
28 - {{ credentialTypeLwM2MNamesMap.get(securityConfigLwM2MType[securityMode]) }}  
29 - </mat-option>  
30 - </mat-select>  
31 - </mat-form-field>  
32 - </div>  
33 - </div>  
34 - <div fxLayout="column">  
35 - <div [fxShow]="serverFormGroup.get('securityMode').value !== securityConfigLwM2MType.NO_SEC">  
36 - <mat-form-field class="mat-block">  
37 - <mat-label>{{ 'device.lwm2m-security-config.client-publicKey-or-id' | translate }}</mat-label>  
38 - <textarea matInput  
39 - #clientPublicKeyOrId  
40 - maxlength={{lenMaxClientPublicKeyOrId}}  
41 - cdkTextareaAutosize  
42 - cdkAutosizeMinRows="1"  
43 - style="overflow:hidden"  
44 - cols="1"  
45 - formControlName="clientPublicKeyOrId"  
46 - [required]="serverFormGroup.get('securityMode').value !== securityConfigLwM2MType.NO_SEC">  
47 - </textarea>  
48 - <mat-hint align="end">{{clientPublicKeyOrId.value?.length || 0}}/{{lenMaxClientPublicKeyOrId}}</mat-hint>  
49 - <mat-error *ngIf="serverFormGroup.get('clientPublicKeyOrId').hasError('required')">  
50 - {{ 'device.lwm2m-security-config.client-publicKey-or-id' | translate }}  
51 - <strong>{{ 'device.lwm2m-security-config.required' | translate }}</strong>  
52 - </mat-error>  
53 - <mat-error *ngIf="serverFormGroup.get('clientPublicKeyOrId').hasError('pattern')">  
54 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
55 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
56 - count: 0  
57 - } }}</strong>  
58 - </mat-error>  
59 - <mat-error *ngIf="(serverFormGroup.get('clientPublicKeyOrId').hasError('maxlength') ||  
60 - serverFormGroup.get('clientPublicKeyOrId').hasError('minlength'))">  
61 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
62 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
63 - count: lenMaxClientPublicKeyOrId  
64 - } }}</strong>  
65 - </mat-error>  
66 - </mat-form-field>  
67 - <mat-form-field class="mat-block">  
68 - <mat-label>{{ 'device.lwm2m-security-config.client-secret-key' | translate }}</mat-label>  
69 - <textarea matInput  
70 - #clientSecretKey  
71 - maxlength={{lenMaxClientSecretKey}}  
72 - cdkTextareaAutosize  
73 - cdkAutosizeMinRows="1"  
74 - style="overflow:hidden"  
75 - cols="1"  
76 - formControlName="clientSecretKey"  
77 - [required]="serverFormGroup.get('securityMode').value !== securityConfigLwM2MType.NO_SEC">  
78 - </textarea>  
79 - <mat-hint align="end">{{clientSecretKey.value?.length || 0}}/{{lenMaxClientSecretKey}}</mat-hint>  
80 - <mat-error *ngIf="serverFormGroup.get('clientSecretKey').hasError('required')">  
81 - {{ 'device.lwm2m-security-config.client-secret-key' | translate }}  
82 - <strong>{{ 'device.lwm2m-security-config.required' | translate }}</strong>  
83 - </mat-error>  
84 - <mat-error *ngIf="serverFormGroup.get('clientSecretKey').hasError('pattern')">  
85 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
86 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
87 - count: 0  
88 - } }}</strong>  
89 - </mat-error>  
90 - <mat-error *ngIf="(serverFormGroup.get('clientSecretKey').hasError('maxlength') ||  
91 - serverFormGroup.get('clientSecretKey').hasError('minlength'))">  
92 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
93 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
94 - count: lenMaxClientSecretKey  
95 - } }}</strong>  
96 - </mat-error>  
97 - </mat-form-field>  
98 - </div>  
99 - </div> 18 +<section [formGroup]="serverFormGroup" fxLayout="column">
  19 + <mat-form-field class="mat-block">
  20 + <mat-label translate>device.lwm2m-security-config.mode</mat-label>
  21 + <mat-select formControlName="securityMode">
  22 + <mat-option *ngFor="let securityType of securityConfigLwM2MTypes" [value]="securityType">
  23 + {{ lwm2mSecurityTypeTranslationMap.get(securityType) }}
  24 + </mat-option>
  25 + </mat-select>
  26 + </mat-form-field>
  27 + <div [fxShow]="serverFormGroup.get('securityMode').value !== securityConfigLwM2MType.NO_SEC">
  28 + <mat-form-field class="mat-block">
  29 + <mat-label>{{ 'device.lwm2m-security-config.client-publicKey-or-id' | translate }}</mat-label>
  30 + <textarea matInput
  31 + #clientPublicKeyOrId
  32 + [maxlength]="lenMaxClientPublicKeyOrId"
  33 + cdkTextareaAutosize
  34 + cdkAutosizeMinRows="1"
  35 + cols="1"
  36 + formControlName="clientPublicKeyOrId"
  37 + required>
  38 + </textarea>
  39 + <mat-hint align="end">{{clientPublicKeyOrId.value?.length || 0}}/{{lenMaxClientPublicKeyOrId}}</mat-hint>
  40 + <mat-error *ngIf="serverFormGroup.get('clientPublicKeyOrId').hasError('required')">
  41 + {{ 'device.lwm2m-security-config.client-publicKey-or-id-required' | translate }}
  42 + </mat-error>
  43 + <mat-error *ngIf="serverFormGroup.get('clientPublicKeyOrId').hasError('pattern')">
  44 + {{ 'device.lwm2m-security-config.client-publicKey-or-id-pattern' | translate }}
  45 + </mat-error>
  46 + <mat-error *ngIf="(serverFormGroup.get('clientPublicKeyOrId').hasError('maxlength') ||
  47 + serverFormGroup.get('clientPublicKeyOrId').hasError('minlength'))">
  48 + {{ 'device.lwm2m-security-config.client-publicKey-or-id-length' | translate: {
  49 + count: lenMaxClientPublicKeyOrId
  50 + } }}
  51 + </mat-error>
  52 + </mat-form-field>
  53 + <mat-form-field class="mat-block">
  54 + <mat-label>{{ 'device.lwm2m-security-config.client-secret-key' | translate }}</mat-label>
  55 + <textarea matInput
  56 + #clientSecretKey
  57 + [maxlength]="lengthClientSecretKey"
  58 + cdkTextareaAutosize
  59 + cdkAutosizeMinRows="1"
  60 + cols="1"
  61 + formControlName="clientSecretKey"
  62 + required>
  63 + </textarea>
  64 + <mat-hint align="end">{{clientSecretKey.value?.length || 0}}/{{lengthClientSecretKey}}</mat-hint>
  65 + <mat-error *ngIf="serverFormGroup.get('clientSecretKey').hasError('required')">
  66 + {{ 'device.lwm2m-security-config.client-secret-key-required' | translate }}
  67 + </mat-error>
  68 + <mat-error *ngIf="serverFormGroup.get('clientSecretKey').hasError('pattern')">
  69 + {{ 'device.lwm2m-security-config.client-secret-key-pattern' | translate }}
  70 + </mat-error>
  71 + <mat-error *ngIf="(serverFormGroup.get('clientSecretKey').hasError('maxlength') ||
  72 + serverFormGroup.get('clientSecretKey').hasError('minlength'))">
  73 + {{ 'device.lwm2m-security-config.client-secret-key-length' | translate: {
  74 + count: lengthClientSecretKey
  75 + } }}
  76 + </mat-error>
  77 + </mat-form-field>
100 </div> 78 </div>
101 </section> 79 </section>
  1 +/**
  2 + * Copyright © 2016-2021 The Thingsboard Authors
  3 + *
  4 + * Licensed under the Apache License, Version 2.0 (the "License");
  5 + * you may not use this file except in compliance with the License.
  6 + * You may obtain a copy of the License at
  7 + *
  8 + * http://www.apache.org/licenses/LICENSE-2.0
  9 + *
  10 + * Unless required by applicable law or agreed to in writing, software
  11 + * distributed under the License is distributed on an "AS IS" BASIS,
  12 + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 + * See the License for the specific language governing permissions and
  14 + * limitations under the License.
  15 + */
  16 +:host ::ng-deep {
  17 + textarea.mat-input-element.cdk-textarea-autosize {
  18 + box-sizing: content-box;
  19 + }
  20 +}
  1 +///
  2 +/// Copyright © 2016-2021 The Thingsboard Authors
  3 +///
  4 +/// Licensed under the Apache License, Version 2.0 (the "License");
  5 +/// you may not use this file except in compliance with the License.
  6 +/// You may obtain a copy of the License at
  7 +///
  8 +/// http://www.apache.org/licenses/LICENSE-2.0
  9 +///
  10 +/// Unless required by applicable law or agreed to in writing, software
  11 +/// distributed under the License is distributed on an "AS IS" BASIS,
  12 +/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 +/// See the License for the specific language governing permissions and
  14 +/// limitations under the License.
  15 +///
  16 +
  17 +import { Component, forwardRef, OnDestroy } from '@angular/core';
  18 +import {
  19 + ControlValueAccessor,
  20 + FormBuilder,
  21 + FormGroup,
  22 + NG_VALIDATORS,
  23 + NG_VALUE_ACCESSOR,
  24 + ValidationErrors,
  25 + Validator,
  26 + Validators
  27 +} from '@angular/forms';
  28 +import {
  29 + KEY_REGEXP_HEX_DEC,
  30 + LEN_MAX_PRIVATE_KEY,
  31 + LEN_MAX_PSK,
  32 + LEN_MAX_PUBLIC_KEY_RPK,
  33 + LEN_MAX_PUBLIC_KEY_X509,
  34 + Lwm2mSecurityType,
  35 + Lwm2mSecurityTypeTranslationMap,
  36 + ServerSecurityConfig
  37 +} from '@shared/models/lwm2m-security-config.models';
  38 +import { takeUntil } from 'rxjs/operators';
  39 +import { Subject } from 'rxjs';
  40 +
  41 +@Component({
  42 + selector: 'tb-security-config-lwm2m-server',
  43 + templateUrl: './security-config-lwm2m-server.component.html',
  44 + styleUrls: ['./security-config-lwm2m-server.component.scss'],
  45 + providers: [
  46 + {
  47 + provide: NG_VALUE_ACCESSOR,
  48 + useExisting: forwardRef(() => SecurityConfigLwm2mServerComponent),
  49 + multi: true
  50 + },
  51 + {
  52 + provide: NG_VALIDATORS,
  53 + useExisting: forwardRef(() => SecurityConfigLwm2mServerComponent),
  54 + multi: true
  55 + }
  56 + ]
  57 +})
  58 +
  59 +export class SecurityConfigLwm2mServerComponent implements OnDestroy, ControlValueAccessor, Validator {
  60 +
  61 + serverFormGroup: FormGroup;
  62 + securityConfigLwM2MType = Lwm2mSecurityType;
  63 + securityConfigLwM2MTypes = Object.values(Lwm2mSecurityType);
  64 + lwm2mSecurityTypeTranslationMap = Lwm2mSecurityTypeTranslationMap;
  65 + lenMinClientPublicKeyOrId = 0;
  66 + lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;
  67 + lengthClientSecretKey = LEN_MAX_PRIVATE_KEY;
  68 +
  69 + private destroy$ = new Subject();
  70 + private propagateChange = (v: any) => {};
  71 +
  72 + constructor(private fb: FormBuilder) {
  73 + this.serverFormGroup = this.fb.group({
  74 + securityMode: [Lwm2mSecurityType.NO_SEC],
  75 + clientPublicKeyOrId: [''],
  76 + clientSecretKey: ['']
  77 + });
  78 + this.serverFormGroup.get('securityMode').valueChanges.pipe(
  79 + takeUntil(this.destroy$)
  80 + ).subscribe((securityMode) => {
  81 + this.updateValidate(securityMode);
  82 + });
  83 +
  84 + this.serverFormGroup.valueChanges.pipe(
  85 + takeUntil(this.destroy$)
  86 + ).subscribe((value) => {
  87 + this.propagateChange(value);
  88 + });
  89 + }
  90 +
  91 + writeValue(value: any): void {
  92 + if (value) {
  93 + this.updateValueFields(value);
  94 + }
  95 + }
  96 +
  97 + registerOnChange(fn: any): void {
  98 + this.propagateChange = fn;
  99 + }
  100 +
  101 + registerOnTouched(fn: any): void {
  102 + }
  103 +
  104 + setDisabledState(isDisabled: boolean): void {
  105 + if (isDisabled) {
  106 + this.serverFormGroup.disable({emitEvent: false});
  107 + } else {
  108 + this.serverFormGroup.enable({emitEvent: false});
  109 + }
  110 + }
  111 +
  112 + validate(control): ValidationErrors | null {
  113 + return this.serverFormGroup.valid ? null : {
  114 + securityConfig: {valid: false}
  115 + };
  116 + }
  117 +
  118 + ngOnDestroy() {
  119 + this.destroy$.next();
  120 + this.destroy$.complete();
  121 + }
  122 +
  123 + private updateValueFields(serverData: ServerSecurityConfig): void {
  124 + this.serverFormGroup.patchValue(serverData, {emitEvent: false});
  125 + this.updateValidate(serverData.securityMode, true);
  126 + }
  127 +
  128 + private updateValidate(securityMode: Lwm2mSecurityType, initValue = false): void {
  129 + switch (securityMode) {
  130 + case Lwm2mSecurityType.NO_SEC:
  131 + this.serverFormGroup.get('clientPublicKeyOrId').clearValidators();
  132 + this.serverFormGroup.get('clientSecretKey').clearValidators();
  133 + break;
  134 + case Lwm2mSecurityType.PSK:
  135 + this.lenMinClientPublicKeyOrId = 0;
  136 + this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;
  137 + this.lengthClientSecretKey = LEN_MAX_PSK;
  138 + this.setValidatorsSecurity(securityMode);
  139 + break;
  140 + case Lwm2mSecurityType.RPK:
  141 + this.lenMinClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;
  142 + this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;
  143 + this.lengthClientSecretKey = LEN_MAX_PRIVATE_KEY;
  144 + this.setValidatorsSecurity(securityMode);
  145 + break;
  146 + case Lwm2mSecurityType.X509:
  147 + this.lenMinClientPublicKeyOrId = 0;
  148 + this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_X509;
  149 + this.lengthClientSecretKey = LEN_MAX_PRIVATE_KEY;
  150 + this.setValidatorsSecurity(securityMode);
  151 + break;
  152 + }
  153 + this.serverFormGroup.get('clientPublicKeyOrId').updateValueAndValidity({emitEvent: false});
  154 + this.serverFormGroup.get('clientSecretKey').updateValueAndValidity({emitEvent: !initValue});
  155 + }
  156 +
  157 + private setValidatorsSecurity = (securityMode: Lwm2mSecurityType): void => {
  158 + if (securityMode === Lwm2mSecurityType.PSK) {
  159 + this.serverFormGroup.get('clientPublicKeyOrId').setValidators([Validators.required]);
  160 + } else {
  161 + this.serverFormGroup.get('clientPublicKeyOrId').setValidators([
  162 + Validators.required,
  163 + Validators.pattern(KEY_REGEXP_HEX_DEC),
  164 + Validators.minLength(this.lenMinClientPublicKeyOrId),
  165 + Validators.maxLength(this.lenMaxClientPublicKeyOrId)
  166 + ]);
  167 + }
  168 +
  169 + this.serverFormGroup.get('clientSecretKey').setValidators([
  170 + Validators.required,
  171 + Validators.pattern(KEY_REGEXP_HEX_DEC),
  172 + Validators.minLength(this.lengthClientSecretKey),
  173 + Validators.maxLength(this.lengthClientSecretKey)
  174 + ]);
  175 + }
  176 +}
ui-ngx/src/app/modules/home/components/device/security-config-lwm2m.component.html renamed from ui-ngx/src/app/modules/home/pages/device/lwm2m/security-config.component.html
@@ -26,145 +26,108 @@ @@ -26,145 +26,108 @@
26 </button> 26 </button>
27 </mat-toolbar> 27 </mat-toolbar>
28 <div mat-dialog-content> 28 <div mat-dialog-content>
29 - <fieldset [disabled]="isLoading$ | async">  
30 - <mat-form-field class="mat-block">  
31 - <mat-label translate>device.lwm2m-security-config.endpoint</mat-label>  
32 - <input matInput type="text" formControlName="endPoint" required>  
33 - <mat-error *ngIf="lwm2mConfigFormGroup.get('endPoint').hasError('required')">  
34 - {{ 'device.lwm2m-security-config.endpoint' | translate }}  
35 - <strong>{{ 'device.lwm2m-security-config.required' | translate }}</strong>  
36 - </mat-error>  
37 - </mat-form-field>  
38 - <mat-tab-group dynamicHeight (selectedTabChange)="tabChanged($event)">  
39 - <mat-tab label="{{ 'device.lwm2m-security-config.client-tab' | translate }}">  
40 - <ng-template matTabContent>  
41 - <div class="mat-padding">  
42 - <mat-form-field class="mat-block">  
43 - <mat-label translate>device.lwm2m-security-config.mode</mat-label>  
44 - <mat-select formControlName="securityConfigClientMode"  
45 - (ngModelChange)="securityConfigClientModeChanged($event)">  
46 - <mat-option *ngFor="let securityConfigClientMode of securityConfigLwM2MTypes"  
47 - [value]="securityConfigClientMode">  
48 - {{ credentialTypeLwM2MNamesMap.get(securityConfigLwM2MType[securityConfigClientMode]) }}  
49 - </mat-option>  
50 - </mat-select>  
51 - </mat-form-field>  
52 - <div *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">  
53 - <mat-form-field class="mat-block">  
54 - <mat-label>{{ 'device.lwm2m-security-config.identity' | translate }}</mat-label>  
55 - <input matInput type="text" formControlName="identityPSK"  
56 - [required]="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">  
57 - <mat-error *ngIf="lwm2mConfigFormGroup.get('identityPSK').hasError('required')">  
58 - {{ 'device.lwm2m-security-config.identity' | translate }}  
59 - <strong>{{ 'device.lwm2m-security-config.required' | translate }}</strong>  
60 - </mat-error>  
61 - </mat-form-field>  
62 - </div>  
63 - <div *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.RPK ||  
64 - lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">  
65 - <mat-form-field class="mat-block">  
66 - <mat-label>{{ 'device.lwm2m-security-config.client-key' | translate }}</mat-label>  
67 - <textarea matInput  
68 - #clientKey  
69 - maxlength="{{lenMaxKeyClient}}"  
70 - cdkTextareaAutosize  
71 - cdkAutosizeMinRows="1"  
72 - cols="1"  
73 - formControlName="clientKey"  
74 - style="overflow:hidden"  
75 - [required]="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.RPK ||  
76 - lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">  
77 - </textarea>  
78 - <mat-hint align="end">{{clientKey.value?.length || 0}}/{{lenMaxKeyClient}}</mat-hint>  
79 - <mat-error *ngIf="lwm2mConfigFormGroup.get('clientKey').hasError('required')">  
80 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
81 - <strong>{{ 'device.lwm2m-security-config.required' | translate }}</strong>  
82 - </mat-error>  
83 - <mat-error *ngIf="lwm2mConfigFormGroup.get('clientKey').hasError('pattern')">  
84 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
85 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
86 - count: 0  
87 - } }}</strong>  
88 - </mat-error>  
89 - <mat-error *ngIf="(lwm2mConfigFormGroup.get('clientKey').hasError('maxlength') ||  
90 - lwm2mConfigFormGroup.get('clientKey').hasError('minlength'))">  
91 - {{ 'device.lwm2m-security-config.client-key' | translate }}  
92 - <strong>{{ 'device.lwm2m-security-config.pattern_hex_dec' | translate: {  
93 - count: lenMaxKeyClient  
94 - } }}</strong>  
95 - </mat-error>  
96 - </mat-form-field>  
97 - </div>  
98 - <div *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.X509">  
99 - <mat-checkbox formControlName="clientCertificate" color="primary">  
100 - {{ 'device.lwm2m-security-config.client-certificate' | translate }}  
101 - </mat-checkbox>  
102 - </div>  
103 - </div>  
104 - </ng-template>  
105 - </mat-tab>  
106 - <mat-tab label="{{ 'device.lwm2m-security-config.bootstrap-tab' | translate }}">  
107 - <ng-template matTabContent>  
108 - <div class="mat-padding">  
109 - <mat-accordion multi="true" class="mat-body-1">  
110 - <mat-expansion-panel>  
111 - <mat-expansion-panel-header>  
112 - <mat-panel-title>  
113 - <div  
114 - class="tb-panel-title">{{ 'device.lwm2m-security-config.bootstrap-server' | translate | uppercase }}</div>  
115 - </mat-panel-title>  
116 - </mat-expansion-panel-header>  
117 - <ng-template matExpansionPanelContent>  
118 - <div class="mat-padding">  
119 - <tb-security-config-server-lwm2m  
120 - [formControlName]="bootstrapServer"  
121 - [serverFormGroup]="bootstrapFormGroup">  
122 - </tb-security-config-server-lwm2m>  
123 - </div>  
124 - </ng-template>  
125 - </mat-expansion-panel>  
126 - </mat-accordion>  
127 - <mat-accordion multi="true" class="mat-body-1">  
128 - <mat-expansion-panel>  
129 - <mat-expansion-panel-header>  
130 - <mat-panel-title>  
131 - <div  
132 - class="tb-panel-title">{{ 'device.lwm2m-security-config.lwm2m-server' | translate | uppercase }}</div>  
133 - </mat-panel-title>  
134 - </mat-expansion-panel-header>  
135 - <ng-template matExpansionPanelContent>  
136 - <div class="mat-padding">  
137 - <tb-security-config-server-lwm2m  
138 - [formControlName]="lwm2mServer"  
139 - [serverFormGroup]="lwm2mServerFormGroup">  
140 - </tb-security-config-server-lwm2m>  
141 - </div>  
142 - </ng-template>  
143 - </mat-expansion-panel>  
144 - </mat-accordion>  
145 - </div>  
146 - </ng-template>  
147 - </mat-tab>  
148 - <mat-tab label="{{ 'device.lwm2m-security-config.config-json-tab' | translate }}">  
149 - <ng-template matTabContent>  
150 - <div class="mat-padding">  
151 - <fieldset [disabled]="isLoading$ | async">  
152 - <tb-json-object-edit  
153 - [formControlName]="formControlNameJsonAllConfig"  
154 - label="{{ 'device.lwm2m-value' | translate }}"  
155 - validateContent="true"  
156 - [required]="true"  
157 - [fillHeight]="false">  
158 - </tb-json-object-edit>  
159 - </fieldset>  
160 - </div>  
161 - </ng-template>  
162 - </mat-tab>  
163 - </mat-tab-group>  
164 - </fieldset> 29 + <mat-form-field class="mat-block">
  30 + <mat-label translate>device.lwm2m-security-config.endpoint</mat-label>
  31 + <input matInput type="text" formControlName="endPoint" required>
  32 + <mat-error *ngIf="lwm2mConfigFormGroup.get('endPoint').hasError('required')">
  33 + {{ 'device.lwm2m-security-config.endpoint-required' | translate }}
  34 + </mat-error>
  35 + </mat-form-field>
  36 + <mat-tab-group (selectedTabChange)="tabChanged($event)">
  37 + <mat-tab label="{{ 'device.lwm2m-security-config.client-tab' | translate }}">
  38 + <mat-form-field class="mat-block">
  39 + <mat-label translate>device.lwm2m-security-config.mode</mat-label>
  40 + <mat-select formControlName="securityConfigClientMode">
  41 + <mat-option *ngFor="let securityConfigClientMode of securityConfigLwM2MTypes"
  42 + [value]="securityConfigClientMode">
  43 + {{ credentialTypeLwM2MNamesMap.get(securityConfigLwM2MType[securityConfigClientMode]) }}
  44 + </mat-option>
  45 + </mat-select>
  46 + </mat-form-field>
  47 + <div *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">
  48 + <mat-form-field class="mat-block">
  49 + <mat-label>{{ 'device.lwm2m-security-config.identity' | translate }}</mat-label>
  50 + <input matInput type="text" formControlName="identity" required>
  51 + <mat-error *ngIf="lwm2mConfigFormGroup.get('identity').hasError('required')">
  52 + {{ 'device.lwm2m-security-config.identity-required' | translate }}
  53 + </mat-error>
  54 + </mat-form-field>
  55 + </div>
  56 + <mat-form-field class="mat-block" *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.RPK ||
  57 + lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.PSK">
  58 + <mat-label>{{ 'device.lwm2m-security-config.client-key' | translate }}</mat-label>
  59 + <textarea matInput
  60 + #key
  61 + maxlength="{{lenMaxKeyClient}}"
  62 + cdkTextareaAutosize
  63 + cdkAutosizeMinRows="1"
  64 + cols="1"
  65 + formControlName="key"
  66 + required>
  67 + </textarea>
  68 + <mat-hint align="end">{{key.value?.length || 0}}/{{lenMaxKeyClient}}</mat-hint>
  69 + <mat-error *ngIf="lwm2mConfigFormGroup.get('key').hasError('required')">
  70 + {{ 'device.lwm2m-security-config.client-key-required' | translate }}
  71 + </mat-error>
  72 + <mat-error *ngIf="lwm2mConfigFormGroup.get('key').hasError('pattern')">
  73 + {{ 'device.lwm2m-security-config.client-key-pattern' | translate }}
  74 + </mat-error>
  75 + <mat-error *ngIf="(lwm2mConfigFormGroup.get('key').hasError('maxlength') ||
  76 + lwm2mConfigFormGroup.get('key').hasError('minlength'))">
  77 + {{ 'device.lwm2m-security-config.client-key-length' | translate: {
  78 + count: lenMaxKeyClient
  79 + } }}
  80 + </mat-error>
  81 + </mat-form-field>
  82 + <mat-checkbox formControlName="x509" color="primary"
  83 + *ngIf="lwm2mConfigFormGroup.get('securityConfigClientMode').value === securityConfigLwM2MType.X509">
  84 + {{ 'device.lwm2m-security-config.client-certificate' | translate }}
  85 + </mat-checkbox>
  86 + </mat-tab>
  87 + <mat-tab label="{{ 'device.lwm2m-security-config.bootstrap-tab' | translate }}">
  88 + <div style="padding: 2px;">
  89 + <mat-accordion multi="true" class="mat-body-1">
  90 + <mat-expansion-panel>
  91 + <mat-expansion-panel-header>
  92 + <mat-panel-title>
  93 + {{ 'device.lwm2m-security-config.bootstrap-server' | translate }}
  94 + </mat-panel-title>
  95 + </mat-expansion-panel-header>
  96 + <ng-template matExpansionPanelContent>
  97 + <tb-security-config-lwm2m-server
  98 + formControlName="bootstrapServer">
  99 + </tb-security-config-lwm2m-server>
  100 + </ng-template>
  101 + </mat-expansion-panel>
  102 + <mat-expansion-panel>
  103 + <mat-expansion-panel-header>
  104 + <mat-panel-title>
  105 + {{ 'device.lwm2m-security-config.lwm2m-server' | translate }}
  106 + </mat-panel-title>
  107 + </mat-expansion-panel-header>
  108 + <ng-template matExpansionPanelContent>
  109 + <tb-security-config-lwm2m-server
  110 + formControlName="lwm2mServer">
  111 + </tb-security-config-lwm2m-server>
  112 + </ng-template>
  113 + </mat-expansion-panel>
  114 + </mat-accordion>
  115 + </div>
  116 + </mat-tab>
  117 + <mat-tab label="{{ 'device.lwm2m-security-config.config-json-tab' | translate }}">
  118 + <ng-template matTabContent>
  119 + <tb-json-object-edit
  120 + [formControlName]="formControlNameJsonAllConfig"
  121 + label="{{ 'device.lwm2m-value' | translate }}"
  122 + readonly
  123 + [required]="true"
  124 + [fillHeight]="false">
  125 + </tb-json-object-edit>
  126 + </ng-template>
  127 + </mat-tab>
  128 + </mat-tab-group>
165 </div> 129 </div>
166 <div mat-dialog-actions fxLayout="row" fxLayoutAlign="end center"> 130 <div mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">
167 - <span fxFlex></span>  
168 <button mat-button color="primary" 131 <button mat-button color="primary"
169 type="button" 132 type="button"
170 [disabled]="(isLoading$ | async)" 133 [disabled]="(isLoading$ | async)"
  1 +/**
  2 + * Copyright © 2016-2021 The Thingsboard Authors
  3 + *
  4 + * Licensed under the Apache License, Version 2.0 (the "License");
  5 + * you may not use this file except in compliance with the License.
  6 + * You may obtain a copy of the License at
  7 + *
  8 + * http://www.apache.org/licenses/LICENSE-2.0
  9 + *
  10 + * Unless required by applicable law or agreed to in writing, software
  11 + * distributed under the License is distributed on an "AS IS" BASIS,
  12 + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 + * See the License for the specific language governing permissions and
  14 + * limitations under the License.
  15 + */
  16 +:host {
  17 + mat-tab-group {
  18 + min-height: 330px;
  19 + }
  20 +}
  21 +
  22 +:host ::ng-deep {
  23 + .mat-tab-body-wrapper {
  24 + min-height: 200px;
  25 + }
  26 +
  27 + .mat-tab-body {
  28 + padding: 16px 0;
  29 + }
  30 +
  31 + textarea.mat-input-element.cdk-textarea-autosize {
  32 + box-sizing: content-box;
  33 + }
  34 +}
  1 +///
  2 +/// Copyright © 2016-2021 The Thingsboard Authors
  3 +///
  4 +/// Licensed under the Apache License, Version 2.0 (the "License");
  5 +/// you may not use this file except in compliance with the License.
  6 +/// You may obtain a copy of the License at
  7 +///
  8 +/// http://www.apache.org/licenses/LICENSE-2.0
  9 +///
  10 +/// Unless required by applicable law or agreed to in writing, software
  11 +/// distributed under the License is distributed on an "AS IS" BASIS,
  12 +/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13 +/// See the License for the specific language governing permissions and
  14 +/// limitations under the License.
  15 +///
  16 +
  17 +
  18 +import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
  19 +import { DialogComponent } from '@shared/components/dialog.component';
  20 +import { Store } from '@ngrx/store';
  21 +import { AppState } from '@core/core.state';
  22 +import { Router } from '@angular/router';
  23 +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
  24 +import { FormBuilder, FormGroup, Validators } from '@angular/forms';
  25 +import { TranslateService } from '@ngx-translate/core';
  26 +import {
  27 + DeviceCredentialsDialogLwm2mData,
  28 + getClientSecurityConfig,
  29 + JSON_ALL_CONFIG,
  30 + KEY_REGEXP_HEX_DEC,
  31 + LEN_MAX_PSK,
  32 + LEN_MAX_PUBLIC_KEY_RPK,
  33 + Lwm2mSecurityConfigModels,
  34 + Lwm2mSecurityType,
  35 + Lwm2mSecurityTypeTranslationMap
  36 +} from '@shared/models/lwm2m-security-config.models';
  37 +import { MatTabChangeEvent } from '@angular/material/tabs';
  38 +import { MatTab } from '@angular/material/tabs/tab';
  39 +import { Subject } from 'rxjs';
  40 +import { takeUntil } from 'rxjs/operators';
  41 +
  42 +@Component({
  43 + selector: 'tb-security-config-lwm2m',
  44 + templateUrl: './security-config-lwm2m.component.html',
  45 + styleUrls: ['./security-config-lwm2m.component.scss']
  46 +})
  47 +
  48 +export class SecurityConfigLwm2mComponent extends DialogComponent<SecurityConfigLwm2mComponent, object> implements OnInit, OnDestroy {
  49 +
  50 + private destroy$ = new Subject();
  51 +
  52 + lwm2mConfigFormGroup: FormGroup;
  53 + title: string;
  54 + securityConfigLwM2MType = Lwm2mSecurityType;
  55 + securityConfigLwM2MTypes = Object.keys(Lwm2mSecurityType);
  56 + credentialTypeLwM2MNamesMap = Lwm2mSecurityTypeTranslationMap;
  57 + formControlNameJsonAllConfig = JSON_ALL_CONFIG;
  58 + jsonAllConfig: Lwm2mSecurityConfigModels;
  59 + lenMaxKeyClient = LEN_MAX_PSK;
  60 + tabPrevious: MatTab;
  61 + tabIndexPrevious = 0;
  62 +
  63 + constructor(protected store: Store<AppState>,
  64 + protected router: Router,
  65 + @Inject(MAT_DIALOG_DATA) public data: DeviceCredentialsDialogLwm2mData,
  66 + public dialogRef: MatDialogRef<SecurityConfigLwm2mComponent, object>,
  67 + public fb: FormBuilder,
  68 + public translate: TranslateService) {
  69 + super(store, router, dialogRef);
  70 + }
  71 +
  72 + ngOnInit() {
  73 + this.jsonAllConfig = JSON.parse(JSON.stringify(this.data.jsonAllConfig));
  74 + this.lwm2mConfigFormGroup = this.initLwm2mConfigFormGroup();
  75 + this.title = this.translate.instant('device.lwm2m-security-info') + ': ' + this.data.endPoint;
  76 + this.lwm2mConfigFormGroup.get('x509').disable();
  77 + this.initClientSecurityConfig(this.lwm2mConfigFormGroup.get('jsonAllConfig').value);
  78 + this.registerDisableOnLoadFormControl(this.lwm2mConfigFormGroup.get('securityConfigClientMode'));
  79 + }
  80 +
  81 + ngOnDestroy() {
  82 + this.destroy$.next();
  83 + this.destroy$.complete();
  84 + }
  85 +
  86 + private initClientSecurityConfig = (jsonAllConfig: Lwm2mSecurityConfigModels): void => {
  87 + if (jsonAllConfig.client.securityConfigClientMode !== Lwm2mSecurityType.NO_SEC) {
  88 + this.lwm2mConfigFormGroup.patchValue(jsonAllConfig.client, {emitEvent: false});
  89 + }
  90 + this.securityConfigClientUpdateValidators(jsonAllConfig.client.securityConfigClientMode);
  91 + }
  92 +
  93 + private securityConfigClientModeChanged(type: Lwm2mSecurityType): void {
  94 + const config = getClientSecurityConfig(type, this.lwm2mConfigFormGroup.get('endPoint').value);
  95 + switch (type) {
  96 + case Lwm2mSecurityType.PSK:
  97 + config.identity = this.data.endPoint;
  98 + config.key = this.lwm2mConfigFormGroup.get('key').value;
  99 + break;
  100 + case Lwm2mSecurityType.RPK:
  101 + config.key = this.lwm2mConfigFormGroup.get('key').value;
  102 + break;
  103 + }
  104 + this.jsonAllConfig.client = config;
  105 + this.lwm2mConfigFormGroup.patchValue({
  106 + ...config,
  107 + jsonAllConfig: this.jsonAllConfig
  108 + }, {emitEvent: false});
  109 + this.securityConfigClientUpdateValidators(type);
  110 + }
  111 +
  112 + private securityConfigClientUpdateValidators = (mode: Lwm2mSecurityType): void => {
  113 + switch (mode) {
  114 + case Lwm2mSecurityType.NO_SEC:
  115 + case Lwm2mSecurityType.X509:
  116 + this.setValidatorsNoSecX509();
  117 + break;
  118 + case Lwm2mSecurityType.PSK:
  119 + this.lenMaxKeyClient = LEN_MAX_PSK;
  120 + this.setValidatorsPskRpk(mode);
  121 + break;
  122 + case Lwm2mSecurityType.RPK:
  123 + this.lenMaxKeyClient = LEN_MAX_PUBLIC_KEY_RPK;
  124 + this.setValidatorsPskRpk(mode);
  125 + break;
  126 + }
  127 + this.lwm2mConfigFormGroup.get('identity').updateValueAndValidity({emitEvent: false});
  128 + this.lwm2mConfigFormGroup.get('key').updateValueAndValidity({emitEvent: false});
  129 + }
  130 +
  131 + private setValidatorsNoSecX509 = (): void => {
  132 + this.lwm2mConfigFormGroup.get('identity').setValidators([]);
  133 + this.lwm2mConfigFormGroup.get('key').setValidators([]);
  134 + }
  135 +
  136 + private setValidatorsPskRpk = (mode: Lwm2mSecurityType): void => {
  137 + if (mode === Lwm2mSecurityType.PSK) {
  138 + this.lwm2mConfigFormGroup.get('identity').setValidators([Validators.required]);
  139 + } else {
  140 + this.lwm2mConfigFormGroup.get('identity').setValidators([]);
  141 + }
  142 + this.lwm2mConfigFormGroup.get('key').setValidators([Validators.required,
  143 + Validators.pattern(KEY_REGEXP_HEX_DEC),
  144 + Validators.maxLength(this.lenMaxKeyClient), Validators.minLength(this.lenMaxKeyClient)]);
  145 + }
  146 +
  147 + tabChanged = (tabChangeEvent: MatTabChangeEvent): void => {
  148 + if (this.tabIndexPrevious !== tabChangeEvent.index) {
  149 + this.upDateValueToJson();
  150 + }
  151 + this.tabIndexPrevious = tabChangeEvent.index;
  152 + }
  153 +
  154 + private upDateValueToJson(): void {
  155 + switch (this.tabIndexPrevious) {
  156 + case 0:
  157 + this.upDateValueToJsonTab0();
  158 + break;
  159 + case 1:
  160 + this.upDateValueToJsonTab1();
  161 + break;
  162 + }
  163 + }
  164 +
  165 + private upDateValueToJsonTab0 = (): void => {
  166 + if (this.lwm2mConfigFormGroup.get('identity').dirty && this.lwm2mConfigFormGroup.get('identity').valid ||
  167 + this.lwm2mConfigFormGroup.get('key').dirty && this.lwm2mConfigFormGroup.get('key').valid) {
  168 + this.updateBootstrapSettings();
  169 + this.upDateJsonAllConfig();
  170 + }
  171 + }
  172 +
  173 + private upDateValueToJsonTab1 = (): void => {
  174 + const bootstrap = this.lwm2mConfigFormGroup.get('bootstrapServer').value;
  175 + if (bootstrap !== null
  176 + && this.lwm2mConfigFormGroup.get('bootstrapServer').dirty
  177 + && this.lwm2mConfigFormGroup.get('bootstrapServer').valid) {
  178 + this.jsonAllConfig.bootstrap.bootstrapServer = bootstrap;
  179 + this.upDateJsonAllConfig();
  180 + }
  181 + const serverConfig = this.lwm2mConfigFormGroup.get('lwm2mServer').value;
  182 + if (serverConfig !== null
  183 + && this.lwm2mConfigFormGroup.get('lwm2mServer').dirty
  184 + && this.lwm2mConfigFormGroup.get('lwm2mServer').valid) {
  185 + this.jsonAllConfig.bootstrap.lwm2mServer = serverConfig;
  186 + this.upDateJsonAllConfig();
  187 + }
  188 + }
  189 +
  190 + private updateBootstrapSettings() {
  191 + const securityMode = 'securityMode';
  192 + this.jsonAllConfig.client.identity = this.lwm2mConfigFormGroup.get('identity').value;
  193 + this.jsonAllConfig.client.key = this.lwm2mConfigFormGroup.get('key').value;
  194 + if (this.lwm2mConfigFormGroup.get('bootstrapServer').value[securityMode] === Lwm2mSecurityType.PSK) {
  195 + this.jsonAllConfig.bootstrap.bootstrapServer.clientPublicKeyOrId = this.jsonAllConfig.client.identity;
  196 + this.jsonAllConfig.bootstrap.bootstrapServer.clientSecretKey = this.jsonAllConfig.client.key;
  197 + this.lwm2mConfigFormGroup.get('bootstrapServer').patchValue(this.jsonAllConfig.bootstrap.bootstrapServer, {emitEvent: false});
  198 + }
  199 + if (this.lwm2mConfigFormGroup.get('lwm2mServer').value[securityMode] === Lwm2mSecurityType.PSK) {
  200 + this.jsonAllConfig.bootstrap.lwm2mServer.clientPublicKeyOrId = this.jsonAllConfig.client.identity;
  201 + this.jsonAllConfig.bootstrap.lwm2mServer.clientSecretKey = this.jsonAllConfig.client.key;
  202 + this.lwm2mConfigFormGroup.get('lwm2mServer').patchValue(this.jsonAllConfig.bootstrap.lwm2mServer, {emitEvent: false});
  203 + }
  204 + }
  205 +
  206 + private upDateJsonAllConfig = (): void => {
  207 + this.lwm2mConfigFormGroup.patchValue({
  208 + jsonAllConfig: this.jsonAllConfig
  209 + }, {emitEvent: false});
  210 + }
  211 +
  212 + private initLwm2mConfigFormGroup = (): FormGroup => {
  213 + if (this.jsonAllConfig.client.securityConfigClientMode === Lwm2mSecurityType.PSK) {
  214 + this.data.endPoint = this.jsonAllConfig.client.endpoint;
  215 + }
  216 + const formGroup = this.fb.group({
  217 + securityConfigClientMode: [this.jsonAllConfig.client.securityConfigClientMode],
  218 + identity: [''],
  219 + key: [''],
  220 + x509: [false],
  221 + bootstrapServer: [this.jsonAllConfig.bootstrap.bootstrapServer],
  222 + lwm2mServer: [this.jsonAllConfig.bootstrap.lwm2mServer],
  223 + endPoint: [this.data.endPoint],
  224 + jsonAllConfig: [this.jsonAllConfig]
  225 + });
  226 + formGroup.get('securityConfigClientMode').valueChanges.pipe(
  227 + takeUntil(this.destroy$)
  228 + ).subscribe((type) => {
  229 + this.securityConfigClientModeChanged(type);
  230 + });
  231 + formGroup.get('endPoint').valueChanges.pipe(
  232 + takeUntil(this.destroy$)
  233 + ).subscribe((endpoint) => {
  234 + if (formGroup.get('securityConfigClientMode').value === Lwm2mSecurityType.PSK) {
  235 + this.jsonAllConfig.client.endpoint = endpoint;
  236 + this.upDateJsonAllConfig();
  237 + }
  238 + });
  239 + return formGroup;
  240 + }
  241 +
  242 + save(): void {
  243 + this.upDateValueToJson();
  244 + this.data.endPoint = this.lwm2mConfigFormGroup.get('endPoint').value.split('\'').join('');
  245 + this.data.jsonAllConfig = this.jsonAllConfig;
  246 + if (this.lwm2mConfigFormGroup.get('securityConfigClientMode').value === Lwm2mSecurityType.PSK) {
  247 + this.data.endPoint = this.data.jsonAllConfig.client.identity;
  248 + }
  249 + this.dialogRef.close(this.data);
  250 + }
  251 +
  252 + cancel(): void {
  253 + this.dialogRef.close(undefined);
  254 + }
  255 +}
  256 +
  257 +
@@ -138,6 +138,8 @@ import { EMBED_DASHBOARD_DIALOG_TOKEN } from '@home/components/widget/dialog/emb @@ -138,6 +138,8 @@ import { EMBED_DASHBOARD_DIALOG_TOKEN } from '@home/components/widget/dialog/emb
138 import { EdgeDownlinkTableComponent } from '@home/components/edge/edge-downlink-table.component'; 138 import { EdgeDownlinkTableComponent } from '@home/components/edge/edge-downlink-table.component';
139 import { EdgeDownlinkTableHeaderComponent } from '@home/components/edge/edge-downlink-table-header.component'; 139 import { EdgeDownlinkTableHeaderComponent } from '@home/components/edge/edge-downlink-table-header.component';
140 import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-page/widget-types-panel.component'; 140 import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-page/widget-types-panel.component';
  141 +import { SecurityConfigLwm2mComponent } from '@home/components/device/security-config-lwm2m.component';
  142 +import { SecurityConfigLwm2mServerComponent } from '@home/components/device/security-config-lwm2m-server.component';
141 143
142 @NgModule({ 144 @NgModule({
143 declarations: 145 declarations:
@@ -239,6 +241,8 @@ import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-pag @@ -239,6 +241,8 @@ import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-pag
239 DeviceWizardDialogComponent, 241 DeviceWizardDialogComponent,
240 DeviceCredentialsComponent, 242 DeviceCredentialsComponent,
241 CopyDeviceCredentialsComponent, 243 CopyDeviceCredentialsComponent,
  244 + SecurityConfigLwm2mComponent,
  245 + SecurityConfigLwm2mServerComponent,
242 AlarmScheduleDialogComponent, 246 AlarmScheduleDialogComponent,
243 EditAlarmDetailsDialogComponent, 247 EditAlarmDetailsDialogComponent,
244 SmsProviderConfigurationComponent, 248 SmsProviderConfigurationComponent,
@@ -342,6 +346,8 @@ import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-pag @@ -342,6 +346,8 @@ import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-pag
342 DeviceWizardDialogComponent, 346 DeviceWizardDialogComponent,
343 DeviceCredentialsComponent, 347 DeviceCredentialsComponent,
344 CopyDeviceCredentialsComponent, 348 CopyDeviceCredentialsComponent,
  349 + SecurityConfigLwm2mComponent,
  350 + SecurityConfigLwm2mServerComponent,
345 AlarmScheduleInfoComponent, 351 AlarmScheduleInfoComponent,
346 AlarmScheduleComponent, 352 AlarmScheduleComponent,
347 AlarmScheduleDialogComponent, 353 AlarmScheduleDialogComponent,
@@ -14,21 +14,20 @@ @@ -14,21 +14,20 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, Inject, OnInit, SkipSelf} from "@angular/core";  
18 -import {ErrorStateMatcher} from "@angular/material/core";  
19 -import {DialogComponent} from "@shared/components/dialog.component";  
20 -import {Store} from "@ngrx/store";  
21 -import {AppState} from "@core/core.state";  
22 -import {Router} from "@angular/router";  
23 -import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";  
24 -import {FormBuilder, FormControl, FormGroup, FormGroupDirective, NgForm} from "@angular/forms";  
25 -import {TranslateService} from "@ngx-translate/core";  
26 -import {JsonObject} from "@angular/compiler-cli/ngcc/src/packages/entry_point"; 17 +import { Component, Inject, OnInit, SkipSelf } from '@angular/core';
  18 +import { ErrorStateMatcher } from '@angular/material/core';
  19 +import { DialogComponent } from '@shared/components/dialog.component';
  20 +import { Store } from '@ngrx/store';
  21 +import { AppState } from '@core/core.state';
  22 +import { Router } from '@angular/router';
  23 +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
  24 +import { FormBuilder, FormControl, FormGroup, FormGroupDirective, NgForm } from '@angular/forms';
  25 +import { JsonObject } from '@angular/compiler-cli/ngcc/src/packages/entry_point';
27 26
28 export interface Lwm2mAttributesDialogData { 27 export interface Lwm2mAttributesDialogData {
29 readonly: boolean; 28 readonly: boolean;
30 attributeLwm2m: JsonObject; 29 attributeLwm2m: JsonObject;
31 - destName: string 30 + destName: string;
32 } 31 }
33 32
34 @Component({ 33 @Component({
@@ -37,7 +36,8 @@ export interface Lwm2mAttributesDialogData { @@ -37,7 +36,8 @@ export interface Lwm2mAttributesDialogData {
37 styleUrls: ['./lwm2m-attributes.component.scss'], 36 styleUrls: ['./lwm2m-attributes.component.scss'],
38 providers: [{provide: ErrorStateMatcher, useExisting: Lwm2mAttributesDialogComponent}], 37 providers: [{provide: ErrorStateMatcher, useExisting: Lwm2mAttributesDialogComponent}],
39 }) 38 })
40 -export class Lwm2mAttributesDialogComponent extends DialogComponent<Lwm2mAttributesDialogComponent, Object> implements OnInit, ErrorStateMatcher { 39 +export class Lwm2mAttributesDialogComponent extends DialogComponent<Lwm2mAttributesDialogComponent, object>
  40 + implements OnInit, ErrorStateMatcher {
41 41
42 readonly = this.data.readonly; 42 readonly = this.data.readonly;
43 43
@@ -54,8 +54,7 @@ export class Lwm2mAttributesDialogComponent extends DialogComponent<Lwm2mAttribu @@ -54,8 +54,7 @@ export class Lwm2mAttributesDialogComponent extends DialogComponent<Lwm2mAttribu
54 @Inject(MAT_DIALOG_DATA) public data: Lwm2mAttributesDialogData, 54 @Inject(MAT_DIALOG_DATA) public data: Lwm2mAttributesDialogData,
55 @SkipSelf() private errorStateMatcher: ErrorStateMatcher, 55 @SkipSelf() private errorStateMatcher: ErrorStateMatcher,
56 public dialogRef: MatDialogRef<Lwm2mAttributesDialogComponent, object>, 56 public dialogRef: MatDialogRef<Lwm2mAttributesDialogComponent, object>,
57 - private fb: FormBuilder,  
58 - public translate: TranslateService) { 57 + private fb: FormBuilder) {
59 super(store, router, dialogRef); 58 super(store, router, dialogRef);
60 59
61 this.attributeLwm2mDialogFormGroup = this.fb.group({ 60 this.attributeLwm2mDialogFormGroup = this.fb.group({
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef, Input, OnInit} from "@angular/core"; 17 +import { Component, forwardRef, Input, OnInit } from '@angular/core';
18 import { 18 import {
19 AbstractControl, 19 AbstractControl,
20 ControlValueAccessor, 20 ControlValueAccessor,
@@ -26,17 +26,17 @@ import { @@ -26,17 +26,17 @@ import {
26 NG_VALUE_ACCESSOR, 26 NG_VALUE_ACCESSOR,
27 Validator, 27 Validator,
28 Validators 28 Validators
29 -} from "@angular/forms";  
30 -import {Subscription} from "rxjs";  
31 -import {PageComponent} from "@shared/components/page.component";  
32 -import {Store} from "@ngrx/store";  
33 -import {AppState} from "@core/core.state"; 29 +} from '@angular/forms';
  30 +import { Subscription } from 'rxjs';
34 import { 31 import {
35 ATTRIBUTE_KEYS, 32 ATTRIBUTE_KEYS,
36 ATTRIBUTE_LWM2M_ENUM, 33 ATTRIBUTE_LWM2M_ENUM,
37 ATTRIBUTE_LWM2M_MAP 34 ATTRIBUTE_LWM2M_MAP
38 -} from "@home/components/profile/device/lwm2m/lwm2m-profile-config.models";  
39 -import {isDefinedAndNotNull, isEmpty, isEmptyStr, isUndefinedOrNull} from "@core/utils"; 35 +} from './lwm2m-profile-config.models';
  36 +import { isDefinedAndNotNull, isEmpty, isEmptyStr, isUndefinedOrNull } from '@core/utils';
  37 +import { Store } from '@ngrx/store';
  38 +import { AppState } from '@core/core.state';
  39 +import { PageComponent } from '@shared/components/page.component';
40 40
41 41
42 @Component({ 42 @Component({
@@ -98,7 +98,7 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co @@ -98,7 +98,7 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co
98 registerOnTouched(fn: any): void { 98 registerOnTouched(fn: any): void {
99 } 99 }
100 100
101 - setDisabledState?(isDisabled: boolean): void { 101 + setDisabledState(isDisabled: boolean): void {
102 this.disabled = isDisabled; 102 this.disabled = isDisabled;
103 if (this.disabled) { 103 if (this.disabled) {
104 this.kvListFormGroup.disable({emitEvent: false}); 104 this.kvListFormGroup.disable({emitEvent: false});
@@ -166,10 +166,10 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co @@ -166,10 +166,10 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co
166 }; 166 };
167 } 167 }
168 168
169 - private updateValidate (c?: FormControl) { 169 + private updateValidate() {
170 const kvList = this.kvListFormGroup.get('keyVals') as FormArray; 170 const kvList = this.kvListFormGroup.get('keyVals') as FormArray;
171 kvList.controls.forEach(fg => { 171 kvList.controls.forEach(fg => {
172 - if (fg.get('key').value==='ver') { 172 + if (fg.get('key').value === 'ver') {
173 fg.get('value').setValidators(null); 173 fg.get('value').setValidators(null);
174 fg.get('value').setErrors(null); 174 fg.get('value').setErrors(null);
175 } 175 }
@@ -189,7 +189,7 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co @@ -189,7 +189,7 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co
189 if (isUndefinedOrNull(entry.value) || entry.key === 'ver' || isEmptyStr(entry.value.toString())) { 189 if (isUndefinedOrNull(entry.value) || entry.key === 'ver' || isEmptyStr(entry.value.toString())) {
190 keyValMap[entry.key] = entry.value.toString(); 190 keyValMap[entry.key] = entry.value.toString();
191 } else { 191 } else {
192 - keyValMap[entry.key] = Number(entry.value) 192 + keyValMap[entry.key] = Number(entry.value);
193 } 193 }
194 }); 194 });
195 this.propagateChange(keyValMap); 195 this.propagateChange(keyValMap);
@@ -215,13 +215,13 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co @@ -215,13 +215,13 @@ export class Lwm2mAttributesKeyListComponent extends PageComponent implements Co
215 private attributeLwm2mValueNumberValidator = (control: AbstractControl) => { 215 private attributeLwm2mValueNumberValidator = (control: AbstractControl) => {
216 if (isNaN(Number(control.value)) || Number(control.value) < 0) { 216 if (isNaN(Number(control.value)) || Number(control.value) < 0) {
217 return { 217 return {
218 - 'validAttributeValue': true 218 + validAttributeValue: true
219 }; 219 };
220 } 220 }
221 return null; 221 return null;
222 } 222 }
223 223
224 - private attributeLwm2mValueValidator = (property: string): Object [] => {  
225 - return property === 'ver'? [] : [this.attributeLwm2mValueNumberValidator]; 224 + private attributeLwm2mValueValidator = (property: string): object[] => {
  225 + return property === 'ver' ? [] : [this.attributeLwm2mValueNumberValidator];
226 } 226 }
227 } 227 }
@@ -14,21 +14,14 @@ @@ -14,21 +14,14 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, EventEmitter, forwardRef, Inject, Input, Output} from "@angular/core";  
18 -import {ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR} from "@angular/forms";  
19 -import {coerceBooleanProperty} from "@angular/cdk/coercion";  
20 -import {Store} from "@ngrx/store";  
21 -import {AppState} from "@core/core.state";  
22 -import {DeviceProfileService} from "@core/http/device-profile.service";  
23 -import {WINDOW} from "@core/services/window.service";  
24 -import {deepClone, isDefinedAndNotNull, isEmpty} from "@core/utils";  
25 -import {  
26 - Lwm2mAttributesDialogComponent,  
27 - Lwm2mAttributesDialogData  
28 -} from "@home/components/profile/device/lwm2m/lwm2m-attributes-dialog.component";  
29 -import {MatDialog} from "@angular/material/dialog";  
30 -import {TranslateService} from "@ngx-translate/core";  
31 -import {ATTRIBUTE_LWM2M_LABEL} from "@home/components/profile/device/lwm2m/lwm2m-profile-config.models"; 17 +import { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core';
  18 +import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
  19 +import { coerceBooleanProperty } from '@angular/cdk/coercion';
  20 +import { deepClone, isDefinedAndNotNull, isEmpty } from '@core/utils';
  21 +import { Lwm2mAttributesDialogComponent, Lwm2mAttributesDialogData } from './lwm2m-attributes-dialog.component';
  22 +import { MatDialog } from '@angular/material/dialog';
  23 +import { TranslateService } from '@ngx-translate/core';
  24 +import { ATTRIBUTE_LWM2M_LABEL } from './lwm2m-profile-config.models';
32 25
33 26
34 @Component({ 27 @Component({
@@ -46,7 +39,6 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor { @@ -46,7 +39,6 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor {
46 attributeLwm2mLabel = ATTRIBUTE_LWM2M_LABEL; 39 attributeLwm2mLabel = ATTRIBUTE_LWM2M_LABEL;
47 40
48 private requiredValue: boolean; 41 private requiredValue: boolean;
49 - private dirty = false;  
50 42
51 @Input() 43 @Input()
52 attributeLwm2m: {}; 44 attributeLwm2m: {};
@@ -71,12 +63,9 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor { @@ -71,12 +63,9 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor {
71 private propagateChange = (v: any) => { 63 private propagateChange = (v: any) => {
72 } 64 }
73 65
74 - constructor(private store: Store<AppState>,  
75 - private dialog: MatDialog, 66 + constructor(private dialog: MatDialog,
76 private fb: FormBuilder, 67 private fb: FormBuilder,
77 - private deviceProfileService: DeviceProfileService,  
78 - private translate: TranslateService,  
79 - @Inject(WINDOW) private window: Window) {} 68 + private translate: TranslateService) {}
80 69
81 registerOnChange(fn: any): void { 70 registerOnChange(fn: any): void {
82 this.propagateChange = fn; 71 this.propagateChange = fn;
@@ -117,20 +106,20 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor { @@ -117,20 +106,20 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor {
117 return label; 106 return label;
118 } 107 }
119 108
120 - isDisableBtn (): boolean { 109 + isDisableBtn(): boolean {
121 return this.disabled || this.isAttributeTelemetry ? !(isDefinedAndNotNull(this.attributeLwm2m) && 110 return this.disabled || this.isAttributeTelemetry ? !(isDefinedAndNotNull(this.attributeLwm2m) &&
122 !isEmpty(this.attributeLwm2m) && this.disabled) : this.disabled; 111 !isEmpty(this.attributeLwm2m) && this.disabled) : this.disabled;
123 } 112 }
124 113
125 - isIconView (): boolean { 114 + isIconView(): boolean {
126 return this.isAttributeTelemetry || this.disabled; 115 return this.isAttributeTelemetry || this.disabled;
127 } 116 }
128 117
129 - isIconEditAdd (): boolean { 118 + isIconEditAdd(): boolean {
130 return isDefinedAndNotNull(this.attributeLwm2m) && !isEmpty(this.attributeLwm2m); 119 return isDefinedAndNotNull(this.attributeLwm2m) && !isEmpty(this.attributeLwm2m);
131 } 120 }
132 121
133 - isToolTipLabel (): string { 122 + isToolTipLabel(): string {
134 return this.disabled ? this.translate.instant('device-profile.lwm2m.attribute-lwm2m-tip') : 123 return this.disabled ? this.translate.instant('device-profile.lwm2m.attribute-lwm2m-tip') :
135 this.isAttributeTelemetry ? this.translate.instant('device-profile.lwm2m.attribute-lwm2m-disable-tip') : 124 this.isAttributeTelemetry ? this.translate.instant('device-profile.lwm2m.attribute-lwm2m-disable-tip') :
136 this.translate.instant('device-profile.lwm2m.attribute-lwm2m-tip'); 125 this.translate.instant('device-profile.lwm2m.attribute-lwm2m-tip');
@@ -140,7 +129,7 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor { @@ -140,7 +129,7 @@ export class Lwm2mAttributesComponent implements ControlValueAccessor {
140 if ($event) { 129 if ($event) {
141 $event.stopPropagation(); 130 $event.stopPropagation();
142 } 131 }
143 - this.dialog.open<Lwm2mAttributesDialogComponent, Lwm2mAttributesDialogData, Object>(Lwm2mAttributesDialogComponent, { 132 + this.dialog.open<Lwm2mAttributesDialogComponent, Lwm2mAttributesDialogData, object>(Lwm2mAttributesDialogComponent, {
144 disableClose: true, 133 disableClose: true,
145 panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], 134 panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
146 data: { 135 data: {
@@ -14,8 +14,8 @@ @@ -14,8 +14,8 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef, Inject, Input} from '@angular/core';  
18 -import {ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators} from '@angular/forms'; 17 +import { Component, forwardRef, Inject, Input } from '@angular/core';
  18 +import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
19 import { 19 import {
20 DEFAULT_CLIENT_HOLD_OFF_TIME, 20 DEFAULT_CLIENT_HOLD_OFF_TIME,
21 DEFAULT_ID_SERVER, 21 DEFAULT_ID_SERVER,
@@ -28,13 +28,12 @@ import { @@ -28,13 +28,12 @@ import {
28 SECURITY_CONFIG_MODE_NAMES, 28 SECURITY_CONFIG_MODE_NAMES,
29 ServerSecurityConfig 29 ServerSecurityConfig
30 } from './lwm2m-profile-config.models'; 30 } from './lwm2m-profile-config.models';
31 -import {Store} from '@ngrx/store';  
32 -import {AppState} from '@core/core.state';  
33 -import {coerceBooleanProperty} from '@angular/cdk/coercion';  
34 -import {WINDOW} from '@core/services/window.service';  
35 -import {pairwise, startWith} from 'rxjs/operators';  
36 -import {DeviceProfileService} from '@core/http/device-profile.service'; 31 +import { coerceBooleanProperty } from '@angular/cdk/coercion';
  32 +import { WINDOW } from '@core/services/window.service';
  33 +import { pairwise, startWith } from 'rxjs/operators';
  34 +import { DeviceProfileService } from '@core/http/device-profile.service';
37 35
  36 +// @dynamic
38 @Component({ 37 @Component({
39 selector: 'tb-profile-lwm2m-device-config-server', 38 selector: 'tb-profile-lwm2m-device-config-server',
40 templateUrl: './lwm2m-device-config-server.component.html', 39 templateUrl: './lwm2m-device-config-server.component.html',
@@ -73,8 +72,7 @@ export class Lwm2mDeviceConfigServerComponent implements ControlValueAccessor { @@ -73,8 +72,7 @@ export class Lwm2mDeviceConfigServerComponent implements ControlValueAccessor {
73 this.requiredValue = coerceBooleanProperty(value); 72 this.requiredValue = coerceBooleanProperty(value);
74 } 73 }
75 74
76 - constructor(protected store: Store<AppState>,  
77 - public fb: FormBuilder, 75 + constructor(public fb: FormBuilder,
78 private deviceProfileService: DeviceProfileService, 76 private deviceProfileService: DeviceProfileService,
79 @Inject(WINDOW) private window: Window) { 77 @Inject(WINDOW) private window: Window) {
80 this.serverFormGroup = this.initServerGroup(); 78 this.serverFormGroup = this.initServerGroup();
@@ -15,10 +15,8 @@ @@ -15,10 +15,8 @@
15 /// 15 ///
16 16
17 import { DeviceProfileTransportConfiguration } from '@shared/models/device.models'; 17 import { DeviceProfileTransportConfiguration } from '@shared/models/device.models';
18 -import { Component, forwardRef, Inject, Input } from '@angular/core'; 18 +import { Component, forwardRef, Input } from '@angular/core';
19 import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; 19 import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
20 -import { Store } from '@ngrx/store';  
21 -import { AppState } from '@app/core/core.state';  
22 import { coerceBooleanProperty } from '@angular/cdk/coercion'; 20 import { coerceBooleanProperty } from '@angular/cdk/coercion';
23 import { 21 import {
24 ATTRIBUTE, 22 ATTRIBUTE,
@@ -37,7 +35,6 @@ import { @@ -37,7 +35,6 @@ import {
37 } from './lwm2m-profile-config.models'; 35 } from './lwm2m-profile-config.models';
38 import { DeviceProfileService } from '@core/http/device-profile.service'; 36 import { DeviceProfileService } from '@core/http/device-profile.service';
39 import { deepClone, isDefinedAndNotNull, isEmpty, isUndefined } from '@core/utils'; 37 import { deepClone, isDefinedAndNotNull, isEmpty, isUndefined } from '@core/utils';
40 -import { WINDOW } from '@core/services/window.service';  
41 import { JsonArray, JsonObject } from '@angular/compiler-cli/ngcc/src/packages/entry_point'; 38 import { JsonArray, JsonObject } from '@angular/compiler-cli/ngcc/src/packages/entry_point';
42 import { Direction } from '@shared/models/page/sort-order'; 39 import { Direction } from '@shared/models/page/sort-order';
43 40
@@ -78,10 +75,8 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -78,10 +75,8 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
78 private propagateChange = (v: any) => { 75 private propagateChange = (v: any) => {
79 } 76 }
80 77
81 - constructor(private store: Store<AppState>,  
82 - private fb: FormBuilder,  
83 - private deviceProfileService: DeviceProfileService,  
84 - @Inject(WINDOW) private window: Window) { 78 + constructor(private fb: FormBuilder,
  79 + private deviceProfileService: DeviceProfileService) {
85 this.lwm2mDeviceProfileFormGroup = this.fb.group({ 80 this.lwm2mDeviceProfileFormGroup = this.fb.group({
86 clientOnlyObserveAfterConnect: [1, []], 81 clientOnlyObserveAfterConnect: [1, []],
87 objectIds: [null, Validators.required], 82 objectIds: [null, Validators.required],
@@ -155,7 +150,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -155,7 +150,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
155 this.lwm2mDeviceProfileFormGroup.patchValue({ 150 this.lwm2mDeviceProfileFormGroup.patchValue({
156 clientOnlyObserveAfterConnect: this.configurationValue.clientLwM2mSettings.clientOnlyObserveAfterConnect, 151 clientOnlyObserveAfterConnect: this.configurationValue.clientLwM2mSettings.clientOnlyObserveAfterConnect,
157 objectIds: value, 152 objectIds: value,
158 - observeAttrTelemetry: this.getObserveAttrTelemetryObjects(value['objectsList']), 153 + observeAttrTelemetry: this.getObserveAttrTelemetryObjects(value.objectsList),
159 shortId: this.configurationValue.bootstrap.servers.shortId, 154 shortId: this.configurationValue.bootstrap.servers.shortId,
160 lifetime: this.configurationValue.bootstrap.servers.lifetime, 155 lifetime: this.configurationValue.bootstrap.servers.lifetime,
161 defaultMinPeriod: this.configurationValue.bootstrap.servers.defaultMinPeriod, 156 defaultMinPeriod: this.configurationValue.bootstrap.servers.defaultMinPeriod,
@@ -171,7 +166,6 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -171,7 +166,6 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
171 let configuration: DeviceProfileTransportConfiguration = null; 166 let configuration: DeviceProfileTransportConfiguration = null;
172 if (this.lwm2mDeviceConfigFormGroup.valid && this.lwm2mDeviceProfileFormGroup.valid) { 167 if (this.lwm2mDeviceConfigFormGroup.valid && this.lwm2mDeviceProfileFormGroup.valid) {
173 configuration = this.lwm2mDeviceConfigFormGroup.value.configurationJson; 168 configuration = this.lwm2mDeviceConfigFormGroup.value.configurationJson;
174 - // configuration.type = DeviceTransportType.LWM2M;  
175 } 169 }
176 this.propagateChange(configuration); 170 this.propagateChange(configuration);
177 } 171 }
@@ -206,7 +200,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -206,7 +200,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
206 if (this.configurationValue.observeAttr && objectLwM2MS.length > 0) { 200 if (this.configurationValue.observeAttr && objectLwM2MS.length > 0) {
207 const attributeArray = this.configurationValue.observeAttr.attribute; 201 const attributeArray = this.configurationValue.observeAttr.attribute;
208 const telemetryArray = this.configurationValue.observeAttr.telemetry; 202 const telemetryArray = this.configurationValue.observeAttr.telemetry;
209 - let keyNameJson = this.configurationValue.observeAttr.keyName; 203 + const keyNameJson = this.configurationValue.observeAttr.keyName;
210 if (this.includesNotZeroInstance(attributeArray, telemetryArray)) { 204 if (this.includesNotZeroInstance(attributeArray, telemetryArray)) {
211 this.addInstances(attributeArray, telemetryArray, objectLwM2MS); 205 this.addInstances(attributeArray, telemetryArray, objectLwM2MS);
212 } 206 }
@@ -270,9 +264,9 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -270,9 +264,9 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
270 private updateAttributeLwm2m = (objectLwM2MS: ObjectLwM2M[]): void => { 264 private updateAttributeLwm2m = (objectLwM2MS: ObjectLwM2M[]): void => {
271 Object.keys(this.configurationValue.observeAttr.attributeLwm2m).forEach(key => { 265 Object.keys(this.configurationValue.observeAttr.attributeLwm2m).forEach(key => {
272 const [objectKeyId, instanceId, resourceId] = Array.from(key.substring(1).split('/'), String); 266 const [objectKeyId, instanceId, resourceId] = Array.from(key.substring(1).split('/'), String);
273 - let objectLwM2M = objectLwM2MS.find(objectLwm2m => objectLwm2m.keyId === objectKeyId); 267 + const objectLwM2M = objectLwM2MS.find(objectLwm2m => objectLwm2m.keyId === objectKeyId);
274 if (objectLwM2M && instanceId) { 268 if (objectLwM2M && instanceId) {
275 - let instance = objectLwM2M.instances.find(instance => instance.id === +instanceId) 269 + const instance = objectLwM2M.instances.find(obj => obj.id === +instanceId);
276 if (instance && resourceId) { 270 if (instance && resourceId) {
277 instance.resources.find(resource => resource.id === +resourceId) 271 instance.resources.find(resource => resource.id === +resourceId)
278 .attributeLwm2m = this.configurationValue.observeAttr.attributeLwm2m[key]; 272 .attributeLwm2m = this.configurationValue.observeAttr.attributeLwm2m[key];
@@ -288,7 +282,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -288,7 +282,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
288 private updateKeyNameObjects = (objectLwM2MS: ObjectLwM2M[]): void => { 282 private updateKeyNameObjects = (objectLwM2MS: ObjectLwM2M[]): void => {
289 Object.keys(this.configurationValue.observeAttr.keyName).forEach(key => { 283 Object.keys(this.configurationValue.observeAttr.keyName).forEach(key => {
290 const [objectKeyId, instanceId, resourceId] = Array.from(key.substring(1).split('/'), String); 284 const [objectKeyId, instanceId, resourceId] = Array.from(key.substring(1).split('/'), String);
291 - const objectLwM2M = objectLwM2MS.find(objectLwm2m => objectLwm2m.keyId === objectKeyId) 285 + const objectLwM2M = objectLwM2MS.find(objectLwm2m => objectLwm2m.keyId === objectKeyId);
292 if (objectLwM2M) { 286 if (objectLwM2M) {
293 objectLwM2M.instances.find(instance => instance.id === +instanceId) 287 objectLwM2M.instances.find(instance => instance.id === +instanceId)
294 .resources.find(resource => resource.id === +resourceId) 288 .resources.find(resource => resource.id === +resourceId)
@@ -299,7 +293,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -299,7 +293,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
299 293
300 private validateKeyNameObjects = (nameJson: JsonObject, attributeArray: JsonArray, telemetryArray: JsonArray): {} => { 294 private validateKeyNameObjects = (nameJson: JsonObject, attributeArray: JsonArray, telemetryArray: JsonArray): {} => {
301 const keyName = JSON.parse(JSON.stringify(nameJson)); 295 const keyName = JSON.parse(JSON.stringify(nameJson));
302 - let keyNameValidate = {}; 296 + const keyNameValidate = {};
303 const keyAttrTelemetry = attributeArray.concat(telemetryArray); 297 const keyAttrTelemetry = attributeArray.concat(telemetryArray);
304 Object.keys(keyName).forEach(key => { 298 Object.keys(keyName).forEach(key => {
305 if (keyAttrTelemetry.includes(key)) { 299 if (keyAttrTelemetry.includes(key)) {
@@ -345,9 +339,9 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -345,9 +339,9 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
345 attributeLwm2m[pathRes] = resource.attributeLwm2m; 339 attributeLwm2m[pathRes] = resource.attributeLwm2m;
346 } 340 }
347 } 341 }
348 - }) 342 + });
349 } 343 }
350 - }) 344 + });
351 } 345 }
352 }); 346 });
353 if (isUndefined(this.configurationValue.observeAttr)) { 347 if (isUndefined(this.configurationValue.observeAttr)) {
@@ -356,7 +350,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -356,7 +350,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
356 attribute: attributeArray, 350 attribute: attributeArray,
357 telemetry: telemetryArray, 351 telemetry: telemetryArray,
358 keyName: this.sortObjectKeyPathJson(KEY_NAME, keyNameNew), 352 keyName: this.sortObjectKeyPathJson(KEY_NAME, keyNameNew),
359 - attributeLwm2m: attributeLwm2m 353 + attributeLwm2m
360 }; 354 };
361 } else { 355 } else {
362 this.configurationValue.observeAttr.observe = observeArray; 356 this.configurationValue.observeAttr.observe = observeArray;
@@ -457,7 +451,6 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @@ -457,7 +451,6 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro
457 } 451 }
458 452
459 private removeAttributeLwm2mFromJson = (keyId: string): void => { 453 private removeAttributeLwm2mFromJson = (keyId: string): void => {
460 - debugger  
461 const keyNameJson = this.configurationValue.observeAttr.attributeLwm2m; 454 const keyNameJson = this.configurationValue.observeAttr.attributeLwm2m;
462 Object.keys(keyNameJson).forEach(key => { 455 Object.keys(keyNameJson).forEach(key => {
463 if (key.startsWith(`/${keyId}`)) { 456 if (key.startsWith(`/${keyId}`)) {
@@ -14,13 +14,13 @@ @@ -14,13 +14,13 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, Inject, OnInit} from '@angular/core';  
18 -import {DialogComponent} from '@shared/components/dialog.component';  
19 -import {FormBuilder, FormGroup} from '@angular/forms';  
20 -import {Store} from '@ngrx/store';  
21 -import {AppState} from '@core/core.state';  
22 -import {Router} from '@angular/router';  
23 -import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog'; 17 +import { Component, Inject, OnInit } from '@angular/core';
  18 +import { DialogComponent } from '@shared/components/dialog.component';
  19 +import { FormBuilder, FormGroup } from '@angular/forms';
  20 +import { Store } from '@ngrx/store';
  21 +import { AppState } from '@core/core.state';
  22 +import { Router } from '@angular/router';
  23 +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
24 24
25 export interface Lwm2mObjectAddInstancesData { 25 export interface Lwm2mObjectAddInstancesData {
26 instancesIds: Set<number>; 26 instancesIds: Set<number>;
@@ -14,11 +14,9 @@ @@ -14,11 +14,9 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef} from '@angular/core';  
18 -import {ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators} from '@angular/forms';  
19 -import {Store} from '@ngrx/store';  
20 -import {AppState} from '@core/core.state';  
21 -import {INSTANCES_ID_VALUE_MAX, INSTANCES_ID_VALUE_MIN, KEY_REGEXP_NUMBER} from './lwm2m-profile-config.models'; 17 +import { Component, forwardRef } from '@angular/core';
  18 +import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
  19 +import { INSTANCES_ID_VALUE_MAX, INSTANCES_ID_VALUE_MIN, KEY_REGEXP_NUMBER } from './lwm2m-profile-config.models';
22 20
23 @Component({ 21 @Component({
24 selector: 'tb-profile-lwm2m-object-add-instances-list', 22 selector: 'tb-profile-lwm2m-object-add-instances-list',
@@ -41,8 +39,7 @@ export class Lwm2mObjectAddInstancesListComponent implements ControlValueAccesso @@ -41,8 +39,7 @@ export class Lwm2mObjectAddInstancesListComponent implements ControlValueAccesso
41 39
42 private propagateChange = (v: any) => { }; 40 private propagateChange = (v: any) => { };
43 41
44 - constructor(private store: Store<AppState>,  
45 - private fb: FormBuilder) { 42 + constructor(private fb: FormBuilder) {
46 this.instancesListFormGroup = this.fb.group({ 43 this.instancesListFormGroup = this.fb.group({
47 instanceIdInput: [null, [ 44 instanceIdInput: [null, [
48 Validators.min(this.instanceIdValueMin), 45 Validators.min(this.instanceIdValueMin),
@@ -14,18 +14,16 @@ @@ -14,18 +14,16 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, ElementRef, EventEmitter, forwardRef, Input, OnInit, Output, ViewChild} from '@angular/core';  
18 -import {ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators} from '@angular/forms';  
19 -import {coerceBooleanProperty} from '@angular/cdk/coercion';  
20 -import {Store} from '@ngrx/store';  
21 -import {AppState} from '@core/core.state';  
22 -import {Observable} from 'rxjs';  
23 -import {filter, map, mergeMap, publishReplay, refCount, tap} from 'rxjs/operators';  
24 -import {ModelValue, ObjectLwM2M, PAGE_SIZE_LIMIT} from './lwm2m-profile-config.models';  
25 -import {DeviceProfileService} from '@core/http/device-profile.service';  
26 -import {Direction} from '@shared/models/page/sort-order';  
27 -import {isDefined, isDefinedAndNotNull, isString} from '@core/utils';  
28 -import {PageLink} from "@shared/models/page/page-link"; 17 +import { Component, ElementRef, EventEmitter, forwardRef, Input, OnInit, Output, ViewChild } from '@angular/core';
  18 +import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
  19 +import { coerceBooleanProperty } from '@angular/cdk/coercion';
  20 +import { Observable } from 'rxjs';
  21 +import { filter, map, mergeMap, publishReplay, refCount, tap } from 'rxjs/operators';
  22 +import { ModelValue, ObjectLwM2M, PAGE_SIZE_LIMIT } from './lwm2m-profile-config.models';
  23 +import { DeviceProfileService } from '@core/http/device-profile.service';
  24 +import { Direction } from '@shared/models/page/sort-order';
  25 +import { isDefined, isDefinedAndNotNull, isString } from '@core/utils';
  26 +import { PageLink } from '@shared/models/page/page-link';
29 27
30 @Component({ 28 @Component({
31 selector: 'tb-profile-lwm2m-object-list', 29 selector: 'tb-profile-lwm2m-object-list',
@@ -71,8 +69,7 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V @@ -71,8 +69,7 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V
71 private propagateChange = (v: any) => { 69 private propagateChange = (v: any) => {
72 } 70 }
73 71
74 - constructor(private store: Store<AppState>,  
75 - private deviceProfileService: DeviceProfileService, 72 + constructor(private deviceProfileService: DeviceProfileService,
76 private fb: FormBuilder) { 73 private fb: FormBuilder) {
77 this.lwm2mListFormGroup = this.fb.group({ 74 this.lwm2mListFormGroup = this.fb.group({
78 objectsList: [this.objectsList], 75 objectsList: [this.objectsList],
@@ -162,20 +159,20 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V @@ -162,20 +159,20 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V
162 159
163 private fetchListObjects = (searchText?: string): Observable<Array<ObjectLwM2M>> => { 160 private fetchListObjects = (searchText?: string): Observable<Array<ObjectLwM2M>> => {
164 this.searchText = searchText; 161 this.searchText = searchText;
165 - return this.getLwM2mModelsPage().pipe(  
166 - map(objectLwM2Ms => objectLwM2Ms)  
167 - ); 162 + return this.getLwM2mModelsPage().pipe(
  163 + map(objectLwM2Ms => objectLwM2Ms)
  164 + );
168 } 165 }
169 166
170 private getLwM2mModelsPage(): Observable<Array<ObjectLwM2M>> { 167 private getLwM2mModelsPage(): Observable<Array<ObjectLwM2M>> {
171 - const pageLink = new PageLink(PAGE_SIZE_LIMIT, 0, this.searchText, {  
172 - property: 'id',  
173 - direction: Direction.ASC  
174 - });  
175 - this.lw2mModels = this.deviceProfileService.getLwm2mObjectsPage(pageLink).pipe(  
176 - publishReplay(1),  
177 - refCount()  
178 - ); 168 + const pageLink = new PageLink(PAGE_SIZE_LIMIT, 0, this.searchText, {
  169 + property: 'id',
  170 + direction: Direction.ASC
  171 + });
  172 + this.lw2mModels = this.deviceProfileService.getLwm2mObjectsPage(pageLink).pipe(
  173 + publishReplay(1),
  174 + refCount()
  175 + );
179 return this.lw2mModels; 176 return this.lw2mModels;
180 } 177 }
181 178
@@ -14,13 +14,11 @@ @@ -14,13 +14,11 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef, Input} from '@angular/core';  
18 -import {ControlValueAccessor, FormArray, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators} from '@angular/forms';  
19 -import {ResourceLwM2M, RESOURCES} from '@home/components/profile/device/lwm2m/lwm2m-profile-config.models';  
20 -import {Store} from '@ngrx/store';  
21 -import {AppState} from '@core/core.state'; 17 +import { Component, forwardRef, Input } from '@angular/core';
  18 +import { ControlValueAccessor, FormArray, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
  19 +import { ResourceLwM2M, RESOURCES } from '@home/components/profile/device/lwm2m/lwm2m-profile-config.models';
22 import _ from 'lodash'; 20 import _ from 'lodash';
23 -import {coerceBooleanProperty} from '@angular/cdk/coercion'; 21 +import { coerceBooleanProperty } from '@angular/cdk/coercion';
24 22
25 @Component({ 23 @Component({
26 selector: 'tb-profile-lwm2m-observe-attr-telemetry-resource', 24 selector: 'tb-profile-lwm2m-observe-attr-telemetry-resource',
@@ -54,8 +52,7 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA @@ -54,8 +52,7 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA
54 } 52 }
55 } 53 }
56 54
57 - constructor(private store: Store<AppState>,  
58 - private fb: FormBuilder) { 55 + constructor(private fb: FormBuilder) {
59 this.resourceFormGroup = this.fb.group({ 56 this.resourceFormGroup = this.fb.group({
60 resources: this.fb.array([]) 57 resources: this.fb.array([])
61 }); 58 });
@@ -95,7 +92,7 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA @@ -95,7 +92,7 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA
95 } 92 }
96 93
97 getNameResourceLwm2m = (resourceLwM2M: ResourceLwM2M): string => { 94 getNameResourceLwm2m = (resourceLwM2M: ResourceLwM2M): string => {
98 - return '<' + resourceLwM2M.id +'> ' + resourceLwM2M.name; 95 + return `<${resourceLwM2M.id}> ${resourceLwM2M.name}`;
99 } 96 }
100 97
101 createResourceLwM2M(resourcesLwM2M: ResourceLwM2M[]): void { 98 createResourceLwM2M(resourcesLwM2M: ResourceLwM2M[]): void {
@@ -135,14 +132,14 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA @@ -135,14 +132,14 @@ export class Lwm2mObserveAttrTelemetryResourceComponent implements ControlValueA
135 return index; 132 return index;
136 } 133 }
137 134
138 - updateObserve = (index: number): void =>{ 135 + updateObserve = (index: number): void => {
139 if (this.resourceFormArray.at(index).value.attribute === false && this.resourceFormArray.at(index).value.telemetry === false) { 136 if (this.resourceFormArray.at(index).value.attribute === false && this.resourceFormArray.at(index).value.telemetry === false) {
140 this.resourceFormArray.at(index).patchValue({observe: false}); 137 this.resourceFormArray.at(index).patchValue({observe: false});
141 this.resourceFormArray.at(index).patchValue({attributeLwm2m: {}}); 138 this.resourceFormArray.at(index).patchValue({attributeLwm2m: {}});
142 } 139 }
143 } 140 }
144 141
145 - disableObserve = (index: number): boolean =>{ 142 + disableObserve = (index: number): boolean => {
146 return !this.resourceFormArray.at(index).value.telemetry && !this.resourceFormArray.at(index).value.attribute; 143 return !this.resourceFormArray.at(index).value.telemetry && !this.resourceFormArray.at(index).value.attribute;
147 } 144 }
148 } 145 }
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {Component, forwardRef, Input} from '@angular/core'; 17 +import { Component, forwardRef, Input } from '@angular/core';
18 import { 18 import {
19 AbstractControl, 19 AbstractControl,
20 ControlValueAccessor, 20 ControlValueAccessor,
@@ -24,9 +24,7 @@ import { @@ -24,9 +24,7 @@ import {
24 NG_VALUE_ACCESSOR, 24 NG_VALUE_ACCESSOR,
25 Validators 25 Validators
26 } from '@angular/forms'; 26 } from '@angular/forms';
27 -import {Store} from '@ngrx/store';  
28 -import {AppState} from '@core/core.state';  
29 -import {coerceBooleanProperty} from '@angular/cdk/coercion'; 27 +import { coerceBooleanProperty } from '@angular/cdk/coercion';
30 import { 28 import {
31 ATTRIBUTE, 29 ATTRIBUTE,
32 ATTRIBUTE_LWM2M, 30 ATTRIBUTE_LWM2M,
@@ -38,9 +36,8 @@ import { @@ -38,9 +36,8 @@ import {
38 RESOURCES, 36 RESOURCES,
39 TELEMETRY 37 TELEMETRY
40 } from './lwm2m-profile-config.models'; 38 } from './lwm2m-profile-config.models';
41 -import {deepClone, isDefinedAndNotNull, isEqual, isUndefined} from '@core/utils';  
42 -import {MatDialog} from '@angular/material/dialog';  
43 -import {TranslateService} from '@ngx-translate/core'; 39 +import { deepClone, isDefinedAndNotNull, isEqual, isUndefined } from '@core/utils';
  40 +import { MatDialog } from '@angular/material/dialog';
44 import { 41 import {
45 Lwm2mObjectAddInstancesData, 42 Lwm2mObjectAddInstancesData,
46 Lwm2mObjectAddInstancesDialogComponent 43 Lwm2mObjectAddInstancesDialogComponent
@@ -83,10 +80,8 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor @@ -83,10 +80,8 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor
83 @Input() 80 @Input()
84 disabled: boolean; 81 disabled: boolean;
85 82
86 - constructor(private store: Store<AppState>,  
87 - private fb: FormBuilder,  
88 - private dialog: MatDialog,  
89 - public translate: TranslateService) { 83 + constructor(private fb: FormBuilder,
  84 + private dialog: MatDialog) {
90 this.observeAttrTelemetryFormGroup = this.fb.group({ 85 this.observeAttrTelemetryFormGroup = this.fb.group({
91 [CLIENT_LWM2M]: this.fb.array([]) 86 [CLIENT_LWM2M]: this.fb.array([])
92 }); 87 });
@@ -98,7 +93,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor @@ -98,7 +93,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor
98 } 93 }
99 94
100 private propagateChange = (v: any) => { 95 private propagateChange = (v: any) => {
101 - }; 96 + }
102 97
103 registerOnChange(fn: any): void { 98 registerOnChange(fn: any): void {
104 this.propagateChange = fn; 99 this.propagateChange = fn;
@@ -189,7 +184,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor @@ -189,7 +184,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor
189 this.observeAttrTelemetryFormGroup.get(CLIENT_LWM2M).updateValueAndValidity(); 184 this.observeAttrTelemetryFormGroup.get(CLIENT_LWM2M).updateValueAndValidity();
190 } 185 }
191 186
192 - trackByParams = (index: number, element: any): number => { 187 + trackByParams = (index: number): number => {
193 return index; 188 return index;
194 } 189 }
195 190
@@ -252,7 +247,6 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor @@ -252,7 +247,6 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor
252 } 247 }
253 248
254 private updateInstancesIds = (data: Lwm2mObjectAddInstancesData): void => { 249 private updateInstancesIds = (data: Lwm2mObjectAddInstancesData): void => {
255 - debugger  
256 const objectLwM2MFormGroup = (this.observeAttrTelemetryFormGroup.get(CLIENT_LWM2M) as FormArray).controls 250 const objectLwM2MFormGroup = (this.observeAttrTelemetryFormGroup.get(CLIENT_LWM2M) as FormArray).controls
257 .find(e => e.value.keyId === data.objectKeyId) as FormGroup; 251 .find(e => e.value.keyId === data.objectKeyId) as FormGroup;
258 const instancesArray = objectLwM2MFormGroup.value.instances as Instance []; 252 const instancesArray = objectLwM2MFormGroup.value.instances as Instance [];
@@ -318,7 +312,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor @@ -318,7 +312,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor
318 return objectName + ' <' + idVerObj + '>'; 312 return objectName + ' <' + idVerObj + '>';
319 } 313 }
320 getNameInstanceLwm2m = (instance: Instance, idVerObj: string): string => { 314 getNameInstanceLwm2m = (instance: Instance, idVerObj: string): string => {
321 - return ' instance <' + idVerObj + '/' + instance.id +'>'; 315 + return ` instance <${idVerObj}/${instance.id}>`;
322 } 316 }
323 317
324 updateAttributeLwm2mObject = (event: Event, objectKeyId: number): void => { 318 updateAttributeLwm2mObject = (event: Event, objectKeyId: number): void => {
@@ -14,19 +14,19 @@ @@ -14,19 +14,19 @@
14 /// limitations under the License. 14 /// limitations under the License.
15 /// 15 ///
16 16
17 -import {NgModule} from '@angular/core';  
18 -import {Lwm2mDeviceProfileTransportConfigurationComponent} from './lwm2m-device-profile-transport-configuration.component';  
19 -import {Lwm2mObjectListComponent} from './lwm2m-object-list.component';  
20 -import {Lwm2mObserveAttrTelemetryComponent} from './lwm2m-observe-attr-telemetry.component';  
21 -import {Lwm2mObserveAttrTelemetryResourceComponent} from './lwm2m-observe-attr-telemetry-resource.component';  
22 -import {Lwm2mAttributesDialogComponent} from './lwm2m-attributes-dialog.component';  
23 -import {Lwm2mAttributesComponent} from './lwm2m-attributes.component';  
24 -import {Lwm2mAttributesKeyListComponent} from './lwm2m-attributes-key-list.component';  
25 -import {Lwm2mDeviceConfigServerComponent} from './lwm2m-device-config-server.component';  
26 -import {Lwm2mObjectAddInstancesDialogComponent} from './lwm2m-object-add-instances-dialog.component';  
27 -import {Lwm2mObjectAddInstancesListComponent} from './lwm2m-object-add-instances-list.component';  
28 -import {CommonModule} from '@angular/common';  
29 -import {SharedModule} from '@app/shared/shared.module'; 17 +import { NgModule } from '@angular/core';
  18 +import { Lwm2mDeviceProfileTransportConfigurationComponent } from './lwm2m-device-profile-transport-configuration.component';
  19 +import { Lwm2mObjectListComponent } from './lwm2m-object-list.component';
  20 +import { Lwm2mObserveAttrTelemetryComponent } from './lwm2m-observe-attr-telemetry.component';
  21 +import { Lwm2mObserveAttrTelemetryResourceComponent } from './lwm2m-observe-attr-telemetry-resource.component';
  22 +import { Lwm2mAttributesDialogComponent } from './lwm2m-attributes-dialog.component';
  23 +import { Lwm2mAttributesComponent } from './lwm2m-attributes.component';
  24 +import { Lwm2mAttributesKeyListComponent } from './lwm2m-attributes-key-list.component';
  25 +import { Lwm2mDeviceConfigServerComponent } from './lwm2m-device-config-server.component';
  26 +import { Lwm2mObjectAddInstancesDialogComponent } from './lwm2m-object-add-instances-dialog.component';
  27 +import { Lwm2mObjectAddInstancesListComponent } from './lwm2m-object-add-instances-list.component';
  28 +import { CommonModule } from '@angular/common';
  29 +import { SharedModule } from '@app/shared/shared.module';
30 30
31 @NgModule({ 31 @NgModule({
32 declarations: 32 declarations:
@@ -127,8 +127,8 @@ export const SECURITY_CONFIG_MODE_NAMES = new Map<SECURITY_CONFIG_MODE, string>( @@ -127,8 +127,8 @@ export const SECURITY_CONFIG_MODE_NAMES = new Map<SECURITY_CONFIG_MODE, string>(
127 ); 127 );
128 128
129 export interface ModelValue { 129 export interface ModelValue {
130 - objectIds: string[],  
131 - objectsList: ObjectLwM2M[] 130 + objectIds: string[];
  131 + objectsList: ObjectLwM2M[];
132 } 132 }
133 133
134 export interface BootstrapServersSecurityConfig { 134 export interface BootstrapServersSecurityConfig {
@@ -24,8 +24,6 @@ import { DeviceCredentialsDialogComponent } from '@modules/home/pages/device/dev @@ -24,8 +24,6 @@ import { DeviceCredentialsDialogComponent } from '@modules/home/pages/device/dev
24 import { HomeDialogsModule } from '../../dialogs/home-dialogs.module'; 24 import { HomeDialogsModule } from '../../dialogs/home-dialogs.module';
25 import { HomeComponentsModule } from '@modules/home/components/home-components.module'; 25 import { HomeComponentsModule } from '@modules/home/components/home-components.module';
26 import { DeviceTabsComponent } from '@home/pages/device/device-tabs.component'; 26 import { DeviceTabsComponent } from '@home/pages/device/device-tabs.component';
27 -import { SecurityConfigComponent } from '@home/pages/device/lwm2m/security-config.component';  
28 -import { SecurityConfigServerComponent } from '@home/pages/device/lwm2m/security-config-server.component';  
29 import { DefaultDeviceConfigurationComponent } from './data/default-device-configuration.component'; 27 import { DefaultDeviceConfigurationComponent } from './data/default-device-configuration.component';
30 import { DeviceConfigurationComponent } from './data/device-configuration.component'; 28 import { DeviceConfigurationComponent } from './data/device-configuration.component';
31 import { DeviceDataComponent } from './data/device-data.component'; 29 import { DeviceDataComponent } from './data/device-data.component';
@@ -50,9 +48,7 @@ import { SnmpDeviceTransportConfigurationComponent } from './data/snmp-device-tr @@ -50,9 +48,7 @@ import { SnmpDeviceTransportConfigurationComponent } from './data/snmp-device-tr
50 DeviceComponent, 48 DeviceComponent,
51 DeviceTabsComponent, 49 DeviceTabsComponent,
52 DeviceTableHeaderComponent, 50 DeviceTableHeaderComponent,
53 - DeviceCredentialsDialogComponent,  
54 - SecurityConfigComponent,  
55 - SecurityConfigServerComponent 51 + DeviceCredentialsDialogComponent
56 ], 52 ],
57 imports: [ 53 imports: [
58 CommonModule, 54 CommonModule,
1 -///  
2 -/// Copyright © 2016-2021 The Thingsboard Authors  
3 -///  
4 -/// Licensed under the Apache License, Version 2.0 (the "License");  
5 -/// you may not use this file except in compliance with the License.  
6 -/// You may obtain a copy of the License at  
7 -///  
8 -/// http://www.apache.org/licenses/LICENSE-2.0  
9 -///  
10 -/// Unless required by applicable law or agreed to in writing, software  
11 -/// distributed under the License is distributed on an "AS IS" BASIS,  
12 -/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  
13 -/// See the License for the specific language governing permissions and  
14 -/// limitations under the License.  
15 -///  
16 -  
17 -import { Component, forwardRef, Inject, Input, OnInit } from '@angular/core';  
18 -import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';  
19 -import {  
20 - DeviceCredentialsDialogLwm2mData,  
21 - KEY_REGEXP_HEX_DEC,  
22 - LEN_MAX_PRIVATE_KEY,  
23 - LEN_MAX_PSK,  
24 - LEN_MAX_PUBLIC_KEY_RPK,  
25 - LEN_MAX_PUBLIC_KEY_X509,  
26 - SECURITY_CONFIG_MODE,  
27 - SECURITY_CONFIG_MODE_NAMES,  
28 - ServerSecurityConfig  
29 -} from '@home/pages/device/lwm2m/security-config.models';  
30 -import { Store } from '@ngrx/store';  
31 -import { AppState } from '@core/core.state';  
32 -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';  
33 -import { PageComponent } from '@shared/components/page.component';  
34 -  
35 -@Component({  
36 - selector: 'tb-security-config-server-lwm2m',  
37 - templateUrl: './security-config-server.component.html',  
38 - styleUrls: [],  
39 - providers: [  
40 - {  
41 - provide: NG_VALUE_ACCESSOR,  
42 - useExisting: forwardRef(() => SecurityConfigServerComponent),  
43 - multi: true  
44 - }  
45 - ]  
46 -})  
47 -  
48 -export class SecurityConfigServerComponent extends PageComponent implements OnInit, ControlValueAccessor {  
49 -  
50 - securityConfigLwM2MType = SECURITY_CONFIG_MODE;  
51 - securityConfigLwM2MTypes = Object.keys(SECURITY_CONFIG_MODE);  
52 - credentialTypeLwM2MNamesMap = SECURITY_CONFIG_MODE_NAMES;  
53 - lenMinClientPublicKeyOrId = 0;  
54 - lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;  
55 - lenMinClientSecretKey = LEN_MAX_PRIVATE_KEY;  
56 - lenMaxClientSecretKey = LEN_MAX_PRIVATE_KEY;  
57 -  
58 - @Input() serverFormGroup: FormGroup;  
59 -  
60 - constructor(protected store: Store<AppState>,  
61 - @Inject(MAT_DIALOG_DATA) public data: DeviceCredentialsDialogLwm2mData,  
62 - public dialogRef: MatDialogRef<SecurityConfigServerComponent, object>,  
63 - public fb: FormBuilder) {  
64 - super(store);  
65 - }  
66 -  
67 - ngOnInit(): void {  
68 - this.registerDisableOnLoadFormControl(this.serverFormGroup.get('securityMode'));  
69 - }  
70 -  
71 - private updateValueFields(serverData: ServerSecurityConfig): void {  
72 - this.serverFormGroup.patchValue(serverData, {emitEvent: false});  
73 - const securityMode = this.serverFormGroup.get('securityMode').value as SECURITY_CONFIG_MODE;  
74 - this.updateValidate(securityMode);  
75 - }  
76 -  
77 - private updateValidate(securityMode: SECURITY_CONFIG_MODE): void {  
78 - switch (securityMode) {  
79 - case SECURITY_CONFIG_MODE.NO_SEC:  
80 - this.serverFormGroup.get('clientPublicKeyOrId').setValidators([]);  
81 - this.serverFormGroup.get('clientSecretKey').setValidators([]);  
82 - break;  
83 - case SECURITY_CONFIG_MODE.PSK:  
84 - this.lenMinClientPublicKeyOrId = 0;  
85 - this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;  
86 - this.lenMinClientSecretKey = LEN_MAX_PSK;  
87 - this.lenMaxClientSecretKey = LEN_MAX_PSK;  
88 - this.setValidatorsSecurity(securityMode);  
89 - break;  
90 - case SECURITY_CONFIG_MODE.RPK:  
91 - this.lenMinClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;  
92 - this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_RPK;  
93 - this.lenMinClientSecretKey = LEN_MAX_PRIVATE_KEY;  
94 - this.lenMaxClientSecretKey = LEN_MAX_PRIVATE_KEY;  
95 - this.setValidatorsSecurity(securityMode);  
96 - break;  
97 - case SECURITY_CONFIG_MODE.X509:  
98 - this.lenMinClientPublicKeyOrId = 0;  
99 - this.lenMaxClientPublicKeyOrId = LEN_MAX_PUBLIC_KEY_X509;  
100 - this.lenMinClientSecretKey = LEN_MAX_PRIVATE_KEY;  
101 - this.lenMaxClientSecretKey = LEN_MAX_PRIVATE_KEY;  
102 - this.setValidatorsSecurity(securityMode);  
103 - break;  
104 - }  
105 - this.serverFormGroup.updateValueAndValidity();  
106 - }  
107 -  
108 - private setValidatorsSecurity = (securityMode: SECURITY_CONFIG_MODE): void => {  
109 - if (securityMode === SECURITY_CONFIG_MODE.PSK) {  
110 - this.serverFormGroup.get('clientPublicKeyOrId').setValidators([Validators.required]);  
111 - } else {  
112 - this.serverFormGroup.get('clientPublicKeyOrId').setValidators([Validators.required,  
113 - Validators.pattern(KEY_REGEXP_HEX_DEC),  
114 - Validators.minLength(this.lenMinClientPublicKeyOrId),  
115 - Validators.maxLength(this.lenMaxClientPublicKeyOrId)]);  
116 - }  
117 -  
118 - this.serverFormGroup.get('clientSecretKey').setValidators([Validators.required,  
119 - Validators.pattern(KEY_REGEXP_HEX_DEC),  
120 - Validators.minLength(this.lenMinClientSecretKey),  
121 - Validators.maxLength(this.lenMaxClientSecretKey)]);  
122 - }  
123 -  
124 - securityModeChanged(securityMode: SECURITY_CONFIG_MODE): void {  
125 - this.updateValidate(securityMode);  
126 - }  
127 -  
128 - writeValue(value: any): void {  
129 - if (value) {  
130 - this.updateValueFields(value);  
131 - }  
132 - }  
133 -  
134 - registerOnChange(fn: (value: any) => any): void {  
135 - }  
136 -  
137 - registerOnTouched(fn: any): void {  
138 - }  
139 -  
140 - setDisabledState?(isDisabled: boolean): void {  
141 - }  
142 -}  
1 -///  
2 -/// Copyright © 2016-2021 The Thingsboard Authors  
3 -///  
4 -/// Licensed under the Apache License, Version 2.0 (the "License");  
5 -/// you may not use this file except in compliance with the License.  
6 -/// You may obtain a copy of the License at  
7 -///  
8 -/// http://www.apache.org/licenses/LICENSE-2.0  
9 -///  
10 -/// Unless required by applicable law or agreed to in writing, software  
11 -/// distributed under the License is distributed on an "AS IS" BASIS,  
12 -/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  
13 -/// See the License for the specific language governing permissions and  
14 -/// limitations under the License.  
15 -///  
16 -  
17 -  
18 -import {Component, Inject, OnInit} from '@angular/core';  
19 -import {DialogComponent} from '@shared/components/dialog.component';  
20 -import {Store} from '@ngrx/store';  
21 -import {AppState} from '@core/core.state';  
22 -import {Router} from '@angular/router';  
23 -import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';  
24 -import {FormBuilder, FormGroup, Validators} from '@angular/forms';  
25 -import {TranslateService} from '@ngx-translate/core';  
26 -import {  
27 - BOOTSTRAP_SERVER,  
28 - BOOTSTRAP_SERVERS,  
29 - ClientSecurityConfig,  
30 - DeviceCredentialsDialogLwm2mData,  
31 - getClientSecurityConfig,  
32 - JSON_ALL_CONFIG,  
33 - KEY_REGEXP_HEX_DEC,  
34 - LEN_MAX_PSK,  
35 - LEN_MAX_PUBLIC_KEY_RPK,  
36 - LWM2M_SERVER,  
37 - SECURITY_CONFIG_MODE,  
38 - SECURITY_CONFIG_MODE_NAMES,  
39 - SecurityConfigModels  
40 -} from './security-config.models';  
41 -import {WINDOW} from '@core/services/window.service';  
42 -import {MatTabChangeEvent} from '@angular/material/tabs';  
43 -import {MatTab} from '@angular/material/tabs/tab';  
44 -  
45 -@Component({  
46 - selector: 'tb-security-config-lwm2m',  
47 - templateUrl: './security-config.component.html',  
48 - styleUrls: []  
49 -})  
50 -  
51 -export class SecurityConfigComponent extends DialogComponent<SecurityConfigComponent, object> implements OnInit {  
52 -  
53 - lwm2mConfigFormGroup: FormGroup;  
54 - title: string;  
55 - submitted = false;  
56 - securityConfigLwM2MType = SECURITY_CONFIG_MODE;  
57 - securityConfigLwM2MTypes = Object.keys(SECURITY_CONFIG_MODE);  
58 - credentialTypeLwM2MNamesMap = SECURITY_CONFIG_MODE_NAMES;  
59 - formControlNameJsonAllConfig = JSON_ALL_CONFIG;  
60 - jsonAllConfig: SecurityConfigModels;  
61 - bootstrapServers: string;  
62 - bootstrapServer: string;  
63 - lwm2mServer: string;  
64 - jsonObserveData: {};  
65 - lenMaxKeyClient = LEN_MAX_PSK;  
66 - tabPrevious: MatTab;  
67 - tabIndexPrevious = 0;  
68 -  
69 - constructor(protected store: Store<AppState>,  
70 - protected router: Router,  
71 - @Inject(MAT_DIALOG_DATA) public data: DeviceCredentialsDialogLwm2mData,  
72 - public dialogRef: MatDialogRef<SecurityConfigComponent, object>,  
73 - public fb: FormBuilder,  
74 - public translate: TranslateService,  
75 - @Inject(WINDOW) private window: Window) {  
76 - super(store, router, dialogRef);  
77 - }  
78 -  
79 - ngOnInit(): void {  
80 - this.jsonAllConfig = JSON.parse(JSON.stringify(this.data.jsonAllConfig)) as SecurityConfigModels;  
81 - this.initConstants();  
82 - this.lwm2mConfigFormGroup = this.initLwm2mConfigFormGroup();  
83 - this.title = this.translate.instant('device.lwm2m-security-info') + ': ' + this.data.endPoint;  
84 - this.lwm2mConfigFormGroup.get('clientCertificate').disable();  
85 - this.initClientSecurityConfig(this.lwm2mConfigFormGroup.get('jsonAllConfig').value);  
86 - this.registerDisableOnLoadFormControl(this.lwm2mConfigFormGroup.get('securityConfigClientMode'));  
87 - }  
88 -  
89 - private initConstants = (): void => {  
90 - this.bootstrapServers = BOOTSTRAP_SERVERS;  
91 - this.bootstrapServer = BOOTSTRAP_SERVER;  
92 - this.lwm2mServer = LWM2M_SERVER;  
93 - }  
94 -  
95 - /**  
96 - * initChildesFormGroup  
97 - */  
98 - get bootstrapFormGroup(): FormGroup {  
99 - return this.lwm2mConfigFormGroup.get('bootstrapFormGroup') as FormGroup;  
100 - }  
101 -  
102 - get lwm2mServerFormGroup(): FormGroup {  
103 - return this.lwm2mConfigFormGroup.get('lwm2mServerFormGroup') as FormGroup;  
104 - }  
105 -  
106 - get observeAttrFormGroup(): FormGroup {  
107 - return this.lwm2mConfigFormGroup.get('observeFormGroup') as FormGroup;  
108 - }  
109 -  
110 - private initClientSecurityConfig = (jsonAllConfig: SecurityConfigModels): void => {  
111 - switch (jsonAllConfig.client.securityConfigClientMode) {  
112 - case SECURITY_CONFIG_MODE.NO_SEC:  
113 - break;  
114 - case SECURITY_CONFIG_MODE.PSK:  
115 - const clientSecurityConfigPSK = jsonAllConfig.client as ClientSecurityConfig;  
116 - this.lwm2mConfigFormGroup.patchValue({  
117 - identityPSK: clientSecurityConfigPSK.identity,  
118 - clientKey: clientSecurityConfigPSK.key,  
119 - }, {emitEvent: false});  
120 - break;  
121 - case SECURITY_CONFIG_MODE.RPK:  
122 - const clientSecurityConfigRPK = jsonAllConfig.client as ClientSecurityConfig;  
123 - this.lwm2mConfigFormGroup.patchValue({  
124 - clientKey: clientSecurityConfigRPK.key,  
125 - }, {emitEvent: false});  
126 - break;  
127 - case SECURITY_CONFIG_MODE.X509:  
128 - const clientSecurityConfigX509 = jsonAllConfig.client as ClientSecurityConfig;  
129 - this.lwm2mConfigFormGroup.patchValue({  
130 - clientCertificate: clientSecurityConfigX509.x509  
131 - }, {emitEvent: false});  
132 - break;  
133 - }  
134 - this.securityConfigClientUpdateValidators(this.lwm2mConfigFormGroup.get('securityConfigClientMode').value);  
135 - }  
136 -  
137 - securityConfigClientModeChanged = (mode: SECURITY_CONFIG_MODE): void => {  
138 - switch (mode) {  
139 - case SECURITY_CONFIG_MODE.NO_SEC:  
140 - const clientSecurityConfigNoSEC = getClientSecurityConfig(mode) as ClientSecurityConfig;  
141 - this.jsonAllConfig.client = clientSecurityConfigNoSEC;  
142 - this.lwm2mConfigFormGroup.patchValue({  
143 - jsonAllConfig: this.jsonAllConfig,  
144 - clientCertificate: false  
145 - }, {emitEvent: false});  
146 - break;  
147 - case SECURITY_CONFIG_MODE.PSK:  
148 - const clientSecurityConfigPSK = getClientSecurityConfig(mode, this.lwm2mConfigFormGroup.get('endPoint')  
149 - .value) as ClientSecurityConfig;  
150 - clientSecurityConfigPSK.identity = this.data.endPoint;  
151 - clientSecurityConfigPSK.key = this.lwm2mConfigFormGroup.get('clientKey').value;  
152 - this.jsonAllConfig.client = clientSecurityConfigPSK;  
153 - this.lwm2mConfigFormGroup.patchValue({  
154 - identityPSK: clientSecurityConfigPSK.identity,  
155 - clientCertificate: false  
156 - }, {emitEvent: false});  
157 - break;  
158 - case SECURITY_CONFIG_MODE.RPK:  
159 - const clientSecurityConfigRPK = getClientSecurityConfig(mode) as ClientSecurityConfig;  
160 - clientSecurityConfigRPK.key = this.lwm2mConfigFormGroup.get('clientKey').value;  
161 - this.jsonAllConfig.client = clientSecurityConfigRPK;  
162 - this.lwm2mConfigFormGroup.patchValue({  
163 - clientCertificate: false  
164 - }, {emitEvent: false});  
165 - break;  
166 - case SECURITY_CONFIG_MODE.X509:  
167 - this.jsonAllConfig.client = getClientSecurityConfig(mode) as ClientSecurityConfig;  
168 - this.lwm2mConfigFormGroup.patchValue({  
169 - clientCertificate: true  
170 - }, {emitEvent: false});  
171 - break;  
172 - }  
173 - this.securityConfigClientUpdateValidators(mode);  
174 - }  
175 -  
176 - private securityConfigClientUpdateValidators = (mode: SECURITY_CONFIG_MODE): void => {  
177 - switch (mode) {  
178 - case SECURITY_CONFIG_MODE.NO_SEC:  
179 - this.setValidatorsNoSecX509();  
180 - break;  
181 - case SECURITY_CONFIG_MODE.PSK:  
182 - this.lenMaxKeyClient = LEN_MAX_PSK;  
183 - this.setValidatorsPskRpk(mode);  
184 - break;  
185 - case SECURITY_CONFIG_MODE.RPK:  
186 - this.lenMaxKeyClient = LEN_MAX_PUBLIC_KEY_RPK;  
187 - this.setValidatorsPskRpk(mode);  
188 - break;  
189 - case SECURITY_CONFIG_MODE.X509:  
190 - this.lenMaxKeyClient = LEN_MAX_PUBLIC_KEY_RPK;  
191 - this.setValidatorsNoSecX509();  
192 - break;  
193 - }  
194 - this.lwm2mConfigFormGroup.updateValueAndValidity();  
195 - }  
196 -  
197 - private setValidatorsNoSecX509 = (): void => {  
198 - this.lwm2mConfigFormGroup.get('identityPSK').setValidators([]);  
199 - this.lwm2mConfigFormGroup.get('clientKey').setValidators([]);  
200 - }  
201 -  
202 - private setValidatorsPskRpk = (mode: SECURITY_CONFIG_MODE): void => {  
203 - if (mode === SECURITY_CONFIG_MODE.PSK) {  
204 - this.lwm2mConfigFormGroup.get('identityPSK').setValidators([Validators.required]);  
205 - } else {  
206 - this.lwm2mConfigFormGroup.get('identityPSK').setValidators([]);  
207 - }  
208 - this.lwm2mConfigFormGroup.get('clientKey').setValidators([Validators.required,  
209 - Validators.pattern(KEY_REGEXP_HEX_DEC),  
210 - Validators.maxLength(this.lenMaxKeyClient), Validators.minLength(this.lenMaxKeyClient)]);  
211 - }  
212 -  
213 - tabChanged = (tabChangeEvent: MatTabChangeEvent): void => {  
214 - if (this.tabIndexPrevious !== tabChangeEvent.index) { this.upDateValueToJson(); }  
215 - this.tabIndexPrevious = tabChangeEvent.index;  
216 - }  
217 -  
218 - private upDateValueToJson(): void {  
219 - switch (this.tabIndexPrevious) {  
220 - case 0:  
221 - this.upDateValueToJsonTab0();  
222 - break;  
223 - case 1:  
224 - this.upDateValueToJsonTab1();  
225 - break;  
226 - case 2:  
227 - this.upDateValueToJsonTab2();  
228 - break;  
229 - }  
230 - }  
231 -  
232 - private upDateValueToJsonTab0 = (): void => {  
233 - if (this.lwm2mConfigFormGroup !== null) {  
234 - if (!this.lwm2mConfigFormGroup.get('endPoint').pristine && this.lwm2mConfigFormGroup.get('endPoint').valid) {  
235 - this.data.endPoint = this.lwm2mConfigFormGroup.get('endPoint').value;  
236 - /** Client mode == PSK */  
237 - if (this.lwm2mConfigFormGroup.get('securityConfigClientMode').value === SECURITY_CONFIG_MODE.PSK) {  
238 - const endPoint = 'endpoint';  
239 - this.jsonAllConfig.client[endPoint] = this.data.endPoint;  
240 - this.lwm2mConfigFormGroup.get('endPoint').markAsPristine({  
241 - onlySelf: true  
242 - });  
243 - this.upDateJsonAllConfig();  
244 - }  
245 - }  
246 - /** only Client mode == PSK */  
247 - if (!this.lwm2mConfigFormGroup.get('identityPSK').pristine && this.lwm2mConfigFormGroup.get('identityPSK').valid) {  
248 - this.lwm2mConfigFormGroup.get('identityPSK').markAsPristine({  
249 - onlySelf: true  
250 - });  
251 - this.updateIdentityPSK();  
252 - }  
253 - /** only Client mode == PSK (len = 64) || RPK (len = 182) */  
254 - if (!this.lwm2mConfigFormGroup.get('clientKey').pristine && this.lwm2mConfigFormGroup.get('clientKey').valid) {  
255 - this.lwm2mConfigFormGroup.get('clientKey').markAsPristine({  
256 - onlySelf: true  
257 - });  
258 - this.updateClientKey();  
259 - }  
260 - }  
261 - }  
262 -  
263 - private upDateValueToJsonTab1 = (): void => {  
264 - if (this.lwm2mConfigFormGroup !== null) {  
265 - if (this.bootstrapFormGroup !== null && !this.bootstrapFormGroup.pristine && this.bootstrapFormGroup.valid) {  
266 - this.jsonAllConfig.bootstrap.bootstrapServer = this.bootstrapFormGroup.value;  
267 - this.bootstrapFormGroup.markAsPristine({  
268 - onlySelf: true  
269 - });  
270 - this.upDateJsonAllConfig();  
271 - }  
272 -  
273 - if (this.lwm2mServerFormGroup !== null && !this.lwm2mServerFormGroup.pristine && this.lwm2mServerFormGroup.valid) {  
274 - this.jsonAllConfig.bootstrap.lwm2mServer = this.lwm2mServerFormGroup.value;  
275 - this.lwm2mServerFormGroup.markAsPristine({  
276 - onlySelf: true  
277 - });  
278 - this.upDateJsonAllConfig();  
279 - }  
280 - }  
281 - }  
282 -  
283 - private upDateValueToJsonTab2 = (): void => {  
284 - if (!this.lwm2mConfigFormGroup.get(this.formControlNameJsonAllConfig).pristine &&  
285 - this.lwm2mConfigFormGroup.get(this.formControlNameJsonAllConfig).valid) {  
286 - this.jsonAllConfig = this.lwm2mConfigFormGroup.get(this.formControlNameJsonAllConfig).value;  
287 - this.lwm2mConfigFormGroup.get(this.formControlNameJsonAllConfig).markAsPristine({  
288 - onlySelf: true  
289 - });  
290 - }  
291 - }  
292 -  
293 - private updateIdentityPSK = (): void => {  
294 - const securityMode = 'securityMode';  
295 - if (this.lwm2mConfigFormGroup.get('bootstrapServer').value[securityMode] === SECURITY_CONFIG_MODE.PSK) {  
296 - this.lwm2mConfigFormGroup.get('bootstrapFormGroup').patchValue({  
297 - clientPublicKeyOrId: this.lwm2mConfigFormGroup.get('identityPSK').value  
298 - });  
299 - const identity = 'identity';  
300 - this.jsonAllConfig.client[identity] = this.lwm2mConfigFormGroup.get('identityPSK').value;  
301 - this.upDateJsonAllConfig();  
302 - }  
303 - if (this.lwm2mConfigFormGroup.get('lwm2mServer').value[securityMode] === SECURITY_CONFIG_MODE.PSK) {  
304 - this.lwm2mConfigFormGroup.get('lwm2mServerFormGroup').patchValue({  
305 - clientPublicKeyOrId: this.lwm2mConfigFormGroup.get('identityPSK').value  
306 - });  
307 - this.jsonAllConfig.bootstrap.lwm2mServer.clientPublicKeyOrId = this.lwm2mConfigFormGroup.get('identityPSK').value;  
308 - this.upDateJsonAllConfig();  
309 - }  
310 - }  
311 -  
312 - private updateClientKey = (): void => {  
313 - const key = 'key';  
314 - const securityMode = 'securityMode';  
315 - this.jsonAllConfig.client[key] = this.lwm2mConfigFormGroup.get('clientKey').value;  
316 - if (this.lwm2mConfigFormGroup.get('bootstrapServer').value[securityMode] === SECURITY_CONFIG_MODE.PSK) {  
317 - this.lwm2mConfigFormGroup.get('bootstrapServer').patchValue({  
318 - clientSecretKey: this.jsonAllConfig.client[key]  
319 - }, {emitEvent: false});  
320 - this.jsonAllConfig.bootstrap.bootstrapServer.clientSecretKey = this.jsonAllConfig.client[key];  
321 - }  
322 - if (this.lwm2mConfigFormGroup.get('lwm2mServer').value[securityMode] === SECURITY_CONFIG_MODE.PSK) {  
323 - this.lwm2mConfigFormGroup.get('lwm2mServer').patchValue({  
324 - clientSecretKey: this.jsonAllConfig.client[key]  
325 - }, {emitEvent: false});  
326 - this.jsonAllConfig.bootstrap.lwm2mServer.clientSecretKey = this.jsonAllConfig.client[key];  
327 - }  
328 - this.upDateJsonAllConfig();  
329 - }  
330 -  
331 - private upDateJsonAllConfig = (): void => {  
332 - this.data.jsonAllConfig = JSON.parse(JSON.stringify(this.jsonAllConfig));  
333 - this.lwm2mConfigFormGroup.patchValue({  
334 - jsonAllConfig: JSON.parse(JSON.stringify(this.jsonAllConfig))  
335 - }, {emitEvent: false});  
336 - this.lwm2mConfigFormGroup.markAsDirty();  
337 - }  
338 -  
339 - private initLwm2mConfigFormGroup = (): FormGroup => {  
340 - if (SECURITY_CONFIG_MODE[this.jsonAllConfig.client.securityConfigClientMode.toString()] === SECURITY_CONFIG_MODE.PSK) {  
341 - const endpoint = 'endpoint';  
342 - this.data.endPoint = this.jsonAllConfig.client[endpoint];  
343 - }  
344 - return this.fb.group({  
345 - securityConfigClientMode: [SECURITY_CONFIG_MODE[this.jsonAllConfig.client.securityConfigClientMode.toString()], []],  
346 - identityPSK: ['', []],  
347 - clientKey: ['', []],  
348 - clientCertificate: [false, []],  
349 - bootstrapServer: [this.jsonAllConfig.bootstrap[this.bootstrapServer], []],  
350 - lwm2mServer: [this.jsonAllConfig.bootstrap[this.lwm2mServer], []],  
351 - bootstrapFormGroup: this.getServerGroup(),  
352 - lwm2mServerFormGroup: this.getServerGroup(),  
353 - endPoint: [this.data.endPoint, []],  
354 - jsonAllConfig: [this.jsonAllConfig, []]  
355 - });  
356 - }  
357 -  
358 - private getServerGroup = (): FormGroup => {  
359 - return this.fb.group({  
360 - securityMode: [this.fb.control(SECURITY_CONFIG_MODE.NO_SEC), []],  
361 - clientPublicKeyOrId: ['', []],  
362 - clientSecretKey: ['', []]  
363 - });  
364 - }  
365 -  
366 - save(): void {  
367 - this.upDateValueToJson();  
368 - this.data.endPoint = this.lwm2mConfigFormGroup.get('endPoint').value.split('\'').join('');  
369 - this.data.jsonAllConfig = this.jsonAllConfig;  
370 - if (this.lwm2mConfigFormGroup.get('securityConfigClientMode').value === SECURITY_CONFIG_MODE.PSK) {  
371 - const identity = 'identity';  
372 - this.data.endPoint = this.data.jsonAllConfig.client[identity];  
373 - }  
374 - this.dialogRef.close(this.data);  
375 - }  
376 -  
377 - cancel(): void {  
378 - this.dialogRef.close(undefined);  
379 - }  
380 -}  
381 -  
382 -  
ui-ngx/src/app/shared/models/lwm2m-security-config.models.ts renamed from ui-ngx/src/app/modules/home/pages/device/lwm2m/security-config.models.ts
@@ -17,9 +17,6 @@ @@ -17,9 +17,6 @@
17 export const JSON_ALL_CONFIG = 'jsonAllConfig'; 17 export const JSON_ALL_CONFIG = 'jsonAllConfig';
18 export const END_POINT = 'endPoint'; 18 export const END_POINT = 'endPoint';
19 export const DEFAULT_END_POINT = 'default_client_lwm2m_end_point_no_sec'; 19 export const DEFAULT_END_POINT = 'default_client_lwm2m_end_point_no_sec';
20 -export const BOOTSTRAP_SERVERS = 'servers';  
21 -export const BOOTSTRAP_SERVER = 'bootstrapServer';  
22 -export const LWM2M_SERVER = 'lwm2mServer';  
23 export const LEN_MAX_PSK = 64; 20 export const LEN_MAX_PSK = 64;
24 export const LEN_MAX_PRIVATE_KEY = 134; 21 export const LEN_MAX_PRIVATE_KEY = 134;
25 export const LEN_MAX_PUBLIC_KEY_RPK = 182; 22 export const LEN_MAX_PUBLIC_KEY_RPK = 182;
@@ -28,28 +25,28 @@ export const KEY_REGEXP_HEX_DEC = /^[-+]?[0-9A-Fa-f]+\.?[0-9A-Fa-f]*?$/; @@ -28,28 +25,28 @@ export const KEY_REGEXP_HEX_DEC = /^[-+]?[0-9A-Fa-f]+\.?[0-9A-Fa-f]*?$/;
28 25
29 26
30 export interface DeviceCredentialsDialogLwm2mData { 27 export interface DeviceCredentialsDialogLwm2mData {
31 - jsonAllConfig?: SecurityConfigModels; 28 + jsonAllConfig?: Lwm2mSecurityConfigModels;
32 endPoint?: string; 29 endPoint?: string;
33 } 30 }
34 31
35 -export enum SECURITY_CONFIG_MODE { 32 +export enum Lwm2mSecurityType {
36 PSK = 'PSK', 33 PSK = 'PSK',
37 RPK = 'RPK', 34 RPK = 'RPK',
38 X509 = 'X509', 35 X509 = 'X509',
39 NO_SEC = 'NO_SEC' 36 NO_SEC = 'NO_SEC'
40 } 37 }
41 38
42 -export const SECURITY_CONFIG_MODE_NAMES = new Map<SECURITY_CONFIG_MODE, string>( 39 +export const Lwm2mSecurityTypeTranslationMap = new Map<Lwm2mSecurityType, string>(
43 [ 40 [
44 - [SECURITY_CONFIG_MODE.PSK, 'Pre-Shared Key'],  
45 - [SECURITY_CONFIG_MODE.RPK, 'Raw Public Key'],  
46 - [SECURITY_CONFIG_MODE.X509, 'X.509 Certificate'],  
47 - [SECURITY_CONFIG_MODE.NO_SEC, 'No Security'], 41 + [Lwm2mSecurityType.PSK, 'Pre-Shared Key'],
  42 + [Lwm2mSecurityType.RPK, 'Raw Public Key'],
  43 + [Lwm2mSecurityType.X509, 'X.509 Certificate'],
  44 + [Lwm2mSecurityType.NO_SEC, 'No Security'],
48 ] 45 ]
49 ); 46 );
50 47
51 export interface ClientSecurityConfig { 48 export interface ClientSecurityConfig {
52 - securityConfigClientMode: string; 49 + securityConfigClientMode: Lwm2mSecurityType;
53 endpoint: string; 50 endpoint: string;
54 identity: string; 51 identity: string;
55 key: string; 52 key: string;
@@ -57,7 +54,7 @@ export interface ClientSecurityConfig { @@ -57,7 +54,7 @@ export interface ClientSecurityConfig {
57 } 54 }
58 55
59 export interface ServerSecurityConfig { 56 export interface ServerSecurityConfig {
60 - securityMode: string; 57 + securityMode: Lwm2mSecurityType;
61 clientPublicKeyOrId?: string; 58 clientPublicKeyOrId?: string;
62 clientSecretKey?: string; 59 clientSecretKey?: string;
63 } 60 }
@@ -67,20 +64,19 @@ interface BootstrapSecurityConfig { @@ -67,20 +64,19 @@ interface BootstrapSecurityConfig {
67 lwm2mServer: ServerSecurityConfig; 64 lwm2mServer: ServerSecurityConfig;
68 } 65 }
69 66
70 -export interface SecurityConfigModels { 67 +export interface Lwm2mSecurityConfigModels {
71 client: ClientSecurityConfig; 68 client: ClientSecurityConfig;
72 bootstrap: BootstrapSecurityConfig; 69 bootstrap: BootstrapSecurityConfig;
73 } 70 }
74 71
75 -export function getClientSecurityConfig(securityConfigMode: SECURITY_CONFIG_MODE, endPoint?: string): ClientSecurityConfig {  
76 - let security = getDefaultClientSecurityConfig();  
77 - security.securityConfigClientMode = securityConfigMode.toString(); 72 +export function getClientSecurityConfig(securityConfigMode: Lwm2mSecurityType, endPoint = ''): ClientSecurityConfig {
  73 + const security = getDefaultClientSecurityConfig(securityConfigMode);
78 switch (securityConfigMode) { 74 switch (securityConfigMode) {
79 - case SECURITY_CONFIG_MODE.PSK: 75 + case Lwm2mSecurityType.PSK:
80 security.endpoint = endPoint; 76 security.endpoint = endPoint;
81 security.identity = endPoint; 77 security.identity = endPoint;
82 break; 78 break;
83 - case SECURITY_CONFIG_MODE.X509: 79 + case Lwm2mSecurityType.X509:
84 security.x509 = true; 80 security.x509 = true;
85 break; 81 break;
86 } 82 }
@@ -88,9 +84,9 @@ export function getClientSecurityConfig(securityConfigMode: SECURITY_CONFIG_MODE @@ -88,9 +84,9 @@ export function getClientSecurityConfig(securityConfigMode: SECURITY_CONFIG_MODE
88 return security; 84 return security;
89 } 85 }
90 86
91 -export function getDefaultClientSecurityConfig(): ClientSecurityConfig { 87 +export function getDefaultClientSecurityConfig(securityConfigMode: Lwm2mSecurityType): ClientSecurityConfig {
92 return { 88 return {
93 - securityConfigClientMode: SECURITY_CONFIG_MODE.NO_SEC.toString(), 89 + securityConfigClientMode: securityConfigMode,
94 endpoint: '', 90 endpoint: '',
95 identity: '', 91 identity: '',
96 key: '', 92 key: '',
@@ -100,7 +96,7 @@ export function getDefaultClientSecurityConfig(): ClientSecurityConfig { @@ -100,7 +96,7 @@ export function getDefaultClientSecurityConfig(): ClientSecurityConfig {
100 96
101 export function getDefaultServerSecurityConfig(): ServerSecurityConfig { 97 export function getDefaultServerSecurityConfig(): ServerSecurityConfig {
102 return { 98 return {
103 - securityMode: SECURITY_CONFIG_MODE.NO_SEC.toString(), 99 + securityMode: Lwm2mSecurityType.NO_SEC,
104 clientPublicKeyOrId: '', 100 clientPublicKeyOrId: '',
105 clientSecretKey: '' 101 clientSecretKey: ''
106 }; 102 };
@@ -113,46 +109,42 @@ function getDefaultBootstrapSecurityConfig(): BootstrapSecurityConfig { @@ -113,46 +109,42 @@ function getDefaultBootstrapSecurityConfig(): BootstrapSecurityConfig {
113 }; 109 };
114 } 110 }
115 111
116 -export function getDefaultSecurityConfig(): SecurityConfigModels { 112 +export function getDefaultSecurityConfig(): Lwm2mSecurityConfigModels {
117 const securityConfigModels = { 113 const securityConfigModels = {
118 - client: getClientSecurityConfig(SECURITY_CONFIG_MODE.NO_SEC), 114 + client: getClientSecurityConfig(Lwm2mSecurityType.NO_SEC),
119 bootstrap: getDefaultBootstrapSecurityConfig() 115 bootstrap: getDefaultBootstrapSecurityConfig()
120 }; 116 };
121 return securityConfigModels; 117 return securityConfigModels;
122 } 118 }
123 119
124 -const isSecurityConfigModels = (p: any): p is SecurityConfigModels => 120 +const isSecurityConfigModels = (p: any): boolean =>
125 p.hasOwnProperty('client') && 121 p.hasOwnProperty('client') &&
126 - isClientSecurityConfigType(p['client']) && 122 + isClientSecurityConfigType(p.client) &&
127 p.hasOwnProperty('bootstrap') && 123 p.hasOwnProperty('bootstrap') &&
128 - isBootstrapSecurityConfig(p['bootstrap']); 124 + isBootstrapSecurityConfig(p.bootstrap);
129 125
130 -const isClientSecurityConfigType = (p: any): p is ClientSecurityConfig => 126 +const isClientSecurityConfigType = (p: any): boolean =>
131 p.hasOwnProperty('securityConfigClientMode') && 127 p.hasOwnProperty('securityConfigClientMode') &&
132 p.hasOwnProperty('endpoint') && 128 p.hasOwnProperty('endpoint') &&
133 p.hasOwnProperty('identity') && 129 p.hasOwnProperty('identity') &&
134 p.hasOwnProperty('key') && 130 p.hasOwnProperty('key') &&
135 p.hasOwnProperty('x509'); 131 p.hasOwnProperty('x509');
136 132
137 -const isBootstrapSecurityConfig = (p: any): p is BootstrapSecurityConfig => 133 +const isBootstrapSecurityConfig = (p: any): boolean =>
138 p.hasOwnProperty('bootstrapServer') && 134 p.hasOwnProperty('bootstrapServer') &&
139 - isServerSecurityConfig(p['bootstrapServer']) && 135 + isServerSecurityConfig(p.bootstrapServer) &&
140 p.hasOwnProperty('lwm2mServer') && 136 p.hasOwnProperty('lwm2mServer') &&
141 - isServerSecurityConfig(p['lwm2mServer']); 137 + isServerSecurityConfig(p.lwm2mServer);
142 138
143 -const isServerSecurityConfig = (p: any): p is ServerSecurityConfig => 139 +const isServerSecurityConfig = (p: any): boolean =>
144 p.hasOwnProperty('securityMode') && 140 p.hasOwnProperty('securityMode') &&
145 p.hasOwnProperty('clientPublicKeyOrId') && 141 p.hasOwnProperty('clientPublicKeyOrId') &&
146 p.hasOwnProperty('clientSecretKey'); 142 p.hasOwnProperty('clientSecretKey');
147 143
148 export function validateSecurityConfig(config: string): boolean { 144 export function validateSecurityConfig(config: string): boolean {
149 try { 145 try {
150 - const securityConfig= JSON.parse(config);  
151 - if (isSecurityConfigModels(securityConfig)) {  
152 - return true;  
153 - } else {  
154 - return false;  
155 - } 146 + const securityConfig = JSON.parse(config);
  147 + return isSecurityConfigModels(securityConfig);
156 } catch (e) { 148 } catch (e) {
157 return false; 149 return false;
158 } 150 }
@@ -928,9 +928,13 @@ @@ -928,9 +928,13 @@
928 "lwm2m-credentials-value-tip": "Edit security config json editor", 928 "lwm2m-credentials-value-tip": "Edit security config json editor",
929 "lwm2m-security-config": { 929 "lwm2m-security-config": {
930 "identity": "Client Identity", 930 "identity": "Client Identity",
  931 + "identity-required": "Client Identity is required.",
931 "client-key": "Client Key", 932 "client-key": "Client Key",
932 - "required": " value is required.", 933 + "client-key-required": "Client Key is required.",
  934 + "client-key-pattern": "Client Key must be hexadecimal format.",
  935 + "client-key-length": "Client Key must be {{ count }} characters.",
933 "endpoint": "Endpoint Client Name", 936 "endpoint": "Endpoint Client Name",
  937 + "endpoint-required": "Endpoint Client Name is required.",
934 "mode": "Security config mode", 938 "mode": "Security config mode",
935 "client-tab": "Client Security Config", 939 "client-tab": "Client Security Config",
936 "client-certificate": "Client certificate", 940 "client-certificate": "Client certificate",
@@ -938,9 +942,14 @@ @@ -938,9 +942,14 @@
938 "bootstrap-server": "Bootstrap Server", 942 "bootstrap-server": "Bootstrap Server",
939 "lwm2m-server": "LwM2M Server", 943 "lwm2m-server": "LwM2M Server",
940 "client-publicKey-or-id": "Client Public Key or Id", 944 "client-publicKey-or-id": "Client Public Key or Id",
  945 + "client-publicKey-or-id-required": "Client Public Key or Id is required.",
  946 + "client-publicKey-or-id-pattern": "Client Public Key or Id must be hexadecimal format.",
  947 + "client-publicKey-or-id-length": "Client Public Key or Id must be {{ count }} characters.",
941 "client-secret-key": "Client Secret Key", 948 "client-secret-key": "Client Secret Key",
942 - "config-json-tab": "Json Client Security Config",  
943 - "pattern_hex_dec": "{ count, plural, 0 {must be hex decimal format} other {must be # characters} }" 949 + "client-secret-key-required": "Client Secret Key is required.",
  950 + "client-secret-key-pattern": "Client Secret Key must be hexadecimal format.",
  951 + "client-secret-key-length": "Client Secret Key must be {{ count }} characters.",
  952 + "config-json-tab": "Json Client Security Config"
944 }, 953 },
945 "client-id": "Client ID", 954 "client-id": "Client ID",
946 "client-id-pattern": "Contains invalid character.", 955 "client-id-pattern": "Contains invalid character.",