From 1804cb18e62c1ca4b3e3c17bcbe2c8efb7274ba7 Mon Sep 17 00:00:00 2001
From: ThingsBoard <anna.mikhova@gmail.com>
Date: Wed, 10 Jul 2024 16:50:19 +0300
Subject: [PATCH 1/4] test

---
 .../gateway/gateway-statistics.component.html    | 16 +++++++++++-----
 .../gateway/gateway-statistics.component.scss    |  5 +++++
 .../lib/gateway/gateway-statistics.component.ts  |  6 ++++++
 .../src/assets/locale/locale.constant-en_US.json |  1 +
 ui-ngx/src/styles.scss                           |  3 +++
 5 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
index 4abf67a2d1..7866e8a1c5 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
@@ -30,8 +30,11 @@
     </mat-form-field>
     <mat-error
       *ngIf="!statisticsKeys.length && !commands.length">
-      {{'gateway.statistics.statistic-commands-empty' | translate }}
+      {{ 'gateway.statistics.statistic-commands-empty' | translate }}
     </mat-error>
+    <button mat-flat-button class="mat-mdc-icon-button tb-mat-185" color="primary" (click)="navigateToStatistics()">
+      {{ 'gateway.statistics.statistics-button' | translate }}
+    </button>
     <mat-form-field class="mat-block" *ngIf="commandObj">
       <mat-label>{{ 'gateway.statistics.command' | translate }}</mat-label>
       <input matInput [value]="commandObj.command" disabled>
@@ -42,14 +45,17 @@
     <table [fxShow]="!isNumericData" mat-table [dataSource]="dataSource"
            matSort [matSortActive]="pageLink.sortOrder.property" [matSortDirection]="pageLink.sortDirection()"
            matSortDisableClear>
-      <ng-container matColumnDef="0">
-        <mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'widgets.gateway.created-time' | translate }}</mat-header-cell>
+      <ng-container matColumnDef="0">test
+        <mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'widgets.gateway.created-time' | translate }}
+        </mat-header-cell>
         <mat-cell *matCellDef="let row; let rowIndex = index">
-          {{row[0]| date:'yyyy-MM-dd HH:mm:ss' }}
+          {{ row[0]| date:'yyyy-MM-dd HH:mm:ss' }}
         </mat-cell>
       </ng-container>
       <ng-container matColumnDef="1">
-        <mat-header-cell *matHeaderCellDef mat-sort-header style="width: 70%">{{ 'widgets.gateway.message' | translate }}</mat-header-cell>
+        <mat-header-cell *matHeaderCellDef mat-sort-header
+                         style="width: 70%">{{ 'widgets.gateway.message' | translate }}
+        </mat-header-cell>
         <mat-cell *matCellDef="let row">
           {{ row[1] }}
         </mat-cell>
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
index cd7722d12d..f4b06433b2 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
@@ -36,6 +36,11 @@
       }
     }
 
+    .mat-mdc-icon-button {
+      height: 40px;
+      margin-top: 22px;
+    }
+
     .chart-box, .chart-container {
       height: 100%;
       flex-grow: 1;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
index a3cb79e125..1caab7a462 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
@@ -32,6 +32,7 @@ import { Direction, SortOrder } from '@shared/models/page/sort-order';
 import { MatTableDataSource } from '@angular/material/table';
 import { MatSort } from '@angular/material/sort';
 import { NULL_UUID } from '@shared/models/id/has-uuid';
+import {deepClone} from "@core/utils";
 
 @Component({
   selector: 'tb-gateway-statistics',
@@ -135,6 +136,11 @@ export class GatewayStatisticsComponent implements AfterViewInit {
     }
   }
 
+  public navigateToStatistics() {
+    const params = deepClone(this.ctx.stateController.getStateParams());
+    this.ctx.stateController.openState('configuration', params);
+  }
+
   public sortData() {
     this.dataSource.sortData(this.dataSource.data, this.sort);
   }
diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json
index 33c8d25652..d968219862 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -3152,6 +3152,7 @@
             "statistic": "Statistic",
             "statistics": "Statistics",
             "statistic-commands-empty": "No configured statistic keys found. You can configure them in \"Statistics\" tab in general configuration.",
+            "statistics-button": "Go to configuration",
             "commands": "Commands",
             "send-period": "Statistic send period (in sec)",
             "send-period-required": "Statistic send period is required",
diff --git a/ui-ngx/src/styles.scss b/ui-ngx/src/styles.scss
index 4d5ae09a15..1e12eb4936 100644
--- a/ui-ngx/src/styles.scss
+++ b/ui-ngx/src/styles.scss
@@ -941,6 +941,9 @@ mat-icon {
     &.tb-mat-96 {
       @include tb-mat-icon-button-size(96);
     }
+    &.tb-mat-185 {
+      @include tb-mat-icon-button-size(185);
+    }
   }
 
   .mat-mdc-snack-bar-container {

From 71a474bbf202626c367cc0b02ffb27812ccc0bd6 Mon Sep 17 00:00:00 2001
From: Anna Bondar <111653147+Aniutikm@users.noreply.github.com>
Date: Wed, 10 Jul 2024 16:58:16 +0300
Subject: [PATCH 2/4] refactoring

---
 .../widget/lib/gateway/gateway-statistics.component.html        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
index 7866e8a1c5..896f94463c 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
@@ -45,7 +45,7 @@
     <table [fxShow]="!isNumericData" mat-table [dataSource]="dataSource"
            matSort [matSortActive]="pageLink.sortOrder.property" [matSortDirection]="pageLink.sortDirection()"
            matSortDisableClear>
-      <ng-container matColumnDef="0">test
+      <ng-container matColumnDef="0">
         <mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'widgets.gateway.created-time' | translate }}
         </mat-header-cell>
         <mat-cell *matCellDef="let row; let rowIndex = index">

From cd62960ec392d55494f63c692baecede10b445da Mon Sep 17 00:00:00 2001
From: ThingsBoard <anna.mikhova@gmail.com>
Date: Thu, 11 Jul 2024 17:18:54 +0300
Subject: [PATCH 3/4] button improvements

---
 .../widget/lib/gateway/gateway-statistics.component.html      | 2 +-
 .../widget/lib/gateway/gateway-statistics.component.scss      | 4 ++--
 ui-ngx/src/styles.scss                                        | 3 ---
 3 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
index 7866e8a1c5..42332f65b9 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
@@ -32,7 +32,7 @@
       *ngIf="!statisticsKeys.length && !commands.length">
       {{ 'gateway.statistics.statistic-commands-empty' | translate }}
     </mat-error>
-    <button mat-flat-button class="mat-mdc-icon-button tb-mat-185" color="primary" (click)="navigateToStatistics()">
+    <button mat-flat-button class="mat-mdc-button" color="primary" (click)="navigateToStatistics()">
       {{ 'gateway.statistics.statistics-button' | translate }}
     </button>
     <mat-form-field class="mat-block" *ngIf="commandObj">
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
index f4b06433b2..c0c8e084b1 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
@@ -36,8 +36,8 @@
       }
     }
 
-    .mat-mdc-icon-button {
-      height: 40px;
+    .mat-mdc-button {
+      width: 185px;
       margin-top: 22px;
     }
 
diff --git a/ui-ngx/src/styles.scss b/ui-ngx/src/styles.scss
index 1e12eb4936..4d5ae09a15 100644
--- a/ui-ngx/src/styles.scss
+++ b/ui-ngx/src/styles.scss
@@ -941,9 +941,6 @@ mat-icon {
     &.tb-mat-96 {
       @include tb-mat-icon-button-size(96);
     }
-    &.tb-mat-185 {
-      @include tb-mat-icon-button-size(185);
-    }
   }
 
   .mat-mdc-snack-bar-container {

From a2ec97bf194f50897fee544941ca8d9d9ab574e3 Mon Sep 17 00:00:00 2001
From: ThingsBoard <anna.mikhova@gmail.com>
Date: Thu, 11 Jul 2024 17:50:50 +0300
Subject: [PATCH 4/4] final improvements

---
 .../lib/gateway/gateway-statistics.component.html      | 10 ++++++----
 .../lib/gateway/gateway-statistics.component.scss      |  6 +-----
 .../widget/lib/gateway/gateway-statistics.component.ts |  2 +-
 3 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
index 96770f9c12..5dbc0aee00 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html
@@ -17,7 +17,7 @@
 -->
 <div class="statistics-container" fxLayout="row" fxLayout.lt-md="column">
   <mat-card [formGroup]="statisticForm" *ngIf="!general">
-    <mat-form-field class="mat-block">
+    <mat-form-field class="mat-block" subscriptSizing="dynamic">
       <mat-label>{{ 'gateway.statistics.statistic' | translate }}</mat-label>
       <mat-select formControlName="statisticKey">
         <mat-option *ngFor="let key of statisticsKeys" [value]="key">
@@ -32,9 +32,11 @@
       *ngIf="!statisticsKeys.length && !commands.length">
       {{ 'gateway.statistics.statistic-commands-empty' | translate }}
     </mat-error>
-    <button mat-flat-button class="mat-mdc-button" color="primary" (click)="navigateToStatistics()">
-      {{ 'gateway.statistics.statistics-button' | translate }}
-    </button>
+    <div>
+      <button mat-flat-button color="primary" (click)="navigateToStatistics()">
+        {{ 'gateway.statistics.statistics-button' | translate }}
+      </button>
+    </div>
     <mat-form-field class="mat-block" *ngIf="commandObj">
       <mat-label>{{ 'gateway.statistics.command' | translate }}</mat-label>
       <input matInput [value]="commandObj.command" disabled>
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
index c0c8e084b1..9f719807ca 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss
@@ -28,6 +28,7 @@
       height: 100%;
       margin-right: 35px;
       padding: 15px;
+      gap: 22px;
     }
 
     @media only screen and (max-width: 750px) {
@@ -36,11 +37,6 @@
       }
     }
 
-    .mat-mdc-button {
-      width: 185px;
-      margin-top: 22px;
-    }
-
     .chart-box, .chart-container {
       height: 100%;
       flex-grow: 1;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
index 1caab7a462..b17b8ef28a 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts
@@ -32,7 +32,7 @@ import { Direction, SortOrder } from '@shared/models/page/sort-order';
 import { MatTableDataSource } from '@angular/material/table';
 import { MatSort } from '@angular/material/sort';
 import { NULL_UUID } from '@shared/models/id/has-uuid';
-import {deepClone} from "@core/utils";
+import { deepClone } from '@core/utils';
 
 @Component({
   selector: 'tb-gateway-statistics',