- <div class="i-sdc-designer-sidebar-section-content-item-rule" [ngClass]="{'hand': !readonly}"
- *ngFor="let constraint of constraintObjects; let i = index">
- <div class="rule-details" [ngClass]="{'readonly': readonly}">
- <div class="rule-desc" (click)="!readonly && onSelectRule(i)" tooltips
- tooltip="{{constraint.servicePropertyName + ' ' + getSymbol(constraint.constraintOperator) + ' '
- + (constraint.sourceName ? constraint.sourceName + ':' : '') + constraint.value}}">
- {{constraint.servicePropertyName + ' ' + getSymbol(constraint.constraintOperator) + ' '
- + (constraint.sourceName ? constraint.sourceName + ':' : '') + constraint.value}}
+ <div class="i-sdc-designer-sidebar-section-content-node-filter"
+ [ngClass]="{'hand': !readonly}"
+ *ngFor="let capability of constraintCapabilities; let i = index">
+ <div class="filter-details" [ngClass]="{'readonly': readonly}">
+ <div class="filter-desc" (click)="!readonly && onSelectNodeFilter(capabilities, i)"
+ tooltips
+ tooltip="{{capability.servicePropertyName + ' ' + getSymbol(capability.constraintOperator) + ' '
+ + (capability.sourceName ? capability.sourceName + ':' : '') + capability.value}}">
+ {{capability.servicePropertyName + ' ' + getSymbol(capability.constraintOperator)
+ + ' '
+ + (capability.sourceName ? capability.sourceName + ':' : '') + capability.value}}
+ </div>
+ <span *ngIf="!readonly" class="sprite-new delete-btn delete-icon"
+ (click)="openDeleteModal(capabilities, i)"
+ data-tests-id="delete-input-button"></span>
+ </div>
+ </div>
+
+ <div class="w-sdc-designer-sidebar-section-node-filter-footer">
+ <button
+ class="w-sdc-designer-sidebar-section-node-filter-footer-action add-rule-btn tlv-btn blue"
+ data-tests-id="add-rule-button"
+ (click)="onAddNodeFilter(capabilities)"
+ [disabled]="readonly">
+ {{'DIRECTIVES_AND_NODE_FILTER_ADD_NODE_FILTER' | translate}}
+ </button>
+ </div>