From 1b6f043701ae330d27942b13110d31d66f3e7499 Mon Sep 17 00:00:00 2001 From: Mahendra Patel Date: Fri, 21 Mar 2025 19:15:12 +0530 Subject: [PATCH] Added EntityOrderFilter to sort entities by different fields Signed-off-by: Mahendra Patel --- .changeset/sharp-numbers-doubt.md | 8 +++++++- .../UserListPicker/UserListPicker.test.tsx | 20 ------------------- .../useAllEntitiesCount.test.tsx | 6 ------ .../UserListPicker/useAllEntitiesCount.ts | 2 +- .../useOwnedEntitiesCount.test.tsx | 12 ----------- .../UserListPicker/useOwnedEntitiesCount.ts | 2 +- .../useStarredEntitiesCount.test.tsx | 6 ------ .../UserListPicker/useStarredEntitiesCount.ts | 2 +- plugins/catalog-react/src/filters.ts | 8 ++++---- 9 files changed, 14 insertions(+), 52 deletions(-) diff --git a/.changeset/sharp-numbers-doubt.md b/.changeset/sharp-numbers-doubt.md index 93f1b5f233..81e1313780 100644 --- a/.changeset/sharp-numbers-doubt.md +++ b/.changeset/sharp-numbers-doubt.md @@ -7,8 +7,14 @@ Added EntityOrderFilter to sort entities by different fields/columns. This new f Example usage: ```ts -import { EntityOrderFilter } from '@backstage/plugin-catalog-react'; +import { + EntityOrderFilter, + useEntityList, +} from '@backstage/plugin-catalog-react'; +// ... +const { updateFilters } = useEntityList(); +// ... updateFilters({ order: new EntityOrderFilter([ { diff --git a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx index 0952822f95..2471ce5277 100644 --- a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.test.tsx @@ -60,12 +60,6 @@ const mockUser: UserEntity = { }; const ownershipEntityRefs = ['user:default/testuser']; -const orderFields = [ - { - field: 'metadata.name', - order: 'asc', - }, -]; const mockConfigApi = mockApis.config({ data: { organization: { name: 'Test Company' } }, @@ -196,7 +190,6 @@ describe('', () => { 'metadata.namespace': ['default'], }, limit: 0, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { @@ -204,7 +197,6 @@ describe('', () => { 'relations.ownedBy': ['user:default/testuser'], }, limit: 0, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { @@ -212,7 +204,6 @@ describe('', () => { 'metadata.name': ['e-1', 'e-2'], }, limit: 1000, - orderFields, }); }); @@ -238,12 +229,10 @@ describe('', () => { expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { 'metadata.tags': ['tag1'] }, limit: 0, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { 'metadata.name': ['e-1', 'e-2'], 'metadata.tags': ['tag1'] }, limit: 1000, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { @@ -251,7 +240,6 @@ describe('', () => { 'metadata.tags': ['tag1'], }, limit: 0, - orderFields, }); }); @@ -284,12 +272,10 @@ describe('', () => { expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { kind: 'component' }, limit: 0, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { kind: 'component', 'metadata.name': ['e-1', 'e-2'] }, limit: 1000, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { @@ -297,7 +283,6 @@ describe('', () => { 'relations.ownedBy': ['user:default/testuser'], }, limit: 0, - orderFields, }); }); @@ -323,12 +308,10 @@ describe('', () => { expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { kind: 'component', 'metadata.name': ['e-1', 'e-2'] }, limit: 1000, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { kind: 'component' }, limit: 0, - orderFields, }); expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { @@ -336,7 +319,6 @@ describe('', () => { 'relations.ownedBy': ['user:default/testuser'], }, limit: 0, - orderFields, }); }); @@ -469,7 +451,6 @@ describe('', () => { expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { 'metadata.name': ['e-1', 'e-2'] }, limit: 1000, - orderFields, }); }); expect(updateFilters).not.toHaveBeenCalledWith({ @@ -643,7 +624,6 @@ describe('', () => { expect(mockCatalogApi.queryEntities).toHaveBeenCalledWith({ filter: { 'metadata.name': ['e-1', 'e-2'] }, limit: 1000, - orderFields, }); }); expect(updateFilters).not.toHaveBeenCalledWith({ diff --git a/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.test.tsx b/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.test.tsx index 718f7499a9..2449d47a1c 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.test.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.test.tsx @@ -74,12 +74,6 @@ describe('useAllEntitiesCount', () => { 'relations.ownedBy': ['user:default/owner'], }, limit: 0, - orderFields: [ - { - field: 'metadata.name', - order: 'asc', - }, - ], }), ); expect(result.current).toEqual({ count: 10, loading: false }); diff --git a/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.ts b/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.ts index fa564382d8..c4bea1fa05 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.ts +++ b/plugins/catalog-react/src/components/UserListPicker/useAllEntitiesCount.ts @@ -30,7 +30,7 @@ export function useAllEntitiesCount() { const request = useMemo(() => { const { user, ...allFilters } = filters; const compacted = compact(Object.values(allFilters)); - const catalogFilters = reduceCatalogFilters(compacted); + const { orderFields, ...catalogFilters } = reduceCatalogFilters(compacted); const newRequest: QueryEntitiesInitialRequest = { ...catalogFilters, limit: 0, diff --git a/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.test.tsx b/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.test.tsx index 7b4f89d70a..8ea9f63472 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.test.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.test.tsx @@ -115,12 +115,6 @@ describe('useOwnedEntitiesCount', () => { 'relations.ownedBy': ['user:default/spiderman', 'user:group/a-group'], }, limit: 0, - orderFields: [ - { - field: 'metadata.name', - order: 'asc', - }, - ], }), ); @@ -196,12 +190,6 @@ describe('useOwnedEntitiesCount', () => { 'relations.ownedBy': ['user:group/a-group'], }, limit: 0, - orderFields: [ - { - field: 'metadata.name', - order: 'asc', - }, - ], }), ); diff --git a/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.ts b/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.ts index dbdc040165..489ae24d4e 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.ts +++ b/plugins/catalog-react/src/components/UserListPicker/useOwnedEntitiesCount.ts @@ -38,7 +38,7 @@ export function useOwnedEntitiesCount() { ); const { user, owners, ...allFilters } = filters; - const catalogFilters = reduceCatalogFilters( + const { orderFields, ...catalogFilters } = reduceCatalogFilters( compact(Object.values(allFilters)), ); diff --git a/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.test.tsx b/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.test.tsx index 8808d4a3b6..096ad01ddd 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.test.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.test.tsx @@ -87,12 +87,6 @@ describe('useStarredEntitiesCount', () => { 'metadata.name': ['favourite1', 'favourite2'], }, limit: 1000, - orderFields: [ - { - field: 'metadata.name', - order: 'asc', - }, - ], }); expect(result.current).toEqual({ count: 2, diff --git a/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.ts b/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.ts index 70dde024f8..f1fcea4572 100644 --- a/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.ts +++ b/plugins/catalog-react/src/components/UserListPicker/useStarredEntitiesCount.ts @@ -34,7 +34,7 @@ export function useStarredEntitiesCount() { const request = useMemo(() => { const { user, ...allFilters } = filters; const compacted = compact(Object.values(allFilters)); - const catalogFilters = reduceCatalogFilters(compacted); + const { orderFields, ...catalogFilters } = reduceCatalogFilters(compacted); const facet = 'metadata.name'; diff --git a/plugins/catalog-react/src/filters.ts b/plugins/catalog-react/src/filters.ts index 3bbae986fa..8a6e664585 100644 --- a/plugins/catalog-react/src/filters.ts +++ b/plugins/catalog-react/src/filters.ts @@ -338,13 +338,13 @@ export class EntityErrorFilter implements EntityFilter { * @public */ export class EntityOrderFilter implements EntityFilter { - constructor(readonly value: EntityOrderQuery) {} + constructor(readonly values: [string, 'asc' | 'desc'][]) {} getOrderFilters(): EntityOrderQuery { - return this.value; + return this.values.map(([field, order]) => ({ field, order })); } - filterEntity(_: Entity): boolean { - return true; + toQueryValue(): string[] { + return this.values.flat(); } }