diff --git a/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.test.tsx b/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.test.tsx index 9fa8e6e097..7397c3ee1e 100644 --- a/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.test.tsx @@ -140,7 +140,7 @@ describe('', () => { ); expect(updateFilters).toHaveBeenLastCalledWith({ - kind: new EntityKindFilter('group', 'Group'), + kind: new EntityKindFilter('group', 'group'), }); }); diff --git a/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.tsx b/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.tsx index 534b8d03b3..c0565851b0 100644 --- a/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.tsx +++ b/plugins/catalog-react/src/components/EntityKindPicker/EntityKindPicker.tsx @@ -17,7 +17,7 @@ import { Select } from '@backstage/core-components'; import { alertApiRef, useApi } from '@backstage/core-plugin-api'; import Box from '@material-ui/core/Box'; -import { useEffect, useMemo, useState } from 'react'; +import { useEffect, useMemo, useRef, useState } from 'react'; import { EntityKindFilter } from '../../filters'; import { useEntityList } from '../../hooks'; import { filterKinds, useAllKinds } from './kindFilterUtils'; @@ -65,13 +65,16 @@ function useEntityKindFilter(opts: { initialFilter: string }): { const { allKinds, loading, error } = useAllKinds(); const selectedKindLabel = allKinds.get(selectedKind) || selectedKind; + const kindLabelRef = useRef(selectedKindLabel); + kindLabelRef.current = selectedKindLabel; + useEffect(() => { updateFilters({ kind: selectedKind - ? new EntityKindFilter(selectedKind, selectedKindLabel) + ? new EntityKindFilter(selectedKind, kindLabelRef.current) : undefined, }); - }, [selectedKind, selectedKindLabel, updateFilters]); + }, [selectedKind, updateFilters]); return { loading,