From d6155128750ba72da5aac14abe47ef4cb4c21393 Mon Sep 17 00:00:00 2001
From: Ian Bolton <ibolton@redhat.com>
Date: Mon, 18 Dec 2023 12:58:31 -0500
Subject: [PATCH] :bug: Truncate archatype description (#1634)

https://issues.redhat.com/browse/MTA-1921

Signed-off-by: ibolton336 <ibolton@redhat.com>
---
 client/src/app/pages/archetypes/archetypes-page.tsx  |  5 ++++-
 .../components/archetype-description-column.tsx      | 12 ++++++++----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/client/src/app/pages/archetypes/archetypes-page.tsx b/client/src/app/pages/archetypes/archetypes-page.tsx
index 1174837001..879c9c0cc2 100644
--- a/client/src/app/pages/archetypes/archetypes-page.tsx
+++ b/client/src/app/pages/archetypes/archetypes-page.tsx
@@ -365,7 +365,10 @@ const Archetypes: React.FC = () => {
                         <Td {...getTdProps({ columnKey: "name" })}>
                           {archetype.name}
                         </Td>
-                        <Td {...getTdProps({ columnKey: "description" })}>
+                        <Td
+                          {...getTdProps({ columnKey: "description" })}
+                          modifier="truncate"
+                        >
                           <ArchetypeDescriptionColumn archetype={archetype} />
                         </Td>
                         <Td {...getTdProps({ columnKey: "tags" })}>
diff --git a/client/src/app/pages/archetypes/components/archetype-description-column.tsx b/client/src/app/pages/archetypes/components/archetype-description-column.tsx
index ae6a2d09d8..145f5db25a 100644
--- a/client/src/app/pages/archetypes/components/archetype-description-column.tsx
+++ b/client/src/app/pages/archetypes/components/archetype-description-column.tsx
@@ -1,11 +1,15 @@
 import React from "react";
-import { Text } from "@patternfly/react-core";
-
+import { Text, Tooltip } from "@patternfly/react-core";
 import type { Archetype } from "@app/api/models";
 
-// TODO: Truncate length and add tooltip with full text
 const ArchetypeDescriptionColumn: React.FC<{ archetype: Archetype }> = ({
   archetype,
-}) => <Text>{archetype.description}</Text>;
+}) => {
+  return (
+    <Tooltip content={archetype.description}>
+      <Text>{archetype.description}</Text>
+    </Tooltip>
+  );
+};
 
 export default ArchetypeDescriptionColumn;