Merge pull request #29682 from mbenson/entityPickerPresentation

Full support in EntityPicker for default EntityPresentationApi

.changeset/eleven-ghosts-strive.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-scaffolder': patch
+---
+
+Full support in EntityPicker (and derivatives) for default EntityPresentationApi

plugins/scaffolder/src/components/fields/EntityPicker/EntityPicker.test.tsx

@@ -95,10 +95,13 @@ describe('<EntityPicker />', () => {
 
       expect(catalogApi.getEntities).toHaveBeenCalledWith({
         fields: [
+          'kind',
           'metadata.name',
           'metadata.namespace',
           'metadata.title',
-          'kind',
+          'metadata.description',
+          'spec.profile.displayName',
+          'spec.type',
         ],
         filter: undefined,
       });
@@ -230,7 +233,7 @@ describe('<EntityPicker />', () => {
       );
     });
 
-    it('search for entitities containing an specific key', async () => {
+    it('search for entities containing a specific key', async () => {
       const uiSchemaWithBoolean = {
         'ui:options': {
           catalogFilter: [
@@ -422,6 +425,82 @@ describe('<EntityPicker />', () => {
       expect(onChange).toHaveBeenCalledWith('group:default/team-b');
     });
   });
+  describe('entity presentation', () => {
+    beforeEach(() => {
+      uiSchema = {
+        'ui:options': {
+          defaultKind: 'Group',
+        },
+      };
+      props = {
+        onChange,
+        schema,
+        required,
+        uiSchema,
+        rawErrors,
+        formData,
+      } as unknown as FieldProps<any>;
+    });
+
+    it('renders selection displayName', async () => {
+      catalogApi.getEntities.mockResolvedValue({
+        items: entities.map(item => ({
+          ...item,
+          spec: {
+            profile: { displayName: item.metadata.name.replace('-', ' ') },
+          },
+        })),
+      });
+
+      const { getByRole, getByText } = await renderInTestApp(
+        <Wrapper>
+          <EntityPicker {...props} />
+        </Wrapper>,
+      );
+
+      const input = getByRole('textbox');
+
+      fireEvent.change(input, { target: { value: 't' } });
+
+      expect(getByText('team a')).toBeInTheDocument();
+
+      fireEvent.change(input, { target: { value: 's' } });
+
+      expect(getByText('squad b')).toBeInTheDocument();
+
+      fireEvent.blur(input);
+    });
+
+    it('renders selection title', async () => {
+      catalogApi.getEntities.mockResolvedValue({
+        items: entities.map(item => ({
+          ...item,
+          metadata: {
+            ...item.metadata,
+            title: item.metadata.name.replace('-', ' ').toUpperCase(),
+          },
+        })),
+      });
+
+      const { getByRole, getByText } = await renderInTestApp(
+        <Wrapper>
+          <EntityPicker {...props} />
+        </Wrapper>,
+      );
+
+      const input = getByRole('textbox');
+
+      fireEvent.change(input, { target: { value: 't' } });
+
+      expect(getByText('TEAM A')).toBeInTheDocument();
+
+      fireEvent.change(input, { target: { value: 's' } });
+
+      expect(getByText('SQUAD B')).toBeInTheDocument();
+
+      fireEvent.blur(input);
+    });
+  });
 
   describe('Required EntityPicker', () => {
     beforeEach(() => {

plugins/scaffolder/src/components/fields/EntityPicker/EntityPicker.tsx

@@ -81,10 +81,13 @@ export const EntityPicker = (props: EntityPickerProps) => {
 
   const { value: entities, loading } = useAsync(async () => {
     const fields = [
+      'kind',
       'metadata.name',
       'metadata.namespace',
       'metadata.title',
-      'kind',
+      'metadata.description',
+      'spec.profile.displayName',
+      'spec.type',
     ];
     const { items } = await catalogApi.getEntities(
       catalogFilter

plugins/scaffolder/src/components/fields/OwnerPicker/OwnerPicker.test.tsx

@@ -105,10 +105,13 @@ describe('<OwnerPicker />', () => {
             kind: ['Group', 'User'],
           },
           fields: [
+            'kind',
             'metadata.name',
             'metadata.namespace',
             'metadata.title',
-            'kind',
+            'metadata.description',
+            'spec.profile.displayName',
+            'spec.type',
           ],
         }),
       );
@@ -208,10 +211,13 @@ describe('<OwnerPicker />', () => {
             kind: ['User'],
           },
           fields: [
+            'kind',
             'metadata.name',
             'metadata.namespace',
             'metadata.title',
-            'kind',
+            'metadata.description',
+            'spec.profile.displayName',
+            'spec.type',
           ],
         }),
       );