refactor(EntityOwnerPicker): use ownedBy relation

Signed-off-by: Phil Kuang <pkuang@factset.com>

.changeset/wild-ghosts-deny.md

@@ -2,4 +2,4 @@
 '@backstage/plugin-catalog': patch
 ---
 
-Export `EntityRow` type and `CreateComponentButton` components
+Export `EntityRow` type

plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.test.tsx

@@ -28,9 +28,24 @@ const sampleEntities: Entity[] = [
     metadata: {
       name: 'component-1',
     },
-    spec: {
-      owner: 'some-owner',
-    },
+    relations: [
+      {
+        type: 'ownedBy',
+        target: {
+          name: 'some-owner',
+          namespace: 'default',
+          kind: 'Group',
+        },
+      },
+      {
+        type: 'ownedBy',
+        target: {
+          name: 'some-owner-2',
+          namespace: 'default',
+          kind: 'Group',
+        },
+      },
+    ],
   },
   {
     apiVersion: '1',
@@ -38,9 +53,16 @@ const sampleEntities: Entity[] = [
     metadata: {
       name: 'component-2',
     },
-    spec: {
-      owner: 'another-owner',
-    },
+    relations: [
+      {
+        type: 'ownedBy',
+        target: {
+          name: 'another-owner',
+          namespace: 'default',
+          kind: 'Group',
+        },
+      },
+    ],
   },
   {
     apiVersion: '1',
@@ -48,9 +70,16 @@ const sampleEntities: Entity[] = [
     metadata: {
       name: 'component-3',
     },
-    spec: {
-      owner: 'some-owner',
-    },
+    relations: [
+      {
+        type: 'ownedBy',
+        target: {
+          name: 'some-owner',
+          namespace: 'default',
+          kind: 'Group',
+        },
+      },
+    ],
   },
 ];
 
@@ -67,7 +96,7 @@ describe('<EntityOwnerPicker/>', () => {
 
     fireEvent.click(rendered.getByTestId('owner-picker-expand'));
     sampleEntities
-      .map(e => e.spec?.owner!)
+      .flatMap(e => e.relations?.map(r => r.target.name))
       .forEach(owner => {
         expect(rendered.getByText(owner as string)).toBeInTheDocument();
       });
@@ -88,6 +117,7 @@ describe('<EntityOwnerPicker/>', () => {
     expect(rendered.getAllByRole('option').map(o => o.textContent)).toEqual([
       'another-owner',
       'some-owner',
+      'some-owner-2',
     ]);
   });
 

plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { Entity } from '@backstage/catalog-model';
+import { Entity, RELATION_OWNED_BY } from '@backstage/catalog-model';
 import {
   Box,
   Checkbox,
@@ -29,6 +29,8 @@ import { Autocomplete } from '@material-ui/lab';
 import React, { useMemo } from 'react';
 import { useEntityListProvider } from '../../hooks/useEntityListProvider';
 import { EntityOwnerFilter } from '../../types';
+import { getEntityRelations } from '../../utils';
+import { formatEntityRefTitle } from '../EntityRefLink';
 
 const icon = <CheckBoxOutlineBlankIcon fontSize="small" />;
 const checkedIcon = <CheckBoxIcon fontSize="small" />;
@@ -40,7 +42,11 @@ export const EntityOwnerPicker = () => {
       [
         ...new Set(
           backendEntities
-            .map((e: Entity) => e.spec?.owner)
+            .flatMap((e: Entity) =>
+              getEntityRelations(e, RELATION_OWNED_BY).map(o =>
+                formatEntityRefTitle(o, { defaultKind: 'group' }),
+              ),
+            )
             .filter(Boolean) as string[],
         ),
       ].sort(),

plugins/catalog-react/src/types.ts

@@ -14,8 +14,13 @@
  * limitations under the License.
  */
 
-import { Entity, UserEntity } from '@backstage/catalog-model';
-import { isOwnerOf } from './utils';
+import {
+  Entity,
+  RELATION_OWNED_BY,
+  UserEntity,
+} from '@backstage/catalog-model';
+import { getEntityRelations, isOwnerOf } from './utils';
+import { formatEntityRefTitle } from './components/EntityRefLink';
 
 export type EntityFilter = {
   /**
@@ -65,7 +70,11 @@ export class EntityOwnerFilter implements EntityFilter {
   constructor(readonly values: string[]) {}
 
   filterEntity(entity: Entity): boolean {
-    return this.values.some(v => entity.spec?.owner === v);
+    return this.values.some(v =>
+      getEntityRelations(entity, RELATION_OWNED_BY).some(
+        o => formatEntityRefTitle(o, { defaultKind: 'group' }) === v,
+      ),
+    );
   }
 }