From 9acdd257ddc31353300237855ab84c6b928aa4ea Mon Sep 17 00:00:00 2001
From: Alex Rybchenko <arybchenko@box.com>
Date: Tue, 28 Sep 2021 18:52:17 +0200
Subject: [PATCH] added "title" columns

Signed-off-by: Alex Rybchenko <arybchenko@box.com>
---
 .changeset/giant-eagles-talk.md                 |  6 ++++++
 .../src/components/EntityTable/columns.tsx      | 17 +++++++++++++++++
 .../src/components/CatalogTable/columns.tsx     | 14 ++++++++++++++
 3 files changed, 37 insertions(+)
 create mode 100644 .changeset/giant-eagles-talk.md

diff --git a/.changeset/giant-eagles-talk.md b/.changeset/giant-eagles-talk.md
new file mode 100644
index 0000000000..759719c2d9
--- /dev/null
+++ b/.changeset/giant-eagles-talk.md
@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-catalog': minor
+'@backstage/plugin-catalog-react': minor
+---
+
+Added `createMetadataTitleColumn` to allow table column for `metadata.title` entity field
diff --git a/plugins/catalog-react/src/components/EntityTable/columns.tsx b/plugins/catalog-react/src/components/EntityTable/columns.tsx
index 6956d6a900..701a8a167c 100644
--- a/plugins/catalog-react/src/components/EntityTable/columns.tsx
+++ b/plugins/catalog-react/src/components/EntityTable/columns.tsx
@@ -150,6 +150,23 @@ export function createMetadataDescriptionColumn<
   };
 }
 
+export function createMetadataTitleColumn<
+  T extends Entity,
+>(): TableColumn<T> {
+  return {
+    title: 'Title',
+    field: 'metadata.title',
+    render: entity => (
+      <OverflowTooltip
+        text={entity.metadata.title}
+        placement="bottom-start"
+        line={2}
+      />
+    ),
+    width: 'auto',
+  };
+}
+
 export function createSpecLifecycleColumn<T extends Entity>(): TableColumn<T> {
   return {
     title: 'Lifecycle',
diff --git a/plugins/catalog/src/components/CatalogTable/columns.tsx b/plugins/catalog/src/components/CatalogTable/columns.tsx
index 60493d1847..389e11f3c4 100644
--- a/plugins/catalog/src/components/CatalogTable/columns.tsx
+++ b/plugins/catalog/src/components/CatalogTable/columns.tsx
@@ -94,6 +94,20 @@ export function createMetadataDescriptionColumn(): TableColumn<EntityRow> {
   };
 }
 
+export function createMetadataTitleColumn(): TableColumn<EntityRow> {
+  return {
+    title: 'Title',
+    field: 'entity.metadata.title',
+    render: ({ entity }) => (
+      <OverflowTooltip
+        text={entity.metadata.title}
+        placement="bottom-start"
+      />
+    ),
+    width: 'auto',
+  };
+}
+
 export function createTagsColumn(): TableColumn<EntityRow> {
   return {
     title: 'Tags',