IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

MultiCombobox: Fix labels disappearing on selected items when filtering (#100602)

Browse Source 
* Fix label disappearing on filtering

* Remove only from test

* Fix custom value test
This commit is contained in:
Tobias Skarhed 2025-02-13 15:03:54 +01:00 committed by GitHub
parent a58564a35e
commit afe8b08a48
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/grafana-ui/src/components/Combobox/MultiCombobox.test.tsx
View File

@ -156,8 +156,8 @@ describe('MultiCombobox', () => {
await user.type(input, 'D');
await user.keyboard('{arrowdown}{enter}');
expect(onChange).toHaveBeenCalledWith([
{ value: 'a' },
{ value: 'c' },
{ label: 'A', value: 'a' },
{ label: 'C', value: 'c' },
{ label: 'D', value: 'D', description: 'Use custom value' },
]);
});
@ -235,6 +235,19 @@ describe('MultiCombobox', () => {
await user.click(await screen.findByRole('option', { name: 'All' }));
expect(onChange).toHaveBeenCalledWith([]);
});
it('should keep label names on selected items when searching', async () => {
const options = [
{ label: 'A', value: 'a' },
{ label: 'B', value: 'b' },
{ label: 'C', value: 'c' },
];
render(<MultiCombobox width={200} options={options} value={['a']} onChange={jest.fn()} enableAllOption />);
const input = screen.getByRole('combobox');
await user.click(input);
await user.type(input, 'b');
expect(screen.getByText('A')).toBeInTheDocument();
});
});
describe('async', () => {

4
packages/grafana-ui/src/components/Combobox/MultiCombobox.tsx
View File

@ -79,8 +79,8 @@ export const MultiCombobox = <T extends string | number>(props: MultiComboboxPro
return [];
}
return getSelectedItemsFromValue<T>(value, baseOptions);
}, [value, baseOptions]);
return getSelectedItemsFromValue<T>(value, typeof props.options !== 'function' ? props.options : baseOptions);
}, [value, props.options, baseOptions]);
const { measureRef, counterMeasureRef, suffixMeasureRef, shownItems } = useMeasureMulti(
selectedItems,