diff --git a/.changeset/perfect-ducks-promise.md b/.changeset/perfect-ducks-promise.md new file mode 100644 index 0000000000..976e636400 --- /dev/null +++ b/.changeset/perfect-ducks-promise.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +EntityTypePicker can be hidden and have an initial filter value set, similar to EntityKindPicker diff --git a/plugins/catalog-react/api-report.md b/plugins/catalog-react/api-report.md index 06dccf4b7f..bf8295a8b5 100644 --- a/plugins/catalog-react/api-report.md +++ b/plugins/catalog-react/api-report.md @@ -658,10 +658,20 @@ export class EntityTypeFilter implements EntityFilter { readonly value: string | string[]; } +// Warning: (ae-missing-release-tag) "EntityTypeFilterProps" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export type EntityTypeFilterProps = { + initialFilter?: string; + hidden?: boolean; +}; + // Warning: (ae-missing-release-tag) "EntityTypePicker" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) -export const EntityTypePicker: () => JSX.Element | null; +export const EntityTypePicker: ( + props: EntityTypeFilterProps, +) => JSX.Element | null; // Warning: (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen // Warning: (ae-forgotten-export) The symbol "Props" needs to be exported by the entry point index.d.ts diff --git a/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.test.tsx b/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.test.tsx index 9912f3d371..8eba11aeca 100644 --- a/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.test.tsx @@ -121,4 +121,26 @@ describe('', () => { expect(updateFilters).toHaveBeenLastCalledWith({ type: undefined }); }); + + it('respects the query parameter filter value', async () => { + const updateFilters = jest.fn(); + const queryParameters = { type: 'tool' }; + await renderWithEffects( + + + + , + , + ); + + expect(updateFilters).toHaveBeenLastCalledWith({ + type: new EntityTypeFilter(['tool']), + }); + }); }); diff --git a/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.tsx b/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.tsx index bc30bf5b17..225193dc93 100644 --- a/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.tsx +++ b/plugins/catalog-react/src/components/EntityTypePicker/EntityTypePicker.tsx @@ -22,7 +22,13 @@ import { useEntityTypeFilter } from '../../hooks/useEntityTypeFilter'; import { alertApiRef, useApi } from '@backstage/core-plugin-api'; import { Select } from '@backstage/core-components'; -export const EntityTypePicker = () => { +export type EntityTypeFilterProps = { + initialFilter?: string; + hidden?: boolean; +}; + +export const EntityTypePicker = (props: EntityTypeFilterProps) => { + const { hidden, initialFilter } = props; const alertApi = useApi(alertApiRef); const { error, availableTypes, selectedTypes, setSelectedTypes } = useEntityTypeFilter(); @@ -34,7 +40,10 @@ export const EntityTypePicker = () => { severity: 'error', }); } - }, [error, alertApi]); + if (initialFilter) { + setSelectedTypes([initialFilter]); + } + }, [error, alertApi, initialFilter, setSelectedTypes]); if (availableTypes.length === 0 || error) return null; @@ -46,7 +55,7 @@ export const EntityTypePicker = () => { })), ]; - return ( + return hidden ? null : (