From 2093da73e1ba8264f2fecfd41de6a9e7a342abc9 Mon Sep 17 00:00:00 2001
From: Viacheslav Klimov <viacheslavklimov11@gmail.com>
Date: Tue, 24 Mar 2026 12:21:35 +0200
Subject: [PATCH] Fix filter preview reactivity and keyFiltersOperation change
 detection
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- FilterTextComponent: implement OnChanges to re-render preview text
  when the operation input changes (AND→OR or OR→AND)
- isFilterEqual: include keyFiltersOperation in comparison so changing
  only the operation triggers widget subscription refresh
---
 .../home/components/filter/filter-text.component.ts  | 12 ++++++++++--
 ui-ngx/src/app/shared/models/query/query.models.ts   |  3 ++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/filter/filter-text.component.ts b/ui-ngx/src/app/modules/home/components/filter/filter-text.component.ts
index 94ef717912..75713c77e3 100644
--- a/ui-ngx/src/app/modules/home/components/filter/filter-text.component.ts
+++ b/ui-ngx/src/app/modules/home/components/filter/filter-text.component.ts
@@ -14,7 +14,7 @@
 /// limitations under the License.
 ///
 
-import { Component, forwardRef, Input, OnInit } from '@angular/core';
+import { Component, forwardRef, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import { ControlValueAccessor, UntypedFormBuilder, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { ComplexOperation, KeyFilter, keyFiltersToText } from '@shared/models/query/query.models';
@@ -35,7 +35,7 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion';
     ],
     standalone: false
 })
-export class FilterTextComponent implements ControlValueAccessor, OnInit {
+export class FilterTextComponent implements ControlValueAccessor, OnInit, OnChanges {
 
   private requiredValue: boolean;
   get required(): boolean {
@@ -65,6 +65,7 @@ export class FilterTextComponent implements ControlValueAccessor, OnInit {
 
   public filterText: string;
 
+  private currentValue: Array<KeyFilter>;
   private propagateChange = (v: any) => { };
 
   constructor(private dialog: MatDialog,
@@ -83,11 +84,18 @@ export class FilterTextComponent implements ControlValueAccessor, OnInit {
   ngOnInit() {
   }
 
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes.operation && !changes.operation.firstChange) {
+      this.updateFilterText(this.currentValue);
+    }
+  }
+
   setDisabledState(isDisabled: boolean): void {
     this.disabled = isDisabled;
   }
 
   writeValue(value: Array<KeyFilter>): void {
+    this.currentValue = value;
     this.updateFilterText(value);
   }
 
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 6273fbd434..258f09a535 100644
--- a/ui-ngx/src/app/shared/models/query/query.models.ts
+++ b/ui-ngx/src/app/shared/models/query/query.models.ts
@@ -950,7 +950,8 @@ export const getFilterId = (filters: Filters, filterInfo: FilterInfo): string =>
 }
 
 const isFilterEqual = (filter1: FilterInfo, filter2: FilterInfo): boolean => {
-  return isEqual(filter1.keyFilters, filter2.keyFilters);
+  return isEqual(filter1.keyFilters, filter2.keyFilters) &&
+    filter1.keyFiltersOperation === filter2.keyFiltersOperation;
 }
 
 const createFilterName = (filters: Filters, filter: string): string => {