From 95fb479504a8820755df6f40174e80ae3ff332b9 Mon Sep 17 00:00:00 2001
From: Vladyslav_Prykhodko <vprykhodko@thingsboard.io>
Date: Tue, 2 Jul 2024 14:32:13 +0300
Subject: [PATCH] UI: Fixed UI build

---
 .../gateway-configuration.component.html      | 164 +++++++++---------
 1 file changed, 82 insertions(+), 82 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.html
index 40e557bbbb..014a7df3d2 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.html
@@ -67,97 +67,97 @@
             </mat-form-field>
           </div>
         </div>
-      </div>
-      <div class="tb-form-panel">
-        <div translate class="tb-form-panel-title">security.security</div>
-        <ng-container formGroupName="security">
-          <tb-toggle-select class="toggle-group" formControlName="type">
-            <tb-toggle-option *ngFor="let securityType of securityTypes | keyvalue"
-                              [value]="securityType.key">{{ securityType.value | translate }}</tb-toggle-option>
-          </tb-toggle-select>
-          <mat-form-field appearance="outline"
-                          *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value.toLowerCase().includes('accesstoken')">
-            <mat-label translate>security.access-token</mat-label>
-            <input matInput formControlName="accessToken"/>
-            <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.accessToken').hasError('required')">
-              {{ 'security.access-token-required' | translate }}
-            </mat-error>
-            <tb-copy-button
-              matSuffix
-              miniButton="false"
-              *ngIf="gatewayConfigGroup.get('thingsboard.security.accessToken').value"
-              [copyText]="gatewayConfigGroup.get('thingsboard.security.accessToken').value"
-              tooltipText="{{ 'device.copy-access-token' | translate }}"
-              tooltipPosition="above"
-              icon="content_copy">
-            </tb-copy-button>
-            <mat-icon matIconSuffix style="cursor:pointer;"
-                      matTooltip="{{ 'gateway.hints.token' | translate }}">info_outlined
-            </mat-icon>
-          </mat-form-field>
-          <section>
-            <div class="tb-form-row no-border no-padding tb-standard-fields"
-                 *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'">
-              <mat-form-field appearance="outline" class="flex">
-                <mat-label translate>security.clientId</mat-label>
-                <input matInput formControlName="clientId"/>
-                <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.clientId').hasError('required')">
-                  {{ 'security.clientId-required' | translate }}
-                </mat-error>
-                <tb-copy-button
-                  matSuffix
-                  miniButton="false"
-                  *ngIf="gatewayConfigGroup.get('thingsboard.security.clientId').value"
-                  [copyText]="gatewayConfigGroup.get('thingsboard.security.clientId').value"
-                  tooltipText="{{ 'gateway.copy-client-id' | translate }}"
-                  tooltipPosition="above"
-                  icon="content_copy">
-                </tb-copy-button>
-                <mat-icon matIconSuffix style="cursor:pointer;"
-                          matTooltip="{{ 'gateway.hints.client-id' | translate }}">info_outlined
-                </mat-icon>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="flex">
-                <mat-label translate>security.username</mat-label>
-                <input matInput formControlName="username"/>
-                <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.username').hasError('required')">
-                  {{ 'security.username-required' | translate }}
-                </mat-error>
-                <tb-copy-button
-                  matSuffix
-                  miniButton="false"
-                  *ngIf="gatewayConfigGroup.get('thingsboard.security.username').value"
-                  [copyText]="gatewayConfigGroup.get('thingsboard.security.username').value"
-                  tooltipText="{{ 'gateway.copy-username' | translate }}"
-                  tooltipPosition="above"
-                  icon="content_copy">
-                </tb-copy-button>
-                <mat-icon matIconSuffix style="cursor:pointer;"
-                          matTooltip="{{ 'gateway.hints.username' | translate }}">info_outlined
-                </mat-icon>
-              </mat-form-field>
-            </div>
-            <mat-form-field appearance="outline" subscriptSizing="dynamic"
-                            *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'">
-              <mat-label translate>gateway.password</mat-label>
-              <input matInput formControlName="password"/>
+        <div class="tb-form-panel">
+          <div translate class="tb-form-panel-title">security.security</div>
+          <ng-container formGroupName="security">
+            <tb-toggle-select class="toggle-group" formControlName="type">
+              <tb-toggle-option *ngFor="let securityType of securityTypes | keyvalue"
+                                [value]="securityType.key">{{ securityType.value | translate }}
+              </tb-toggle-option>
+            </tb-toggle-select>
+            <mat-form-field appearance="outline"
+                            *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value.toLowerCase().includes('accesstoken')">
+              <mat-label translate>security.access-token</mat-label>
+              <input matInput formControlName="accessToken"/>
+              <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.accessToken').hasError('required')">
+                {{ 'security.access-token-required' | translate }}
+              </mat-error>
               <tb-copy-button
                 matSuffix
                 miniButton="false"
-                *ngIf="gatewayConfigGroup.get('thingsboard.security.password').value"
-                [copyText]="gatewayConfigGroup.get('thingsboard.security.password').value"
-                tooltipText="{{ 'gateway.copy-password' | translate }}"
+                *ngIf="gatewayConfigGroup.get('thingsboard.security.accessToken').value"
+                [copyText]="gatewayConfigGroup.get('thingsboard.security.accessToken').value"
+                tooltipText="{{ 'device.copy-access-token' | translate }}"
                 tooltipPosition="above"
                 icon="content_copy">
               </tb-copy-button>
               <mat-icon matIconSuffix style="cursor:pointer;"
-                        matTooltip="{{ 'gateway.hints.password' | translate }}">info_outlined
+                        matTooltip="{{ 'gateway.hints.token' | translate }}">info_outlined
               </mat-icon>
             </mat-form-field>
-          </section>
-          <tb-error style="margin-top: -12px; display: block;" fxFlex="100"
-                    *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'"
-                    [error]="gatewayConfigGroup.get('thingsboard.security').hasError('atLeastOne') ?
+            <section>
+              <div class="tb-form-row no-border no-padding tb-standard-fields"
+                   *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'">
+                <mat-form-field appearance="outline" class="flex">
+                  <mat-label translate>security.clientId</mat-label>
+                  <input matInput formControlName="clientId"/>
+                  <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.clientId').hasError('required')">
+                    {{ 'security.clientId-required' | translate }}
+                  </mat-error>
+                  <tb-copy-button
+                    matSuffix
+                    miniButton="false"
+                    *ngIf="gatewayConfigGroup.get('thingsboard.security.clientId').value"
+                    [copyText]="gatewayConfigGroup.get('thingsboard.security.clientId').value"
+                    tooltipText="{{ 'gateway.copy-client-id' | translate }}"
+                    tooltipPosition="above"
+                    icon="content_copy">
+                  </tb-copy-button>
+                  <mat-icon matIconSuffix style="cursor:pointer;"
+                            matTooltip="{{ 'gateway.hints.client-id' | translate }}">info_outlined
+                  </mat-icon>
+                </mat-form-field>
+                <mat-form-field appearance="outline" class="flex">
+                  <mat-label translate>security.username</mat-label>
+                  <input matInput formControlName="username"/>
+                  <mat-error *ngIf="gatewayConfigGroup.get('thingsboard.security.username').hasError('required')">
+                    {{ 'security.username-required' | translate }}
+                  </mat-error>
+                  <tb-copy-button
+                    matSuffix
+                    miniButton="false"
+                    *ngIf="gatewayConfigGroup.get('thingsboard.security.username').value"
+                    [copyText]="gatewayConfigGroup.get('thingsboard.security.username').value"
+                    tooltipText="{{ 'gateway.copy-username' | translate }}"
+                    tooltipPosition="above"
+                    icon="content_copy">
+                  </tb-copy-button>
+                  <mat-icon matIconSuffix style="cursor:pointer;"
+                            matTooltip="{{ 'gateway.hints.username' | translate }}">info_outlined
+                  </mat-icon>
+                </mat-form-field>
+              </div>
+              <mat-form-field appearance="outline" subscriptSizing="dynamic" style="width: 100%"
+                              *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'">
+                <mat-label translate>gateway.password</mat-label>
+                <input matInput formControlName="password"/>
+                <tb-copy-button
+                  matSuffix
+                  miniButton="false"
+                  *ngIf="gatewayConfigGroup.get('thingsboard.security.password').value"
+                  [copyText]="gatewayConfigGroup.get('thingsboard.security.password').value"
+                  tooltipText="{{ 'gateway.copy-password' | translate }}"
+                  tooltipPosition="above"
+                  icon="content_copy">
+                </tb-copy-button>
+                <mat-icon matIconSuffix style="cursor:pointer;"
+                          matTooltip="{{ 'gateway.hints.password' | translate }}">info_outlined
+                </mat-icon>
+              </mat-form-field>
+            </section>
+            <tb-error style="margin-top: -12px; display: block;" fxFlex="100"
+                      *ngIf="gatewayConfigGroup.get('thingsboard.security.type').value === 'usernamePassword'"
+                      [error]="gatewayConfigGroup.get('thingsboard.security').hasError('atLeastOne') ?
           ('device.client-id-or-user-name-necessary' | translate) : ''"></tb-error>
             <tb-file-input
               fxFlex="100"