diff --git a/.changeset/big-rabbits-think.md b/.changeset/big-rabbits-think.md new file mode 100644 index 0000000000..bd0ae32b5e --- /dev/null +++ b/.changeset/big-rabbits-think.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-react': patch +--- + +Fixes a bug where the `EntityListProvider` would not correctly hydrate query parameters if more than 20 were provided for the same key. diff --git a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx index 7b9d17d82e..711fb09f8c 100644 --- a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx +++ b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx @@ -222,6 +222,27 @@ describe('', () => { }); }); + it('resolves query param filter values with large arrays', async () => { + const largeArray = Array.from({ length: 50 }, (_, i) => `owner-${i}`); + const query = qs.stringify({ + filters: { kind: 'component', owners: largeArray }, + }); + const { result } = renderHook(() => useEntityList(), { + wrapper: createWrapper({ + location: `/catalog?${query}`, + pagination, + }), + }); + + await waitFor(() => { + expect(result.current.queryParameters).toBeTruthy(); + }); + expect(result.current.queryParameters).toEqual({ + kind: 'component', + owners: largeArray, + }); + }); + it('does not fetch when only frontend filters change', async () => { const { result } = renderHook(() => useEntityList(), { wrapper: createWrapper({ pagination }), diff --git a/plugins/catalog-react/src/hooks/useEntityListProvider.tsx b/plugins/catalog-react/src/hooks/useEntityListProvider.tsx index a2ab4ea377..12eb9dff6c 100644 --- a/plugins/catalog-react/src/hooks/useEntityListProvider.tsx +++ b/plugins/catalog-react/src/hooks/useEntityListProvider.tsx @@ -199,6 +199,7 @@ export const EntityListProvider = ( } = useMemo(() => { const parsed = qs.parse(location.search, { ignoreQueryPrefix: true, + arrayLimit: 10000, }); let limit = paginationLimit; @@ -398,6 +399,7 @@ export const EntityListProvider = ( const oldParams = qs.parse(location.search, { ignoreQueryPrefix: true, + arrayLimit: 10000, }); const newParams = qs.stringify( {