fix(ui) Fix query tab filter dropdowns showing raw urns (#5230) (#13132)

This commit is contained in:
Chris Collins 2025-04-09 16:12:32 -04:00 committed by GitHub
parent 9f0c0aa3dd
commit ac6bca7f61
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 42 additions and 7 deletions

View File

@ -21,8 +21,10 @@ import {
canCreateViewFromFilters,
isAnyOptionSelected,
getStructuredPropFilterDisplayName,
getFilterDisplayName,
} from '../utils';
import { ENTITY_SUB_TYPE_FILTER_NAME } from '../../utils/constants';
import { FieldType, FilterField } from '../types';
describe('filter utils - getNewFilters', () => {
it('should get the correct list of filters when adding filters where the filter field did not already exist', () => {
@ -467,3 +469,23 @@ describe('filter utils - getStructuredPropFilterDisplayName', () => {
).toBe('test value for a rich text situation right here!');
});
});
describe('filter utils - getFilterDisplayName', () => {
it('should return the displayName for an option if it exists', () => {
const option = { value: 'testValue', displayName: 'test name' };
const field: FilterField = { type: FieldType.ENUM, field: 'test', displayName: 'test' };
expect(getFilterDisplayName(option, field)).toBe('test name');
});
it('should return undefined if no display name and field is not a structured property filter', () => {
const option = { value: 'testValue' };
const field: FilterField = { type: FieldType.ENUM, field: 'structuredProperties.test', displayName: 'test' };
expect(getFilterDisplayName(option, field)).toBe('testValue');
});
it('should return the structured property value properly if this is a structured property filter (structured prop value is tested above)', () => {
const option = { value: 'testValue' };
const field: FilterField = { type: FieldType.ENUM, field: 'test', displayName: 'test' };
expect(getFilterDisplayName(option, field)).toBe(undefined);
});
});

View File

@ -52,7 +52,14 @@ import { EntityRegistry } from '../../../entityRegistryContext';
import { ANTD_GRAY } from '../../entity/shared/constants';
import { GetAutoCompleteMultipleResultsQuery } from '../../../graphql/search.generated';
import { FACETS_TO_ENTITY_TYPES } from './constants';
import { FieldType, FilterField, FilterOperatorType, FilterOptionType, FilterPredicate } from './types';
import {
FieldType,
FilterField,
FilterOperatorType,
FilterOptionType,
FilterPredicate,
FilterValueOption,
} from './types';
import { capitalizeFirstLetterOnly, forcePluralize, pluralizeIfIrregular } from '../../shared/textUtil';
import { convertBackendToFrontendOperatorType } from './operator/operator';
import { ALL_FILTER_FIELDS, STRUCTURED_PROPERTY_FILTER } from './field/fields';
@ -672,3 +679,13 @@ export function getIsDateRangeFilter(field: FilterField | FacetMetadata) {
}
return false;
}
export function getFilterDisplayName(option: FilterValueOption, field: FilterField) {
if (option.displayName) {
return option.displayName;
}
return field.field.startsWith(STRUCTURED_PROPERTIES_FILTER_NAME)
? getStructuredPropFilterDisplayName(field.field, option.value)
: undefined;
}

View File

@ -5,8 +5,7 @@ import { useEntityRegistry } from '../../../useEntityRegistry';
import OptionsDropdownMenu from '../OptionsDropdownMenu';
import { deduplicateOptions, useFilterOptionsBySearchQuery, useLoadAggregationOptions } from './utils';
import { OptionMenu } from './styledComponents';
import { getStructuredPropFilterDisplayName, useFilterDisplayName } from '../utils';
import { STRUCTURED_PROPERTIES_FILTER_NAME } from '../../utils/constants';
import { getFilterDisplayName, useFilterDisplayName } from '../utils';
interface Props {
field: FilterField;
@ -52,10 +51,7 @@ export default function EnumValueMenu({
value: option.value,
count: option.count,
entity: option.entity,
displayName:
option.displayName || field.field.startsWith(STRUCTURED_PROPERTIES_FILTER_NAME)
? getStructuredPropFilterDisplayName(field.field, option.value)
: undefined,
displayName: getFilterDisplayName(option, field),
},
entityRegistry,
selectedFilterOptions: values.map((value) => {