From 50582c17838d375d82a9faeea4760b1b110fbbcb Mon Sep 17 00:00:00 2001 From: coltMcKissick Date: Thu, 13 Nov 2025 11:53:15 -0500 Subject: [PATCH 1/6] fix: update owner picker to use lower case before filtering dropdown Signed-off-by: coltMcKissick --- .../src/components/EntityOwnerPicker/EntityOwnerPicker.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx index 247a3784f4..cbfd20ad3e 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx @@ -221,7 +221,7 @@ export const EntityOwnerPicker = (props?: EntityOwnerPickerProps) => { }} name="owner-picker" onInputChange={(_e, inputValue) => { - setText(inputValue); + setText(inputValue.toLocaleLowerCase('en-US')); }} ListboxProps={{ onScroll: (e: MouseEvent) => { From 0f345fdb683b7db51947d41adcdc6ca6314abf2d Mon Sep 17 00:00:00 2001 From: coltMcKissick Date: Thu, 13 Nov 2025 16:32:54 -0500 Subject: [PATCH 2/6] test: added unit test to verify input populated drop down Signed-off-by: coltMcKissick --- .../EntityOwnerPicker.test.tsx | 33 +++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx index b8c8e58d32..e89a3bcadd 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx @@ -362,6 +362,39 @@ describe('', () => { owners: new EntityOwnerFilter(['group:default/team-b']), }); }); + + it('calls fetch with lowercased input and displays results', async () => { + const updateFilters = jest.fn(); + await renderInTestApp( + + + + + , + ); + + expect(mockCatalogApi.getEntitiesByRefs).not.toHaveBeenCalled(); + expect(updateFilters).toHaveBeenLastCalledWith({ + owners: undefined, + }); + + fireEvent.click(screen.getByTestId('owner-picker-expand')); + const input = screen.getByRole('textbox', { name: 'Owner' }); + fireEvent.change(input, { target: { value: 'Some-Owner' } }); + + await waitFor(() => + expect(screen.getByText('some-owner')).toBeInTheDocument(), + ); + + fireEvent.click(screen.getByText('some-owner')); + expect(updateFilters).toHaveBeenLastCalledWith({ + owners: new EntityOwnerFilter(['group:default/some-owner']), + }); + }); }); describe('', () => { From 6d39141b50ca5bc2f6680f8751973dd42332cb57 Mon Sep 17 00:00:00 2001 From: coltMcKissick Date: Thu, 13 Nov 2025 16:47:48 -0500 Subject: [PATCH 3/6] chore: add changeset Signed-off-by: coltMcKissick --- .changeset/great-files-shave.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/great-files-shave.md diff --git a/.changeset/great-files-shave.md b/.changeset/great-files-shave.md new file mode 100644 index 0000000000..8383f84cac --- /dev/null +++ b/.changeset/great-files-shave.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +Updated the entity owner picker to convert text to lower case before filtering owner options From 00fa8dee6678c7d43dc530b5b7c82310a69b07a1 Mon Sep 17 00:00:00 2001 From: coltMcKissick Date: Fri, 14 Nov 2025 15:01:34 -0500 Subject: [PATCH 4/6] fix: set lowercase when passing to handle fetch, update unit test Signed-off-by: coltMcKissick --- .../EntityOwnerPicker.test.tsx | 42 ++++++++++++++++++- .../EntityOwnerPicker/EntityOwnerPicker.tsx | 8 +++- 2 files changed, 46 insertions(+), 4 deletions(-) diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx index e89a3bcadd..e49d54b485 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx @@ -365,6 +365,37 @@ describe('', () => { it('calls fetch with lowercased input and displays results', async () => { const updateFilters = jest.fn(); + const someOwnerEntities: Entity[] = [ + { + apiVersion: '1', + kind: 'Group', + metadata: { + name: 'some-owner', + }, + }, + { + apiVersion: '1', + kind: 'Group', + metadata: { + name: 'some-owner-2', + }, + spec: { + profile: { + displayName: 'Some Owner 2', + }, + }, + }, + ]; + mockCatalogApi.queryEntities.mockImplementation(async _request => { + const totalItems = 2; + return { + items: someOwnerEntities, + pageInfo: { + nextCursor: '', + }, + totalItems, + }; + }); await renderInTestApp( ', () => { owners: undefined, }); - fireEvent.click(screen.getByTestId('owner-picker-expand')); - const input = screen.getByRole('textbox', { name: 'Owner' }); + // fireEvent.click(screen.getByTestId('owner-picker-expand')); + const input = screen.getByRole('textbox'); fireEvent.change(input, { target: { value: 'Some-Owner' } }); await waitFor(() => expect(screen.getByText('some-owner')).toBeInTheDocument(), ); + expect(mockCatalogApi.queryEntities).toHaveBeenLastCalledWith( + expect.objectContaining({ + fullTextFilter: expect.objectContaining({ + term: 'some-owner', + }), + }), + ); fireEvent.click(screen.getByText('some-owner')); expect(updateFilters).toHaveBeenLastCalledWith({ diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx index cbfd20ad3e..ed200c77c4 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx @@ -146,7 +146,11 @@ export const EntityOwnerPicker = (props?: EntityOwnerPickerProps) => { mode, initialSelectedOwnersRefs: selectedOwners, }); - useDebouncedEffect(() => handleFetch({ text }), [text, handleFetch], 250); + useDebouncedEffect( + () => handleFetch({ text: text.toLocaleLowerCase('en-US') }), + [text, handleFetch], + 250, + ); const availableOwners = value?.items || []; @@ -221,7 +225,7 @@ export const EntityOwnerPicker = (props?: EntityOwnerPickerProps) => { }} name="owner-picker" onInputChange={(_e, inputValue) => { - setText(inputValue.toLocaleLowerCase('en-US')); + setText(inputValue); }} ListboxProps={{ onScroll: (e: MouseEvent) => { From 7ef8c8a7d44f85a15ef1114f49ec82e6d2fb1462 Mon Sep 17 00:00:00 2001 From: Colt McKissick Date: Wed, 19 Nov 2025 19:30:49 -0500 Subject: [PATCH 5/6] Update .changeset/great-files-shave.md Co-authored-by: Vincenzo Scamporlino Signed-off-by: Colt McKissick --- .changeset/great-files-shave.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/great-files-shave.md b/.changeset/great-files-shave.md index 8383f84cac..271a8e8955 100644 --- a/.changeset/great-files-shave.md +++ b/.changeset/great-files-shave.md @@ -2,4 +2,4 @@ '@backstage/plugin-catalog-react': patch --- -Updated the entity owner picker to convert text to lower case before filtering owner options +Fixed an issue where `EntityOwnerPicker` failed to filter options when the input text contained uppercase characters. From 678a08aabfb82d75fcc12a0618e0651169884847 Mon Sep 17 00:00:00 2001 From: Colt McKissick Date: Thu, 20 Nov 2025 06:10:52 -0500 Subject: [PATCH 6/6] Remove commented code in EntityOwnerPicker.test.tsx Co-authored-by: Ben Lambert Signed-off-by: Colt McKissick --- .../src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx index e49d54b485..87c5c9a002 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx @@ -413,7 +413,6 @@ describe('', () => { owners: undefined, }); - // fireEvent.click(screen.getByTestId('owner-picker-expand')); const input = screen.getByRole('textbox'); fireEvent.change(input, { target: { value: 'Some-Owner' } });