diff --git a/.changeset/hip-eyes-mate.md b/.changeset/hip-eyes-mate.md
new file mode 100644
index 0000000000..3527193d0b
--- /dev/null
+++ b/.changeset/hip-eyes-mate.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog-react': patch
+---
+
+fixed bug in `UserListPicker` by getting the `kindParamater` from the `filters` rather than from the `queryParameters`
diff --git a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx
index 2e3ddff882..5f629bda13 100644
--- a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx
+++ b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx
@@ -45,6 +45,8 @@ import {
} from '@backstage/core-plugin-api';
import { MockStarredEntitiesApi, starredEntitiesApiRef } from '../../apis';
import { DefaultEntityFilters } from '../../hooks';
+import { NewEntityListContext } from '../../hooks/useEntityListProvider';
+import { createVersionedValueMap } from '@backstage/version-bridge';
const mockUser: UserEntity = {
apiVersion: 'backstage.io/v1alpha1',
@@ -694,4 +696,73 @@ describe('', () => {
});
});
});
+ describe('when initialFilter is not provided', () => {
+ it('updates filter options automatically when the kind changes', async () => {
+ let setFilters: (f: any) => void = () => {};
+
+ const TestProvider = ({ children }: { children?: React.ReactNode }) => {
+ const [filtersState, _setFiltersState] = require('react').useState({
+ kind: new EntityKindFilter('component', 'Component'),
+ } as any);
+ setFilters = _setFiltersState;
+
+ const updateFilters = (update: any) =>
+ _setFiltersState((prev: any) =>
+ typeof update === 'function' ? update(prev) : { ...prev, ...update },
+ );
+
+ const value = {
+ entities: [],
+ backendEntities: [],
+ updateFilters,
+ filters: filtersState,
+ loading: false,
+ queryParameters: {},
+ error: undefined,
+ totalItems: 0,
+ limit: 20,
+ offset: 0,
+ setLimit: () => {},
+ setOffset: () => {},
+ paginationMode: 'none',
+ } as any;
+
+ return (
+
+ {children}
+
+ );
+ };
+
+ await renderInTestApp(
+
+
+
+
+ ,
+ );
+
+ await waitFor(() =>
+ expect(mockIdentityApi.getBackstageIdentity).toHaveBeenCalled(),
+ );
+
+ await waitFor(() =>
+ expect(
+ screen.getAllByRole('menuitem').map(({ textContent }) => textContent),
+ ).toEqual(['Owned 3', 'Starred 2', 'All 10']),
+ );
+
+ require('react').act(() =>
+ setFilters({ kind: new EntityKindFilter('user', 'User') } as any),
+ );
+
+ await waitFor(() =>
+ expect(
+ screen.getAllByRole('menuitem').map(({ textContent }) => textContent),
+ ).toEqual(['Starred 2', 'All 10']),
+ );
+ });
+ });
});
diff --git a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx
index dc4173fd5f..245f82122c 100644
--- a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx
+++ b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx
@@ -138,8 +138,9 @@ export const UserListPicker = (props: UserListPickerProps) => {
const {
filters,
updateFilters,
- queryParameters: { kind: kindParameter, user: userParameter },
+ queryParameters: { user: userParameter },
} = useEntityList();
+ const kindParameter = filters.kind?.value?.toLowerCase();
// Remove group items that aren't in availableFilters and exclude
// any now-empty groups.