[Unified search] Fix the bug with the default value on numeric field filters (#149028)

## Summary

Closes https://github.com/elastic/kibana/issues/149020

I created this bad ux with https://github.com/elastic/kibana/pull/148802

When you try to add a negative value to a numeric field filter, is not
easily applied.

I changed the behavior, so now the 0 is not automatically added on the
operator selection, the user can still add a filter without a required
value and I fixed the preview.
<img width="970" alt="image"
src="https://user-images.githubusercontent.com/17003240/212900946-d397eba8-debb-45a5-8d11-d9b515a989c6.png">
This commit is contained in:
Stratoula Kalafateli 2023-01-18 09:03:13 +02:00 committed by GitHub
parent de865e90ba
commit eb8aab093a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 37 additions and 6 deletions

View file

@ -127,7 +127,7 @@ describe('updateFilter', () => {
meta: {
alias: '',
index: 'index1',
params: { query: 0 },
params: { query: undefined },
key: 'test-field',
negate: true,
type: 'phrase',

View file

@ -79,7 +79,7 @@ function updateWithIsOperator(
...filter.meta,
negate: operator?.negate,
type: operator?.type,
params: { ...filter.meta.params, query: safeParams },
params: { ...filter.meta.params, query: params },
value: undefined,
},
query: { match_phrase: { [filter.meta.key!]: safeParams ?? '' } },

View file

@ -36,6 +36,33 @@ describe('getDisplayValueFromFilter', () => {
expect(displayValue).toBe('');
});
it('returns 0 if value undefined and numeric field', () => {
const filter = {
meta: {
negate: false,
index: 'logstash-*',
type: 'phrase',
key: 'bytes',
value: undefined,
disabled: false,
alias: null,
params: {
query: undefined,
},
},
$state: {
store: FilterStateStore.APP_STATE,
},
query: {
match_phrase: {
bytes: '0',
},
},
};
const displayValue = getDisplayValueFromFilter(filter, [stubIndexPattern]);
expect(displayValue).toBe('0');
});
it('phrase filters without formatter', () => {
jest.spyOn(stubIndexPattern, 'getFormatterForField').mockImplementation(() => undefined!);
const displayValue = getDisplayValueFromFilter(phraseFilter, [stubIndexPattern]);

View file

@ -61,10 +61,12 @@ export function getFieldDisplayValueFromFilter(
export function getDisplayValueFromFilter(filter: Filter, indexPatterns: DataViewBase[]): string {
const indexPattern = getIndexPatternFromFilter(filter, indexPatterns);
const fieldName = getFilterField(filter);
const field = indexPattern?.fields.find((f) => f.name === fieldName);
const fieldType = field?.type;
const valueFormatter = getValueFormatter(indexPattern, fieldName);
if (isPhraseFilter(filter) || isScriptedPhraseFilter(filter)) {
return getPhraseDisplayValue(filter, valueFormatter);
return getPhraseDisplayValue(filter, valueFormatter, fieldType);
} else if (isPhrasesFilter(filter)) {
return getPhrasesDisplayValue(filter, valueFormatter);
} else if (isRangeFilter(filter) || isScriptedRangeFilter(filter)) {

View file

@ -22,13 +22,15 @@ const getScriptedPhraseValue = (filter: PhraseFilter) =>
export function getPhraseDisplayValue(
filter: PhraseFilter | ScriptedPhraseFilter,
formatter?: FieldFormat
formatter?: FieldFormat,
fieldType?: string
): string {
const value = filter.meta.value ?? filter.meta.params.query;
const updatedValue = fieldType === 'number' && !value ? 0 : value;
if (formatter?.convert) {
return formatter.convert(value);
return formatter.convert(updatedValue);
}
return value === undefined ? '' : `${value}`;
return updatedValue === undefined ? '' : `${updatedValue}`;
}
const getParams = (filter: PhraseFilter) => {