From 042d25e7f03d564f2b3e2ccd0962b9df9e17d75b Mon Sep 17 00:00:00 2001
From: Igor Kulikov <ikulikov@thingsboard.io>
Date: Wed, 24 Jul 2024 13:11:09 +0300
Subject: [PATCH] UI: Update flow meter SCADA symbols metadata - remove
 showValue property.

---
 .../scada_symbols/bottom-flow-meter.svg       | 26 ++++---------------
 .../horizontal-inline-flow-meter.svg          | 26 ++++---------------
 .../system/scada_symbols/left-flow-meter.svg  | 26 ++++---------------
 .../system/scada_symbols/right-flow-meter.svg | 26 ++++---------------
 .../system/scada_symbols/top-flow-meter.svg   | 26 ++++---------------
 .../vertical-inline-flow-meter.svg            | 26 ++++---------------
 .../scada-symbol-object-settings.component.ts | 12 ++++++---
 .../scada-symbol-properties.component.ts      |  7 +++++
 .../assets/locale/locale.constant-en_US.json  |  1 +
 9 files changed, 46 insertions(+), 130 deletions(-)

diff --git a/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
index 9647b8b63d..9f85ccdb73 100644
--- a/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/bottom-flow-meter.svg
@@ -53,7 +53,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -62,7 +62,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -238,34 +238,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
index de9a6bcd0a..30caf224e5 100644
--- a/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/horizontal-inline-flow-meter.svg
@@ -52,7 +52,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -61,7 +61,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -237,34 +237,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
index e8a2b945f0..16551bf2e9 100644
--- a/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/left-flow-meter.svg
@@ -52,7 +52,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -61,7 +61,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -237,34 +237,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
index 67a5f9936f..d850e7b2c3 100644
--- a/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/right-flow-meter.svg
@@ -53,7 +53,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -62,7 +62,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -238,34 +238,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
index 7f60ff5a92..f9bf64210f 100644
--- a/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/top-flow-meter.svg
@@ -53,7 +53,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -62,7 +62,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -238,34 +238,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg b/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
index 90c9f3dccd..45b8d1ef2c 100644
--- a/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
+++ b/application/src/main/data/json/system/scada_symbols/vertical-inline-flow-meter.svg
@@ -52,7 +52,7 @@
     },
     {
       "tag": "value",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var value = ctx.values.value;\n    ctx.api.text(element, value.toFixed(0));\n}",
+      "stateRenderFunction": "var value = ctx.values.value;\nctx.api.text(element, value.toFixed(0));\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -61,7 +61,7 @@
     },
     {
       "tag": "valueUnits",
-      "stateRenderFunction": "if (!ctx.properties.showValue) {\n    element.hide();\n} else {\n    var units = ctx.properties.valueUnits;\n    ctx.api.text(element, units || '');\n}",
+      "stateRenderFunction": "var units = ctx.properties.valueUnits;\nctx.api.text(element, units || '');\n",
       "actions": {
         "click": {
           "actionFunction": "ctx.api.callAction(event, 'displayClick');"
@@ -237,34 +237,18 @@
     }
   ],
   "properties": [
-    {
-      "id": "showValue",
-      "name": "{i18n:scada.symbol.value}",
-      "type": "switch",
-      "default": true,
-      "required": null,
-      "subLabel": null,
-      "divider": null,
-      "fieldSuffix": null,
-      "disableOnProperty": null,
-      "rowClass": "",
-      "fieldClass": "",
-      "min": null,
-      "max": null,
-      "step": null
-    },
     {
       "id": "valueUnits",
-      "name": "{i18n:scada.symbol.value}",
+      "name": "{i18n:scada.symbol.units}",
       "type": "units",
       "default": "m³/hr",
       "required": null,
       "subLabel": null,
       "divider": null,
       "fieldSuffix": null,
-      "disableOnProperty": "showValue",
+      "disableOnProperty": null,
       "rowClass": "",
-      "fieldClass": "",
+      "fieldClass": "medium-width",
       "min": null,
       "max": null,
       "step": null
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/scada/scada-symbol-object-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/scada/scada-symbol-object-settings.component.ts
index b521f1af89..e68788cc92 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/scada/scada-symbol-object-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/scada/scada-symbol-object-settings.component.ts
@@ -231,11 +231,15 @@ export class ScadaSymbolObjectSettingsComponent implements OnInit, OnChanges, Co
         if (this.validatorTriggers.length) {
           const observables: Observable<any>[] = [];
           for (const trigger of this.validatorTriggers) {
-            observables.push(propertiesFormGroup.get(trigger).valueChanges);
+            if (propertiesFormGroup.get(trigger)) {
+              observables.push(propertiesFormGroup.get(trigger).valueChanges);
+            }
+          }
+          if (observables.length) {
+            this.validatorSubscription = merge(...observables).subscribe(() => {
+              this.updateValidators();
+            });
           }
-          this.validatorSubscription = merge(...observables).subscribe(() => {
-            this.updateValidators();
-          });
         }
         this.setupValue();
         this.cd.markForCheck();
diff --git a/ui-ngx/src/app/modules/home/pages/scada-symbol/metadata-components/scada-symbol-properties.component.ts b/ui-ngx/src/app/modules/home/pages/scada-symbol/metadata-components/scada-symbol-properties.component.ts
index d636a25c51..840302161b 100644
--- a/ui-ngx/src/app/modules/home/pages/scada-symbol/metadata-components/scada-symbol-properties.component.ts
+++ b/ui-ngx/src/app/modules/home/pages/scada-symbol/metadata-components/scada-symbol-properties.component.ts
@@ -99,6 +99,13 @@ export class ScadaSymbolPropertiesComponent implements ControlValueAccessor, OnI
           properties = properties.filter(p => propertyValid(p));
         }
         this.booleanPropertyIds = properties.filter(p => p.type === ScadaSymbolPropertyType.switch).map(p => p.id);
+        properties.forEach((p, i) => {
+          if (p.disableOnProperty && !this.booleanPropertyIds.includes(p.disableOnProperty)) {
+            p.disableOnProperty = null;
+            const controls = this.propertiesFormArray().controls;
+            controls[i].patchValue(p, {emitEvent: false});
+          }
+        });
         this.propagateChange(properties);
       }
     );
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 3fe821db43..273c5f4c3d 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -3623,6 +3623,7 @@
             "bottom-fluid-color": "Bottom fluid color",
             "display": "Display",
             "value": "Value",
+            "units": "Units",
             "flow-meter-value-hint": "Double value showing on flow meter display",
             "warning-state": "Warning state",
             "warning": "Warning",