diff --git a/.changeset/moody-rice-jump.md b/.changeset/moody-rice-jump.md new file mode 100644 index 0000000000..00e71aa2af --- /dev/null +++ b/.changeset/moody-rice-jump.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +Change behavior in EntityAutoCompletePicker to only hide filter if there are no available options. Previously the filter was hidden if there were <= 1 available options. diff --git a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx index 94af52f374..26dee40ec3 100644 --- a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx +++ b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.test.tsx @@ -30,7 +30,7 @@ interface EntityFilters extends DefaultEntityFilters { options?: EntityOptionFilter; } -const options = ['option1', 'option2', 'option3', 'option4']; +const defaultOptions = ['option1', 'option2', 'option3', 'option4']; class EntityOptionFilter implements EntityFilter { constructor(readonly values: string[]) {} @@ -46,20 +46,25 @@ class EntityOptionFilter implements EntityFilter { } } -describe('', () => { - const mockCatalogApi: Partial> = { +const makeMockCatalogApi = ( + opts: string[] = defaultOptions, +): Partial> => { + return { getEntityFacets: jest.fn().mockResolvedValue({ facets: { - 'spec.options': options.map((value, idx) => ({ value, count: idx })), + 'spec.options': opts.map((value, idx) => ({ value, count: idx })), }, }), }; +}; +describe('', () => { beforeEach(() => { jest.clearAllMocks(); }); it('renders all options', async () => { + const mockCatalogApi = makeMockCatalogApi(); render( @@ -83,12 +88,51 @@ describe('', () => { }); fireEvent.click(screen.getByTestId('options-picker-expand')); - options.forEach(option => { + defaultOptions.forEach(option => { expect(screen.getByText(option)).toBeInTheDocument(); }); }); + it('hides filter if there are no available options', async () => { + const mockCatalogApi = makeMockCatalogApi([]); + render( + + + + label="Options" + path="spec.options" + name="options" + Filter={EntityOptionFilter} + /> + + , + ); + await waitFor(() => { + expect(screen.queryByText('Options')).not.toBeInTheDocument(); + }); + }); + + it('renders filter if there is one available option', async () => { + const mockCatalogApi = makeMockCatalogApi(['option1']); + render( + + + + label="Options" + path="spec.options" + name="options" + Filter={EntityOptionFilter} + /> + + , + ); + await waitFor(() => { + expect(screen.queryByText('Options')).toBeInTheDocument(); + }); + }); + it('renders unique options in alphabetical order', async () => { + const mockCatalogApi = makeMockCatalogApi(); render( @@ -116,6 +160,7 @@ describe('', () => { }); it('renders options with counts', async () => { + const mockCatalogApi = makeMockCatalogApi(); render( @@ -144,6 +189,7 @@ describe('', () => { }); it('respects the query parameter filter value', async () => { + const mockCatalogApi = makeMockCatalogApi(); const updateFilters = jest.fn(); const queryParameters = { options: ['option3'] }; render( @@ -172,6 +218,7 @@ describe('', () => { }); it('adds options to filters', async () => { + const mockCatalogApi = makeMockCatalogApi(); const updateFilters = jest.fn(); render( @@ -201,6 +248,7 @@ describe('', () => { }); it('removes options from filters', async () => { + const mockCatalogApi = makeMockCatalogApi(); const updateFilters = jest.fn(); render( @@ -234,6 +282,7 @@ describe('', () => { }); it('responds to external queryParameters changes', async () => { + const mockCatalogApi = makeMockCatalogApi(); const updateFilters = jest.fn(); const rendered = render( @@ -280,6 +329,7 @@ describe('', () => { }); it('filters available values by kind as default', async () => { + const mockCatalogApi = makeMockCatalogApi(); render( ', () => { }); it('can be supplied with filters for available values', async () => { + const mockCatalogApi = makeMockCatalogApi(); render(