From cbe5150eda97834cf2587b2d271793509c25e403 Mon Sep 17 00:00:00 2001
From: Vladyslav_Prykhodko <vprykhodko@thingsboard.io>
Date: Wed, 28 Aug 2024 14:44:20 +0300
Subject: [PATCH] UI: Fixed error tooltip for 'Minimum layout width' in layout
 configuration

---
 .../dashboard-settings-dialog.component.html          | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html
index f6b427cd3e..1c3ffbc922 100644
--- a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html
@@ -145,15 +145,16 @@
         </div>
         <div class="tb-form-row space-between">
           <div translate>dashboard.min-layout-width</div>
-          <mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
+          <mat-form-field appearance="outline" class="number medium-width" subscriptSizing="dynamic"
+                          [class.tb-suffix-absolute]="gridSettingsFormGroup.get('minColumns').invalid && gridSettingsFormGroup.get('minColumns').touched">
             <input matInput formControlName="minColumns" type="number" min="10" max="1008" step="1"
                    required
                    placeholder="{{ 'widget-config.set' | translate }}">
             <mat-icon matSuffix
                       matTooltipPosition="above"
                       matTooltipClass="tb-error-tooltip"
-                      [matTooltip]="(gridSettingsFormGroup.get('columns').hasError('required') ? 'dashboard.columns-count-required' :
-                                     (gridSettingsFormGroup.get('columns').hasError('min') ? 'dashboard.min-columns-count-message' : 'dashboard.max-columns-count-message')) | translate"
+                      [matTooltip]="(gridSettingsFormGroup.get('minColumns').hasError('required') ? 'dashboard.columns-count-required' :
+                                     (gridSettingsFormGroup.get('minColumns').hasError('min') ? 'dashboard.min-columns-count-message' : 'dashboard.max-columns-count-message')) | translate"
                       *ngIf="gridSettingsFormGroup.get('minColumns').invalid && gridSettingsFormGroup.get('minColumns').touched"
                       class="tb-error">
               warning
@@ -190,7 +191,7 @@
         </div>
         <div *ngIf="isDefaultLayout && !isDefaultBreakpoint" class="tb-form-row space-between">
           <div translate>dashboard.row-height</div>
-          <mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
+          <mat-form-field appearance="outline" class="number medium-width" subscriptSizing="dynamic">
             <input matInput formControlName="rowHeight" type="number" min="5" max="200" step="any"
                    required
                    placeholder="{{ 'widget-config.set' | translate }}">
@@ -245,7 +246,7 @@
         </div>
         <div *ngIf="!isScada()" class="tb-form-row space-between">
           <div translate>dashboard.mobile-row-height</div>
-          <mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
+          <mat-form-field appearance="outline" class="number medium-width" subscriptSizing="dynamic">
             <input matInput formControlName="mobileRowHeight" type="number" min="5" max="200" step="any"
                    required
                    placeholder="{{ 'widget-config.set' | translate }}">