From ce9dcd17c6d94b279358656710295c7002c64afe Mon Sep 17 00:00:00 2001
From: Vladyslav_Prykhodko <vprykhodko@thingsboard.io>
Date: Fri, 26 Feb 2021 16:02:57 +0200
Subject: [PATCH] UI: Add Constant keys in the Device Profile Alarm Rules

---
 ui-ngx/src/app/core/http/entity.service.ts    |  1 +
 .../boolean-filter-predicate.component.html   |  1 +
 .../boolean-filter-predicate.component.ts     |  2 ++
 ...lex-filter-predicate-dialog.component.html |  1 +
 ...mplex-filter-predicate-dialog.component.ts |  1 +
 .../complex-filter-predicate.component.ts     |  5 ++-
 .../filter-predicate-list.component.html      |  1 +
 .../filter/filter-predicate-list.component.ts |  5 ++-
 .../filter-predicate-value.component.html     |  6 ++--
 .../filter-predicate-value.component.ts       |  2 ++
 .../filter/filter-predicate.component.html    |  4 +++
 .../filter/filter-predicate.component.ts      |  2 ++
 .../filter/key-filter-dialog.component.html   | 32 ++++++++++++++++--
 .../filter/key-filter-dialog.component.ts     | 33 ++++++++++++-------
 .../filter/key-filter-list.component.ts       |  1 +
 .../numeric-filter-predicate.component.html   |  1 +
 .../numeric-filter-predicate.component.ts     |  2 ++
 .../string-filter-predicate.component.html    |  1 +
 .../string-filter-predicate.component.ts      |  2 ++
 .../app/shared/models/query/query.models.ts   | 11 +++++--
 .../assets/locale/locale.constant-en_US.json  |  3 +-
 21 files changed, 96 insertions(+), 21 deletions(-)

diff --git a/ui-ngx/src/app/core/http/entity.service.ts b/ui-ngx/src/app/core/http/entity.service.ts
index 463183d06e..1118307d06 100644
--- a/ui-ngx/src/app/core/http/entity.service.ts
+++ b/ui-ngx/src/app/core/http/entity.service.ts
@@ -414,6 +414,7 @@ export class EntityService {
         {
           key: nameField,
           valueType: EntityKeyValueType.STRING,
+          value: null,
           predicate: {
             type: FilterPredicateType.STRING,
             operation: StringOperation.STARTS_WITH,
diff --git a/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.html b/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.html
index 253f7e2138..f7bae7d797 100644
--- a/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.html
@@ -25,6 +25,7 @@
     </mat-select>
   </mat-form-field>
   <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
+                             [onlyUserDynamicSource]="onlyUserDynamicSource"
                              fxFlex="70"
                              [valueType]="valueTypeEnum.BOOLEAN"
                              formControlName="value">
diff --git a/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.ts b/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.ts
index fbd329dc16..c6c8a5ed51 100644
--- a/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/boolean-filter-predicate.component.ts
@@ -41,6 +41,8 @@ export class BooleanFilterPredicateComponent implements ControlValueAccessor, On
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   valueTypeEnum = EntityKeyValueType;
 
   booleanFilterPredicateFormGroup: FormGroup;
diff --git a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.html b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.html
index bbf4887e5f..e2bee07a3f 100644
--- a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.html
@@ -39,6 +39,7 @@
         [valueType]="data.valueType"
         [displayUserParameters]="data.displayUserParameters"
         [allowUserDynamicSource]="data.allowUserDynamicSource"
+        [onlyUserDynamicSource]="data.onlyUserDynamicSource"
         [operation]="complexFilterFormGroup.get('operation').value"
         [key]="data.key"
         formControlName="predicates">
diff --git a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts
index 447546ba2f..3f1bb3cace 100644
--- a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts
@@ -37,6 +37,7 @@ export interface ComplexFilterPredicateDialogData {
   valueType: EntityKeyValueType;
   displayUserParameters: boolean;
   allowUserDynamicSource: boolean;
+  onlyUserDynamicSource: boolean;
 }
 
 @Component({
diff --git a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts
index 0843583a52..9f4acfc3c6 100644
--- a/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts
@@ -52,6 +52,8 @@ export class ComplexFilterPredicateComponent implements ControlValueAccessor, On
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   private propagateChange = null;
 
   private complexFilterPredicate: ComplexFilterPredicateInfo;
@@ -89,7 +91,8 @@ export class ComplexFilterPredicateComponent implements ControlValueAccessor, On
         isAdd: false,
         key: this.key,
         displayUserParameters: this.displayUserParameters,
-        allowUserDynamicSource: this.allowUserDynamicSource
+        allowUserDynamicSource: this.allowUserDynamicSource,
+        onlyUserDynamicSource: this.onlyUserDynamicSource
       }
     }).afterClosed().subscribe(
       (result) => {
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.html b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.html
index c6aee52976..e5bb27f20c 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.html
@@ -53,6 +53,7 @@
               [valueType]="valueType"
               [displayUserParameters]="displayUserParameters"
               [allowUserDynamicSource]="allowUserDynamicSource"
+              [onlyUserDynamicSource]="onlyUserDynamicSource"
               [key]="key"
               [formControl]="predicateControl">
             </tb-filter-predicate>
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts
index e89489e6bb..3c16b01319 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts
@@ -66,6 +66,8 @@ export class FilterPredicateListComponent implements ControlValueAccessor, OnIni
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   filterListFormGroup: FormGroup;
 
   valueTypeEnum = EntityKeyValueType;
@@ -159,7 +161,8 @@ export class FilterPredicateListComponent implements ControlValueAccessor, OnIni
         key: this.key,
         isAdd: true,
         displayUserParameters: this.displayUserParameters,
-        allowUserDynamicSource: this.allowUserDynamicSource
+        allowUserDynamicSource: this.allowUserDynamicSource,
+        onlyUserDynamicSource: this.onlyUserDynamicSource
       }
     }).afterClosed().pipe(
       map((result) => {
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 dd1b92cf7f..4bc249837a 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
@@ -16,7 +16,7 @@
 
 -->
 <div fxFlex fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" [formGroup]="filterPredicateValueFormGroup">
-  <div fxFlex fxLayout="column" [fxShow]="!dynamicMode">
+  <div fxFlex fxLayout="column" [fxShow]="!dynamicMode && !onlyUserDynamicSource">
     <div fxLayout="column" [ngSwitch]="valueType">
       <ng-template [ngSwitchCase]="valueTypeEnum.STRING">
         <mat-form-field floatLabel="always" hideRequiredMarker class="mat-block">
@@ -45,7 +45,7 @@
     </div>
     <div class="tb-hint" translate>filter.default-value</div>
   </div>
-  <div fxFlex fxLayout="column" [fxShow]="dynamicMode">
+  <div fxFlex fxLayout="column" [fxShow]="dynamicMode || onlyUserDynamicSource">
     <div formGroupName="dynamicValue" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
       <div fxFlex="35" fxLayout="column">
         <mat-form-field floatLabel="always" hideRequiredMarker class="mat-block">
@@ -78,7 +78,7 @@
       </div>
     </div>
   </div>
-  <button mat-icon-button
+  <button mat-icon-button *ngIf="!onlyUserDynamicSource"
           class="mat-elevation-z1 tb-mat-32"
           color="primary"
           type="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 03c74fe737..7417317dae 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
@@ -62,6 +62,8 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
     }
   }
 
+  @Input() onlyUserDynamicSource = false;
+
   @Input()
   valueType: EntityKeyValueType;
 
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.html b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.html
index c8e2fd760c..e566e937ed 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.html
@@ -20,12 +20,14 @@
     <ng-template [ngSwitchCase]="filterPredicateType.STRING">
       <tb-string-filter-predicate
         [allowUserDynamicSource]="allowUserDynamicSource"
+        [onlyUserDynamicSource]="onlyUserDynamicSource"
         formControlName="predicate">
       </tb-string-filter-predicate>
     </ng-template>
     <ng-template [ngSwitchCase]="filterPredicateType.NUMERIC">
       <tb-numeric-filter-predicate
         [allowUserDynamicSource]="allowUserDynamicSource"
+        [onlyUserDynamicSource]="onlyUserDynamicSource"
         [valueType]="valueType"
         formControlName="predicate">
       </tb-numeric-filter-predicate>
@@ -33,12 +35,14 @@
     <ng-template [ngSwitchCase]="filterPredicateType.BOOLEAN">
       <tb-boolean-filter-predicate
         [allowUserDynamicSource]="allowUserDynamicSource"
+        [onlyUserDynamicSource]="onlyUserDynamicSource"
         formControlName="predicate">
       </tb-boolean-filter-predicate>
     </ng-template>
     <ng-template [ngSwitchCase]="filterPredicateType.COMPLEX">
       <tb-complex-filter-predicate
         [allowUserDynamicSource]="allowUserDynamicSource"
+        [onlyUserDynamicSource]="onlyUserDynamicSource"
         [key]="key"
         [valueType]="valueType"
         [displayUserParameters]="displayUserParameters"
diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.ts b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.ts
index b9e3246f7c..69972b6a90 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-predicate.component.ts
@@ -45,6 +45,8 @@ export class FilterPredicateComponent implements ControlValueAccessor, OnInit {
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   filterPredicateFormGroup: FormGroup;
 
   type: FilterPredicateType;
diff --git a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html
index 564d245bfb..bde63995ed 100644
--- a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.html
@@ -28,7 +28,7 @@
   <div mat-dialog-content>
     <fieldset [disabled]="isLoading$ | async" fxLayout="column">
       <section fxLayout="row" fxLayoutGap="8px" class="entity-key">
-        <section fxFlex="70" fxLayout="row" formGroupName="key" fxLayoutGap="8px">
+        <section [fxFlex]="isConstantKeyType ? 45 : 70" fxLayout="row" formGroupName="key" fxLayoutGap="8px">
           <mat-form-field fxFlex="40" class="mat-block">
             <mat-label translate>filter.key-type.key-type</mat-label>
             <mat-select required formControlName="type">
@@ -60,7 +60,7 @@
             </mat-error>
           </mat-form-field>
         </section>
-        <mat-form-field fxFlex="30" class="mat-block">
+        <mat-form-field [fxFlex]="isConstantKeyType ? 20 : 30" class="mat-block">
           <mat-label translate>filter.value-type.value-type</mat-label>
           <mat-select formControlName="valueType">
             <mat-select-trigger>
@@ -76,9 +76,37 @@
             {{ 'filter.value-type-required' | translate }}
           </mat-error>
         </mat-form-field>
+        <div fxFlex *ngIf="isConstantKeyType">
+          <div fxLayout="column" [ngSwitch]="keyFilterFormGroup.get('valueType').value">
+            <ng-template [ngSwitchCase]="entityKeyValueTypeEnum.STRING">
+              <mat-form-field class="mat-block">
+                <mat-label translate>filter.value</mat-label>
+                <input matInput required formControlName="value" placeholder="{{'filter.value' | translate}}">
+              </mat-form-field>
+            </ng-template>
+            <ng-template [ngSwitchCase]="entityKeyValueTypeEnum.NUMERIC">
+              <mat-form-field class="mat-block">
+                <mat-label translate>filter.value</mat-label>
+                <input required type="number" matInput formControlName="value">
+              </mat-form-field>
+            </ng-template>
+            <ng-template [ngSwitchCase]="entityKeyValueTypeEnum.DATE_TIME">
+              <tb-datetime formControlName="value"
+                           dateText="filter.date"
+                           timeText="filter.time"
+                           required></tb-datetime>
+            </ng-template>
+            <ng-template [ngSwitchCase]="entityKeyValueTypeEnum.BOOLEAN">
+              <mat-checkbox formControlName="value" style="margin-top: 20px">
+                {{ (keyFilterFormGroup.get('value').value ? 'value.true' : 'value.false') | translate }}
+              </mat-checkbox>
+            </ng-template>
+          </div>
+        </div>
       </section>
       <tb-filter-predicate-list *ngIf="keyFilterFormGroup.get('valueType').value"
                                 [allowUserDynamicSource]="data.allowUserDynamicSource"
+                                [onlyUserDynamicSource]="isConstantKeyType"
                                 [displayUserParameters]="data.displayUserParameters"
                                 [valueType]="keyFilterFormGroup.get('valueType').value"
                                 [key]="keyFilterFormGroup.get('key.key').value"
diff --git a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts
index 38ba7fe6da..d3e95cb8a2 100644
--- a/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/key-filter-dialog.component.ts
@@ -14,7 +14,7 @@
 /// limitations under the License.
 ///
 
-import { Component, ElementRef, Inject, OnDestroy, OnInit, SkipSelf, ViewChild } from '@angular/core';
+import { Component, ElementRef, Inject, OnDestroy, SkipSelf, ViewChild } from '@angular/core';
 import { ErrorStateMatcher } from '@angular/material/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { Store } from '@ngrx/store';
@@ -57,7 +57,7 @@ export interface KeyFilterDialogData {
 })
 export class KeyFilterDialogComponent extends
   DialogComponent<KeyFilterDialogComponent, KeyFilterInfo>
-  implements OnInit, OnDestroy, ErrorStateMatcher {
+  implements OnDestroy, ErrorStateMatcher {
 
   @ViewChild('keyNameInput', {static: true}) private keyNameInput: ElementRef;
 
@@ -69,7 +69,7 @@ export class KeyFilterDialogComponent extends
 
   entityKeyTypes =
     this.data.telemetryKeysOnly ?
-      [EntityKeyType.ATTRIBUTE, EntityKeyType.TIME_SERIES] :
+      [EntityKeyType.ATTRIBUTE, EntityKeyType.TIME_SERIES, EntityKeyType.CONSTANT] :
       [EntityKeyType.ENTITY_FIELD, EntityKeyType.ATTRIBUTE, EntityKeyType.TIME_SERIES];
 
   entityKeyTypeTranslations = entityKeyTypeTranslationMap;
@@ -107,6 +107,7 @@ export class KeyFilterDialogComponent extends
             key: [this.data.keyFilter.key.key, [Validators.required]]
           }
         ),
+        value: [this.data.keyFilter.value],
         valueType: [this.data.keyFilter.valueType, [Validators.required]],
         predicates: [this.data.keyFilter.predicates, [Validators.required]]
       }
@@ -143,6 +144,13 @@ export class KeyFilterDialogComponent extends
         } else {
           this.showAutocomplete = false;
         }
+        if (type === EntityKeyType.CONSTANT) {
+          this.keyFilterFormGroup.get('value').setValidators(Validators.required);
+          this.keyFilterFormGroup.get('value').updateValueAndValidity();
+        } else {
+          this.keyFilterFormGroup.get('value').clearValidators();
+          this.keyFilterFormGroup.get('value').updateValueAndValidity();
+        }
       });
 
       this.keyFilterFormGroup.get('key.key').valueChanges.pipe(
@@ -156,19 +164,18 @@ export class KeyFilterDialogComponent extends
           this.keyFilterFormGroup.get('valueType').patchValue(newValueType, {emitEvent: false});
         }
       });
+
+      this.filteredKeysName = this.keyFilterFormGroup.get('key.key').valueChanges
+        .pipe(
+          map(value => value ? value : ''),
+          mergeMap(name => this.fetchEntityName(name)),
+          takeUntil(this.destroy$)
+        );
     } else {
       this.keyFilterFormGroup.disable({emitEvent: false});
     }
   }
 
-  ngOnInit() {
-    this.filteredKeysName = this.keyFilterFormGroup.get('key.key').valueChanges
-      .pipe(
-        map(value => value ? value : ''),
-        mergeMap(name => this.fetchEntityName(name))
-      );
-  }
-
   ngOnDestroy() {
     super.ngOnDestroy();
     this.destroy$.next();
@@ -208,6 +215,10 @@ export class KeyFilterDialogComponent extends
     }
   }
 
+  get isConstantKeyType(): boolean {
+    return this.keyFilterFormGroup.get('key.type').value === EntityKeyType.CONSTANT;
+  }
+
   private fetchEntityName(searchText?: string): Observable<Array<string>> {
     this.searchText = searchText;
     return this.getEntityKeys().pipe(
diff --git a/ui-ngx/src/app/modules/home/components/filter/key-filter-list.component.ts b/ui-ngx/src/app/modules/home/components/filter/key-filter-list.component.ts
index 58ac8a26db..1229f18ec2 100644
--- a/ui-ngx/src/app/modules/home/components/filter/key-filter-list.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/key-filter-list.component.ts
@@ -161,6 +161,7 @@ export class KeyFilterListComponent implements ControlValueAccessor, OnInit {
           type: EntityKeyType.ATTRIBUTE
         },
         valueType: null,
+        value: null,
         predicates: []
       };
     }
diff --git a/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.html b/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.html
index 678df9c3f9..be79b95e1d 100644
--- a/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.html
@@ -25,6 +25,7 @@
     </mat-select>
   </mat-form-field>
   <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
+                             [onlyUserDynamicSource]="onlyUserDynamicSource"
                              fxFlex="70"
                              [valueType]="valueType"
                              formControlName="value">
diff --git a/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.ts b/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.ts
index 8837a4a35e..434c90fa80 100644
--- a/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/numeric-filter-predicate.component.ts
@@ -42,6 +42,8 @@ export class NumericFilterPredicateComponent implements ControlValueAccessor, On
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   @Input() valueType: EntityKeyValueType;
 
   numericFilterPredicateFormGroup: FormGroup;
diff --git a/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.html b/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.html
index 53f5dee077..6e82ca65a7 100644
--- a/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.html
+++ b/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.html
@@ -29,6 +29,7 @@
     </mat-checkbox>
   </div>
   <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
+                             [onlyUserDynamicSource]="onlyUserDynamicSource"
                              fxFlex="70"
                              [valueType]="valueTypeEnum.STRING"
                              formControlName="value">
diff --git a/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.ts b/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.ts
index b52f36a572..11b4dad275 100644
--- a/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/string-filter-predicate.component.ts
@@ -42,6 +42,8 @@ export class StringFilterPredicateComponent implements ControlValueAccessor, OnI
 
   @Input() allowUserDynamicSource = true;
 
+  @Input() onlyUserDynamicSource = false;
+
   valueTypeEnum = EntityKeyValueType;
 
   stringFilterPredicateFormGroup: FormGroup;
diff --git a/ui-ngx/src/app/shared/models/query/query.models.ts b/ui-ngx/src/app/shared/models/query/query.models.ts
index dcc89852b7..b8dc2564bc 100644
--- a/ui-ngx/src/app/shared/models/query/query.models.ts
+++ b/ui-ngx/src/app/shared/models/query/query.models.ts
@@ -35,14 +35,16 @@ export enum EntityKeyType {
   SERVER_ATTRIBUTE = 'SERVER_ATTRIBUTE',
   TIME_SERIES = 'TIME_SERIES',
   ENTITY_FIELD = 'ENTITY_FIELD',
-  ALARM_FIELD = 'ALARM_FIELD'
+  ALARM_FIELD = 'ALARM_FIELD',
+  CONSTANT = 'CONSTANT'
 }
 
 export const entityKeyTypeTranslationMap = new Map<EntityKeyType, string>(
   [
     [EntityKeyType.ATTRIBUTE, 'filter.key-type.attribute'],
     [EntityKeyType.TIME_SERIES, 'filter.key-type.timeseries'],
-    [EntityKeyType.ENTITY_FIELD, 'filter.key-type.entity-field']
+    [EntityKeyType.ENTITY_FIELD, 'filter.key-type.entity-field'],
+    [EntityKeyType.CONSTANT, 'filter.key-type.constant']
   ]
 );
 
@@ -344,12 +346,14 @@ export interface KeyFilterPredicateInfo {
 export interface KeyFilter {
   key: EntityKey;
   valueType: EntityKeyValueType;
+  value: string | number | boolean;
   predicate: KeyFilterPredicate;
 }
 
 export interface KeyFilterInfo {
   key: EntityKey;
   valueType: EntityKeyValueType;
+  value: string | number | boolean;
   predicates: Array<KeyFilterPredicateInfo>;
 }
 
@@ -466,6 +470,7 @@ export function keyFilterInfosToKeyFilters(keyFilterInfos: Array<KeyFilterInfo>)
       const keyFilter: KeyFilter = {
         key,
         valueType: keyFilterInfo.valueType,
+        value: keyFilterInfo.value,
         predicate: keyFilterPredicateInfoToKeyFilterPredicate(predicate)
       };
       keyFilters.push(keyFilter);
@@ -486,6 +491,7 @@ export function keyFiltersToKeyFilterInfos(keyFilters: Array<KeyFilter>): Array<
         keyFilterInfo = {
           key,
           valueType: keyFilter.valueType,
+          value: keyFilter.value,
           predicates: []
         };
         keyFilterInfoMap[infoKey] = keyFilterInfo;
@@ -508,6 +514,7 @@ export function filterInfoToKeyFilters(filter: FilterInfo): Array<KeyFilter> {
       const keyFilter: KeyFilter = {
         key,
         valueType: keyFilterInfo.valueType,
+        value: keyFilterInfo.value,
         predicate: keyFilterPredicateInfoToKeyFilterPredicate(predicate)
       };
       keyFilters.push(keyFilter);
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 dff58d17d0..216ae2c1b7 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -1564,7 +1564,8 @@
            "key-type": "Key type",
            "attribute": "Attribute",
            "timeseries": "Timeseries",
-           "entity-field": "Entity field"
+           "entity-field": "Entity field",
+           "constant": "Constant"
          },
          "value-type": {
            "value-type": "Value type",