UI: Add gerenator for access token for device credentials

ui-ngx/src/app/modules/home/components/device/device-credentials.component.html

@@ -29,6 +29,16 @@
       <mat-form-field class="mat-block">
         <mat-label translate>device.access-token</mat-label>
         <input matInput formControlName="credentialsId" required>
+        <button type="button"
+                matSuffix
+                mat-icon-button
+                aria-label="Generate"
+                matTooltip="{{ 'device.generate-access-token' | translate }}"
+                matTooltipPosition="above"
+                (click)="generate('credentialsId')"
+                *ngIf="!deviceCredentialsFormGroup.get('credentialsId').value">
+          <mat-icon>autorenew</mat-icon>
+        </button>
         <tb-copy-button
           matSuffix
           inputAction

ui-ngx/src/app/modules/home/components/device/device-credentials.component.ts

@@ -34,7 +34,7 @@ import {
 } from '@shared/models/device.models';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
-import { isDefinedAndNotNull } from '@core/utils';
+import { generateSecret, isDefinedAndNotNull } from '@core/utils';
 
 @Component({
   selector: 'tb-device-credentials',
@@ -181,4 +181,8 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
         break;
     }
   }
+
+  public generate(formControlName: string) {
+    this.deviceCredentialsFormGroup.get(formControlName).patchValue(generateSecret(12));
+  }
 }

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -1241,6 +1241,7 @@
         "generate-client-id": "Generate Client ID",
         "generate-user-name": "Generate User name",
         "generate-password": "Generate Password",
+        "generate-access-token": "Generate Access Token",
         "lwm2m-security-config": {
           "identity": "Client Identity",
           "identity-required": "Client Identity is required.",