diff --git a/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.html b/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.html
index 16222675db..d5dfca3e71 100644
--- a/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.html
+++ b/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.html
@@ -17,28 +17,21 @@
 -->
 <div class="tb-relation-filters" [formGroup]="relationFiltersFormGroup">
   <div class="container">
-    <div class="header" [fxShow]="relationFiltersFormArray().length">
-      <div fxLayout="row" fxLayoutAlign="start center">
-        <span class="cell" style="width: 200px; min-width: 200px;" translate>relation.type</span>
-        <span class="cell" fxFlex translate>entity.entity-types</span>
-        <span class="cell" style="width: 40px; min-width: 40px;">&nbsp;</span>
-      </div>
-    </div>
     <div class="body" [fxShow]="relationFiltersFormArray().length">
       <div class="row" fxFlex fxLayout="row"
            fxLayoutAlign="start center" formArrayName="relationFilters"
            *ngFor="let relationFilterControl of relationFiltersFormArray().controls; let $index = index">
-        <div class="mat-elevation-z1" fxFlex fxLayout="row" fxLayoutAlign="start center" style="padding: 8px 0;">
-          <tb-relation-type-autocomplete
-            class="cell" style="width: 200px; min-width: 200px;"
-            subscriptSizing="dynamic"
-            [formControl]="relationFilterControl.get('relationType')">
-          </tb-relation-type-autocomplete>
-          <tb-entity-type-list class="cell" fxFlex
-            subscriptSizing="dynamic"
-            [allowedEntityTypes]="allowedEntityTypes"
-            [formControl]="relationFilterControl.get('entityTypes')">
-          </tb-entity-type-list>
+          <div class="input-block"  fxFlex fxLayout="row">
+            <tb-relation-type-autocomplete
+              label="relation.type"
+              class="cell" style="width: 200px; min-width: 200px;"
+              [formControl]="relationFilterControl.get('relationType')">
+            </tb-relation-type-autocomplete>
+            <tb-entity-type-list class="cell" fxFlex
+              [allowedEntityTypes]="allowedEntityTypes"
+              [formControl]="relationFilterControl.get('entityTypes')">
+            </tb-entity-type-list>
+          </div>
           <button mat-icon-button color="primary"
                   type="button"
                   (click)="removeFilter($index)"
@@ -47,7 +40,6 @@
                   matTooltipPosition="above">
             <mat-icon>close</mat-icon>
           </button>
-        </div>
       </div>
     </div>
   </div>
@@ -56,14 +48,13 @@
               class="tb-prompt" translate>relation.any-relation</span>
   </div>
   <div>
-    <button mat-raised-button color="primary"
+    <button mat-stroked-button color="primary"
             [disabled]="isLoading$ | async"
             (click)="addFilter()"
             type="button"
             matTooltip="{{ 'relation.add-relation-filter' | translate }}"
             matTooltipPosition="above">
-      <mat-icon>add</mat-icon>
-      {{ 'action.add' | translate }}
+      {{ 'relation.add-relation-filter' | translate }}
     </button>
   </div>
 </div>
diff --git a/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.scss b/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.scss
index b18f226f4f..d2bb8191c1 100644
--- a/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.scss
+++ b/ui-ngx/src/app/modules/home/components/relation/relation-filters.component.scss
@@ -22,26 +22,40 @@
       width: 100%;
     }
 
-    .header {
-      padding: 0 5px 5px;
-
-      .cell {
-        padding-right: 5px;
-        padding-left: 5px;
-        font-size: 12px;
-        font-weight: 700;
-        color: rgba(0, 0, 0, .54);
-        white-space: nowrap;
-      }
+    .map-label {
+      font-weight: 400;
+      font-size: 12px;
     }
 
+
+    //.header {
+    //  padding: 0 5px 5px;
+    //
+    //  .cell {
+    //    padding-right: 5px;
+    //    padding-left: 5px;
+    //    font-size: 12px;
+    //    font-weight: 700;
+    //    color: rgba(0, 0, 0, .54);
+    //    white-space: nowrap;
+    //  }
+    //}
+
     .body {
-      padding: 0 5px 20px;
+      //padding: 0 5px 20px;
       max-height: 300px;
       overflow: auto;
 
       .row {
         padding-top: 5px;
+
+        .input-block {
+          border: 1px solid #E0E0E0;
+          border-radius: 6px;
+          padding: 24px 24px 2px 24px;
+          align-items: center;
+          margin: 0px 8px 15px 0px;
+        }
       }
 
       .cell {
diff --git a/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.html b/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.html
index 7d45b5a071..909d780e45 100644
--- a/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.html
+++ b/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.html
@@ -15,7 +15,8 @@
     limitations under the License.
 
 -->
-<mat-form-field [formGroup]="entitySubtypeListFormGroup" class="mat-block tb-chip-list">
+<mat-form-field [formGroup]="entitySubtypeListFormGroup" class="mat-block">
+  <mat-label *ngIf="label">{{ label | translate }}</mat-label>
   <mat-chip-grid #chipList formControlName="entitySubtypeList">
     <mat-chip-row
       *ngFor="let entitySubtype of entitySubtypeList"
@@ -37,6 +38,14 @@
            [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
            (matChipInputTokenEnd)="chipAdd($event)">
   </mat-chip-grid>
+  <button *ngIf="entitySubtypeListFormGroup.get('entitySubtypeList').value?.length > 1"
+          type="button"
+          style="margin-right: 3px"
+          matTooltip="{{'entity.clear-selected-profiles' | translate}}"
+          matSuffix mat-icon-button
+          (click)="clearChipGrid()">
+    <mat-icon color="primary" class="material-icons">close</mat-icon>
+  </button>
   <mat-autocomplete #entitySubtypeAutocomplete="matAutocomplete"
                     class="tb-autocomplete"
                     (optionSelected)="selected($event)"
diff --git a/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.ts b/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.ts
index b4ac3145ba..1442b44cfd 100644
--- a/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.ts
+++ b/ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.ts
@@ -54,6 +54,9 @@ export class EntitySubTypeListComponent implements ControlValueAccessor, OnInit,
   get required(): boolean {
     return this.requiredValue;
   }
+
+  @Input() label: string;
+
   @Input()
   set required(value: boolean) {
     const newVal = coerceBooleanProperty(value);
@@ -223,6 +226,12 @@ export class EntitySubTypeListComponent implements ControlValueAccessor, OnInit,
     this.clear('');
   }
 
+  clearChipGrid() {
+    this.entitySubtypeList = [];
+    this.modelValue = null;
+    this.entitySubtypeListFormGroup.get('entitySubtypeList').patchValue([], {emitEvent: true});
+  }
+
   remove(entitySubtype: string) {
     const index = this.entitySubtypeList.indexOf(entitySubtype);
     if (index >= 0) {
@@ -249,9 +258,7 @@ export class EntitySubTypeListComponent implements ControlValueAccessor, OnInit,
     this.searchText = searchText;
     return this.getEntitySubtypes().pipe(
       map(subTypes => {
-        let result = subTypes.filter( subType => {
-          return searchText ? subType.toUpperCase().startsWith(searchText.toUpperCase()) : true;
-        });
+        let result = subTypes.filter( subType => searchText ? subType.toUpperCase().startsWith(searchText.toUpperCase()) : true);
         if (!result.length) {
           result = [searchText];
         }
diff --git a/ui-ngx/src/app/shared/components/entity/entity-type-list.component.html b/ui-ngx/src/app/shared/components/entity/entity-type-list.component.html
index 7a20291a0a..6852f7f62d 100644
--- a/ui-ngx/src/app/shared/components/entity/entity-type-list.component.html
+++ b/ui-ngx/src/app/shared/components/entity/entity-type-list.component.html
@@ -15,7 +15,8 @@
     limitations under the License.
 
 -->
-<mat-form-field [formGroup]="entityTypeListFormGroup" class="mat-block tb-chip-list" subscriptSizing="{{ subscriptSizing }}">
+<mat-form-field [formGroup]="entityTypeListFormGroup" class="mat-block" floatLabel="always" subscriptSizing="{{ subscriptSizing }}">
+  <mat-label>{{ 'entity.entity-types' | translate }}</mat-label>
   <mat-chip-grid #chipList formControlName="entityTypeList">
     <mat-chip-row
       *ngFor="let entityType of entityTypeList"
diff --git a/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.html b/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.html
index 5deea9e262..0d17daf105 100644
--- a/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.html
+++ b/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.html
@@ -15,8 +15,8 @@
     limitations under the License.
 
 -->
-<mat-form-field [formGroup]="relationTypeFormGroup" class="mat-block" subscriptSizing="{{ subscriptSizing }}">
-  <mat-label *ngIf="required">{{ 'relation.relation-type' | translate }}</mat-label>
+<mat-form-field [formGroup]="relationTypeFormGroup" floatLabel="always" class="mat-block" subscriptSizing="{{ subscriptSizing }}">
+  <mat-label *ngIf="label" required="required">{{ label | translate }}</mat-label>
   <input matInput type="text"
          #relationTypeInput
          formControlName="relationType"
@@ -25,7 +25,9 @@
          [required]="required"
          [matAutocomplete]="relationTypeAutocomplete">
   <button *ngIf="relationTypeFormGroup.get('relationType').value && !disabled"
-          type="button"
+          type="button" color="primary"
+          style="margin-right: 3px;"
+          matTooltip="{{ 'relation.clear-relation-type' | translate}}"
           matSuffix mat-icon-button aria-label="Clear"
           (click)="clear()">
     <mat-icon class="material-icons">close</mat-icon>
diff --git a/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.ts b/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.ts
index 6f911b7ab6..5f5be4eee6 100644
--- a/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.ts
+++ b/ui-ngx/src/app/shared/components/relation/relation-type-autocomplete.component.ts
@@ -46,6 +46,9 @@ export class RelationTypeAutocompleteComponent implements ControlValueAccessor,
   get required(): boolean {
     return this.requiredValue;
   }
+
+  @Input() label: string;
+
   @Input()
   set required(value: boolean) {
     this.requiredValue = coerceBooleanProperty(value);
diff --git a/ui-ngx/src/assets/help/en_US/rulenode/customer_attributes_node_fn.md b/ui-ngx/src/assets/help/en_US/rulenode/customer_attributes_node_fn.md
new file mode 100644
index 0000000000..64647885e4
--- /dev/null
+++ b/ui-ngx/src/assets/help/en_US/rulenode/customer_attributes_node_fn.md
@@ -0,0 +1,24 @@
+#### Name of popup
+
+<div class="divider"></div>
+<br/>
+
+*function Filter(msg, metadata, msgType): boolean
+
+<a href="https://github.com/thingsboard/thingsboard/blob/ea039008b148453dfa166cf92bc40b26e487e660/ui-ngx/src/app/shared/models/rule-node.models.ts#L338" target="_blank">TBEL</a>function defines a boolean expression based on the incoming Message and Metadata.
+
+**Parameters:**
+
+<ul>
+  <li><b>msg:</b> <code>{[key: string]: any}</code> - is a Message payload key/value object.
+  </li>
+  <li><b>metadata:</b> <code>{[key: string]: string}</code> - is a Message metadata key/value map, where both keys and values are strings.
+  </li>
+  <li><b>msgType:</b> <code>string</code> - is a string containing Message type. See MessageType enum for common used values.
+  </li>
+</ul>
+
+Enable 'debug mode' for your rule node to see the messages that arrive in near real-time. See Debugging for more information.
+
+**Parameters:**
+Must return a boolean value. If true - routes Message to subsequent rule nodes that are related via True link, otherwise sends Message to rule nodes related via False link. Uses 'Failure' link in case of any failures to evaluate the expression.
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 8d522acf3e..f863761295 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -1922,6 +1922,7 @@
         "device-name-starts-with": "Devices whose names start with '{{prefix}}'",
         "type-device-profile": "Device profile",
         "type-device-profiles": "Device profiles",
+        "clear-selected-profiles": "Clear selected profiles",
         "list-of-device-profiles": "{ count, plural, =1 {One device profile} other {List of # device profiles} }",
         "device-profile-name-starts-with": "Device profiles whose names start with '{{prefix}}'",
         "type-asset-profile": "Asset profile",
@@ -3107,6 +3108,7 @@
     "relation": {
         "relations": "Relations",
         "direction": "Direction",
+        "clear-relation-type": "Clear relation type",
         "search-direction": {
             "FROM": "From",
             "TO": "To"