From 63e63203152220d1e19708d6777c4c17a2075311 Mon Sep 17 00:00:00 2001 From: ghiscoding Date: Tue, 11 Jun 2024 10:43:55 -0400 Subject: [PATCH] fix(filters): skipCompoundOperatorFilterWithNullInput skip undefined - review Compound Date & Compound Slider Filters to be more aligned with Compound Input Text Filter after PR #1566 --- packages/common/src/filters/dateFilter.ts | 6 +++++- packages/common/src/filters/sliderFilter.ts | 8 ++++++-- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/packages/common/src/filters/dateFilter.ts b/packages/common/src/filters/dateFilter.ts index 7dc62ff52..d4fa5f8b7 100644 --- a/packages/common/src/filters/dateFilter.ts +++ b/packages/common/src/filters/dateFilter.ts @@ -32,6 +32,7 @@ export class DateFilter implements Filter { protected _currentDateOrDates?: Date | Date[] | string | string[]; protected _currentDateStrings?: string[]; protected _lastClickIsDate = false; + protected _lastSearchValue?: string; protected _pickerOptions!: IOptions; protected _filterElm!: HTMLDivElement; protected _dateInputElm!: HTMLInputElement; @@ -496,7 +497,9 @@ export class DateFilter implements Filter { // when changing compound operator, we don't want to trigger the filter callback unless the date input is also provided const skipNullInput = this.columnFilter.skipCompoundOperatorFilterWithNullInput ?? this.gridOptions.skipCompoundOperatorFilterWithNullInput ?? this.gridOptions.skipCompoundOperatorFilterWithNullInput === undefined; - if (!skipNullInput || (skipNullInput && isDefined(this._currentDateOrDates))) { + const hasSkipNullValChanged = (skipNullInput && isDefined(this._currentDateOrDates)) || (this._currentDateOrDates === '' && isDefined(this._lastSearchValue)); + + if (!skipNullInput || !skipNullInput || hasSkipNullValChanged) { this.callback(e, { columnDef: this.columnDef, searchTerms: (this._currentValue ? [this._currentValue] : null), operator: selectedOperator || '', shouldTriggerQuery: this._shouldTriggerQuery }); } } @@ -505,5 +508,6 @@ export class DateFilter implements Filter { // reset both flags for next use this._clearFilterTriggered = false; this._shouldTriggerQuery = true; + this._lastSearchValue = this._currentValue; } } diff --git a/packages/common/src/filters/sliderFilter.ts b/packages/common/src/filters/sliderFilter.ts index 3ac131f54..db3334238 100644 --- a/packages/common/src/filters/sliderFilter.ts +++ b/packages/common/src/filters/sliderFilter.ts @@ -31,6 +31,7 @@ export class SliderFilter implements Filter { protected _clearFilterTriggered = false; protected _currentValue?: number; protected _currentValues?: number[]; + protected _lastSearchValue?: number | string; protected _shouldTriggerQuery = true; protected _sliderOptions!: CurrentSliderOption; protected _operator?: OperatorType | OperatorString; @@ -415,8 +416,10 @@ export class SliderFilter implements Filter { value === '' ? this._filterElm.classList.remove('filled') : this._filterElm.classList.add('filled'); // when changing compound operator, we don't want to trigger the filter callback unless the filter input is also provided - const skipCompoundOperatorFilterWithNullInput = this.columnFilter.skipCompoundOperatorFilterWithNullInput ?? this.gridOptions.skipCompoundOperatorFilterWithNullInput; - if (this.sliderType !== 'compound' || (!skipCompoundOperatorFilterWithNullInput || this._currentValue !== undefined)) { + const skipNullInput = this.columnFilter.skipCompoundOperatorFilterWithNullInput ?? this.gridOptions.skipCompoundOperatorFilterWithNullInput; + const hasSkipNullValChanged = (skipNullInput && isDefined(this._currentValue)) || (!isDefined(this._currentValue) && isDefined(this._lastSearchValue)); + + if (this.sliderType !== 'compound' || !skipNullInput || hasSkipNullValChanged) { this.callback(e, { columnDef: this.columnDef, operator: selectedOperator || '', searchTerms: searchTerms! as SearchTerm[], shouldTriggerQuery: this._shouldTriggerQuery }); } } @@ -428,6 +431,7 @@ export class SliderFilter implements Filter { // trigger mouse enter event on the filter for optionally hooked SlickCustomTooltip // the minimum requirements for tooltip to work are the columnDef and targetElement this.grid.onHeaderRowMouseEnter.notify({ column: this.columnDef, grid: this.grid }, new SlickEventData(e)); + this._lastSearchValue = value; } protected changeBothSliderFocuses(isAddingFocus: boolean): void {