mirror of
https://github.com/open-metadata/OpenMetadata.git
synced 2025-08-27 18:36:08 +00:00
fix(ui): search dropdown options case changing issue (#9745)
* fixed search dropdown options not showing the original suggestion options * added unit tests for getSearchLabel util function
This commit is contained in:
parent
35b328a5f7
commit
001e567bb3
@ -14,9 +14,12 @@
|
||||
import { SearchDropdownOption } from 'components/SearchDropdown/SearchDropdown.interface';
|
||||
import {
|
||||
getSearchDropdownLabels,
|
||||
getSearchLabel,
|
||||
getSelectedOptionLabelString,
|
||||
} from './AdvancedSearchUtils';
|
||||
import {
|
||||
highlightedItemLabel,
|
||||
mockItemLabel,
|
||||
mockLongOptionsArray,
|
||||
mockOptionsArray,
|
||||
mockShortOptionsArray,
|
||||
@ -70,4 +73,22 @@ describe('AdvancedSearchUtils tests', () => {
|
||||
|
||||
expect(resultOptionsString).toBe('');
|
||||
});
|
||||
|
||||
it('Function getSearchLabel should return string with highlighted substring for matched searchKey', () => {
|
||||
const resultSearchLabel = getSearchLabel(mockItemLabel, 'wa');
|
||||
|
||||
expect(resultSearchLabel).toBe(highlightedItemLabel);
|
||||
});
|
||||
|
||||
it('Function getSearchLabel should return original string if searchKey is not matched', () => {
|
||||
const resultSearchLabel = getSearchLabel(mockItemLabel, 'wo');
|
||||
|
||||
expect(resultSearchLabel).toBe(mockItemLabel);
|
||||
});
|
||||
|
||||
it('Function getSearchLabel should return original string if searchKey is passed as an empty string', () => {
|
||||
const resultSearchLabel = getSearchLabel(mockItemLabel, '');
|
||||
|
||||
expect(resultSearchLabel).toBe(mockItemLabel);
|
||||
});
|
||||
});
|
||||
|
@ -143,11 +143,15 @@ export const renderAdvanceSearchButtons: RenderSettings['renderButton'] = (
|
||||
return <></>;
|
||||
};
|
||||
|
||||
const getSearchLabel = (itemLabel: string, searchKey: string) => {
|
||||
export const getSearchLabel = (itemLabel: string, searchKey: string) => {
|
||||
const regex = new RegExp(searchKey, 'gi');
|
||||
const result = itemLabel.replace(regex, `<mark>${searchKey}</mark>`);
|
||||
if (searchKey) {
|
||||
const result = itemLabel.replace(regex, (match) => `<mark>${match}</mark>`);
|
||||
|
||||
return result;
|
||||
return result;
|
||||
} else {
|
||||
return itemLabel;
|
||||
}
|
||||
};
|
||||
|
||||
export const getSearchDropdownLabels = (
|
||||
|
@ -29,3 +29,8 @@ export const mockLongOptionsArray = [
|
||||
{ key: 'string3', label: 'string3' },
|
||||
{ key: 'string4', label: 'string4' },
|
||||
];
|
||||
|
||||
export const mockItemLabel = 'Aaron Warren and Aaron Warner';
|
||||
|
||||
export const highlightedItemLabel =
|
||||
'Aaron <mark>Wa</mark>rren and Aaron <mark>Wa</mark>rner';
|
||||
|
Loading…
x
Reference in New Issue
Block a user