chore: rephrase changeset and inline render logic for feat: enhance catalog-plugin with label column

Signed-off-by: Ankit Luthra <ankitluthra06@gmail.com>

.changeset/fifty-berries-learn.md

@@ -2,13 +2,10 @@
 '@backstage/plugin-catalog': patch
 ---
 
----
+Added new column `Label` to `CatalogTable.columns`, this new column allows you make use of labels from metadata.
+For example: category and visibility are type of labels associated with API entity illustrated below.
 
-This change would allow consumers of plugin catalog to make use of labels just like tags from metadata.
-
-The intent of change is to show customised columns based on selected label with which entity is associated.
-For example: In example below category and visibility are type of labels associated with API entity.
-YAML for API entity
+YAML code snippet for API entity
 
 ```yaml
 apiVersion: backstage.io/v1alpha1

plugins/catalog/src/components/CatalogTable/columns.tsx

@@ -25,31 +25,6 @@ import { OverflowTooltip, TableColumn } from '@backstage/core-components';
 import { Entity } from '@backstage/catalog-model';
 import { JsonArray } from '@backstage/types';
 
-/**
- * Renders label if exists in entities or default
- * @param labels - Key value pairs of labels specified in entity metadata
- * @param key - specified label key to be extracted from all labels
- * @param defaultValue - shows default in case label key does not exist
- * @returns Chip style component when label value exists undefined otherwise.
- */
-const renderLabel = (
-  labels: Record<string, string> | undefined,
-  key: string,
-  defaultValue?: string,
-) => {
-  const specifiedLabelValue = (labels && labels[key]) || defaultValue;
-  return (
-    specifiedLabelValue && (
-      <Chip
-        key={specifiedLabelValue}
-        label={specifiedLabelValue}
-        size="small"
-        variant="outlined"
-      />
-    )
-  );
-};
-
 // The columnFactories symbol is not directly exported, but through the
 // CatalogTable.columns field.
 /** @public */
@@ -197,9 +172,24 @@ export const columnFactories = Object.freeze({
       cellStyle: {
         padding: '0px 16px 0px 20px',
       },
-      render: ({ entity }: { entity: Entity }) => (
-        <>{renderLabel(entity.metadata?.labels, key, options?.defaultValue)}</>
-      ),
+      render: ({ entity }: { entity: Entity }) => {
+        const labels: Record<string, string> | undefined =
+          entity.metadata?.labels;
+        const specifiedLabelValue =
+          (labels && labels[key]) || options?.defaultValue;
+        return (
+          <>
+            {specifiedLabelValue && (
+              <Chip
+                key={specifiedLabelValue}
+                label={specifiedLabelValue}
+                size="small"
+                variant="outlined"
+              />
+            )}
+          </>
+        );
+      },
       width: 'auto',
     };
   },