Merge pull request #9936 from Charge71/master

Fixed EntityOwnerPicker and OwnershipCard url filter issue #9854

.changeset/strong-beds-attack.md

@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-catalog-react': patch
+'@backstage/plugin-org': patch
+---
+
+Fixed EntityOwnerPicker and OwnershipCard url filter issue with more than 21 owners

plugins/catalog-react/src/hooks/useEntityListProvider.tsx

@@ -195,7 +195,7 @@ export const EntityListProvider = <EntityFilters extends DefaultEntityFilters>({
         });
         const newParams = qs.stringify(
           { ...oldParams, filters: queryParams },
-          { addQueryPrefix: true },
+          { addQueryPrefix: true, arrayFormat: 'repeat' },
         );
         const newUrl = `${window.location.pathname}${newParams}`;
         // We use direct history manipulation since useSearchParams and

plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.test.tsx

@@ -248,7 +248,7 @@ describe('OwnershipCard', () => {
 
     expect(getByText('OPENAPI').closest('a')).toHaveAttribute(
       'href',
-      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D%5B0%5D=my-team&filters%5Buser%5D=all',
+      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D=my-team&filters%5Buser%5D=all',
     );
   });
 
@@ -295,7 +295,7 @@ describe('OwnershipCard', () => {
 
     expect(getByText('OPENAPI').closest('a')).toHaveAttribute(
       'href',
-      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D%5B0%5D=user%3Athe-user&filters%5Bowners%5D%5B1%5D=my-team&filters%5Buser%5D=all',
+      '/create/?filters%5Bkind%5D=API&filters%5Btype%5D=openapi&filters%5Bowners%5D=user%3Athe-user&filters%5Bowners%5D=my-team&filters%5Buser%5D=all',
     );
   });
 });

plugins/org/src/components/Cards/OwnershipCard/OwnershipCard.tsx

@@ -120,9 +120,14 @@ const getQueryParams = (
     const user = owner as UserEntity;
     filters.owners = [...filters.owners, ...user.spec.memberOf];
   }
-  const queryParams = qs.stringify({
-    filters,
-  });
+  const queryParams = qs.stringify(
+    {
+      filters,
+    },
+    {
+      arrayFormat: 'repeat',
+    },
+  );
 
   return queryParams;
 };