From 8bee6a1319c5125d318d7d8045c818e313677d54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fredrik=20Adel=C3=B6w?= <freben@gmail.com>
Date: Fri, 26 Mar 2021 09:02:33 +0100
Subject: [PATCH] unify how the owner and lifecycle labels are made
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Fredrik Adelöw <freben@gmail.com>
---
 .changeset/sour-boxes-travel.md               |  5 +++
 .../components/EntityLayout/EntityLayout.tsx  | 43 ++++++++++++++-----
 .../EntityPageLayout/EntityPageLayout.tsx     |  9 ++--
 3 files changed, 43 insertions(+), 14 deletions(-)
 create mode 100644 .changeset/sour-boxes-travel.md

diff --git a/.changeset/sour-boxes-travel.md b/.changeset/sour-boxes-travel.md
new file mode 100644
index 0000000000..319bcd24c2
--- /dev/null
+++ b/.changeset/sour-boxes-travel.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+unify how the owner and lifecycle header labels are made
diff --git a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx b/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
index 87a1a48e92..6a9fa38e73 100644
--- a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
+++ b/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
@@ -14,7 +14,11 @@
  * limitations under the License.
  */
 
-import { Entity, ENTITY_DEFAULT_NAMESPACE } from '@backstage/catalog-model';
+import {
+  Entity,
+  ENTITY_DEFAULT_NAMESPACE,
+  RELATION_OWNED_BY,
+} from '@backstage/catalog-model';
 import {
   Content,
   Header,
@@ -26,6 +30,8 @@ import {
 } from '@backstage/core';
 import {
   EntityContext,
+  EntityRefLinks,
+  getEntityRelations,
   useEntityCompoundName,
 } from '@backstage/plugin-catalog-react';
 import { Box } from '@material-ui/core';
@@ -75,6 +81,29 @@ const headerProps = (
   };
 };
 
+const EntityLabels = ({ entity }: { entity: Entity }) => {
+  const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);
+  return (
+    <>
+      {ownedByRelations.length > 0 && (
+        <HeaderLabel
+          label="Owner"
+          value={
+            <EntityRefLinks
+              entityRefs={ownedByRelations}
+              defaultKind="Group"
+              color="inherit"
+            />
+          }
+        />
+      )}
+      {entity.spec?.lifecycle && (
+        <HeaderLabel label="Lifecycle" value={entity.spec.lifecycle} />
+      )}
+    </>
+  );
+};
+
 // NOTE(freben): Intentionally not exported at this point, since it's part of
 // the unstable extra context menu items concept below
 type ExtraContextMenuItem = {
@@ -133,17 +162,9 @@ export const EntityLayout = ({
         pageTitleOverride={headerTitle}
         type={headerType}
       >
-        {/* TODO: fix after catalog page customization is added */}
-        {entity && kind !== 'user' && (
+        {entity && (
           <>
-            <HeaderLabel
-              label="Owner"
-              value={entity.spec?.owner || 'unknown'}
-            />
-            <HeaderLabel
-              label="Lifecycle"
-              value={entity.spec?.lifecycle || 'unknown'}
-            />
+            <EntityLabels entity={entity} />
             <EntityContextMenu
               UNSTABLE_extraContextMenuItems={UNSTABLE_extraContextMenuItems}
               onUnregisterEntity={showRemovalDialog}
diff --git a/plugins/catalog/src/components/EntityPageLayout/EntityPageLayout.tsx b/plugins/catalog/src/components/EntityPageLayout/EntityPageLayout.tsx
index 44b1329938..efe62de6c2 100644
--- a/plugins/catalog/src/components/EntityPageLayout/EntityPageLayout.tsx
+++ b/plugins/catalog/src/components/EntityPageLayout/EntityPageLayout.tsx
@@ -22,12 +22,12 @@ import {
   Content,
   Header,
   HeaderLabel,
+  IconComponent,
   Link,
   Page,
   Progress,
   ResponseErrorPanel,
   WarningPanel,
-  IconComponent,
 } from '@backstage/core';
 import {
   EntityContext,
@@ -58,14 +58,17 @@ const EntityPageTitle = ({
 
 const EntityLabels = ({ entity }: { entity: Entity }) => {
   const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);
-
   return (
     <>
       {ownedByRelations.length > 0 && (
         <HeaderLabel
           label="Owner"
           value={
-            <EntityRefLinks entityRefs={ownedByRelations} color="inherit" />
+            <EntityRefLinks
+              entityRefs={ownedByRelations}
+              defaultKind="Group"
+              color="inherit"
+            />
           }
         />
       )}