From 5e990da0ba785cf7716d3acb2e61495127852e88 Mon Sep 17 00:00:00 2001
From: Vladyslav_Prykhodko <vprykhodko@thingsboard.io>
Date: Thu, 11 Feb 2021 16:16:06 +0200
Subject: [PATCH] UI: Refactoring alarm-rule inherit

---
 .../filter-predicate-value.component.html     | 19 +++++++++----------
 .../filter-predicate-value.component.ts       | 15 ++++++++-------
 .../components/filter/filter-predicate.scss   |  4 ----
 .../assets/locale/locale.constant-en_US.json  |  4 +++-
 4 files changed, 20 insertions(+), 22 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.html b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.html
index 8365e2ec8c..dd1b92cf7f 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.html
@@ -47,7 +47,7 @@
   </div>
   <div fxFlex fxLayout="column" [fxShow]="dynamicMode">
     <div formGroupName="dynamicValue" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
-      <div fxFlex fxLayout="column">
+      <div fxFlex="35" fxLayout="column">
         <mat-form-field floatLabel="always" hideRequiredMarker class="mat-block">
           <mat-label></mat-label>
           <mat-select formControlName="sourceType" placeholder="{{'filter.dynamic-source-type' | translate}}">
@@ -61,15 +61,6 @@
         </mat-form-field>
         <div class="tb-hint" translate>filter.dynamic-source-type</div>
       </div>
-      <div *ngIf="!allow"
-           [ngClass]="{invisible: !inheritMode}"
-           fxLayout="column"
-           fxLayoutAlign="center center">
-        <mat-checkbox formControlName="inherit"
-                      style="min-width: 35px;"
-        ></mat-checkbox>
-        <div class="tb-hint">Inherit from owner</div>
-      </div>
       <div fxFlex fxLayout="column">
         <mat-form-field floatLabel="always" hideRequiredMarker class="mat-block">
           <mat-label></mat-label>
@@ -77,6 +68,14 @@
         </mat-form-field>
         <div class="tb-hint" translate>filter.source-attribute</div>
       </div>
+      <div *ngIf="!allow && inheritMode"
+           fxLayout="column"
+           style="padding-top: 6px">
+        <mat-checkbox formControlName="inherit">
+          {{ 'filter.inherit-owner' | translate}}
+        </mat-checkbox>
+        <div class="tb-hint" translate>filter.source-attribute-not-set</div>
+      </div>
     </div>
   </div>
   <button mat-icon-button
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.ts b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.ts
index 437a5993e7..03c74fe737 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-value.component.ts
@@ -44,7 +44,8 @@ import {
 })
 export class FilterPredicateValueComponent implements ControlValueAccessor, OnInit {
 
-  private readonly inheritFromSources: DynamicValueSourceType[] = [DynamicValueSourceType.CURRENT_CUSTOMER,
+  private readonly inheritModeForSources: DynamicValueSourceType[] = [
+    DynamicValueSourceType.CURRENT_CUSTOMER,
     DynamicValueSourceType.CURRENT_DEVICE];
 
   @Input() disabled: boolean;
@@ -120,7 +121,7 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
         if (!sourceType) {
           this.filterPredicateValueFormGroup.get('dynamicValue').get('sourceAttribute').patchValue(null, {emitEvent: false});
         }
-        this.updateInheritValue(sourceType);
+        this.updateShowInheritMode(sourceType);
       }
     );
     this.filterPredicateValueFormGroup.valueChanges.subscribe(() => {
@@ -148,11 +149,11 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
     this.filterPredicateValueFormGroup.get('defaultValue').patchValue(predicateValue.defaultValue, {emitEvent: false});
     this.filterPredicateValueFormGroup.get('dynamicValue.sourceType').patchValue(predicateValue.dynamicValue ?
       predicateValue.dynamicValue.sourceType : null, {emitEvent: false});
-    this.filterPredicateValueFormGroup.get('dynamicValue.inherit').patchValue(predicateValue.dynamicValue ?
-      predicateValue.dynamicValue.inherit : false, {emitEvent: false});
     this.filterPredicateValueFormGroup.get('dynamicValue.sourceAttribute').patchValue(predicateValue.dynamicValue ?
       predicateValue.dynamicValue.sourceAttribute : null, {emitEvent: false});
-    this.updateInheritValue(predicateValue?.dynamicValue?.sourceType);
+    this.filterPredicateValueFormGroup.get('dynamicValue.inherit').patchValue(predicateValue.dynamicValue ?
+      predicateValue.dynamicValue.inherit : false, {emitEvent: false});
+    this.updateShowInheritMode(predicateValue?.dynamicValue?.sourceType);
   }
 
   private updateModel() {
@@ -168,8 +169,8 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
     this.propagateChange(predicateValue);
   }
 
-  private updateInheritValue(sourceType: DynamicValueSourceType) {
-    if (this.inheritFromSources.includes(sourceType)) {
+  private updateShowInheritMode(sourceType: DynamicValueSourceType) {
+    if (this.inheritModeForSources.includes(sourceType)) {
       this.inheritMode = true;
     } else {
       this.filterPredicateValueFormGroup.get('dynamicValue.inherit').patchValue(false, {emitEvent: false});
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.scss b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.scss
index 6230a3da0f..e88454b8b3 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.scss
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.scss
@@ -17,10 +17,6 @@
   .tb-hint {
     padding-bottom: 0;
   }
-
-  .invisible{
-    visibility: hidden;
-  }
 }
 
 :host ::ng-deep {
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 32c67e2fe0..dff58d17d0 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -1591,7 +1591,9 @@
          "no-dynamic-value": "No dynamic value",
          "source-attribute": "Source attribute",
          "switch-to-dynamic-value": "Switch to dynamic value",
-         "switch-to-default-value": "Switch to default value"
+         "switch-to-default-value": "Switch to default value",
+         "inherit-owner": "Inherit from owner",
+         "source-attribute-not-set": "If source attribute isn't set"
     },
     "fullscreen": {
         "expand": "Expand to fullscreen",