From 55107bf3a5e18ad86b762adf2405adbcf7a9610f Mon Sep 17 00:00:00 2001
From: Jenny <32821331+jenny-s51@users.noreply.github.com>
Date: Tue, 25 Jun 2024 15:33:13 -0400
Subject: [PATCH] [RHOAIENG-7425]: Update Pipeline Group Labels and Positioning

---
 frontend/package-lock.json                                | 8 ++++----
 frontend/package.json                                     | 2 +-
 .../src/concepts/topology/PipelineDefaultTaskGroup.tsx    | 5 +++++
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 3ffb5a7ef9..eed5f5d862 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -23,7 +23,7 @@
         "@patternfly/react-styles": "^5.3.1",
         "@patternfly/react-table": "^5.3.3",
         "@patternfly/react-tokens": "^5.3.1",
-        "@patternfly/react-topology": "^5.4.0-prerelease.9",
+        "@patternfly/react-topology": "^5.4.0-prerelease.10",
         "@patternfly/react-virtualized-extension": "^5.1.0",
         "@types/classnames": "^2.3.1",
         "axios": "^1.6.4",
@@ -4090,9 +4090,9 @@
       "integrity": "sha512-VYK0uVP2/2RJ7ZshJCCLeq0Boih5I1bv+9Z/Bg6h12dCkLs85XsxAX9Ve+BGIo5DF54/mzcRHE1RKYap4ISXuw=="
     },
     "node_modules/@patternfly/react-topology": {
-      "version": "5.4.0-prerelease.9",
-      "resolved": "https://registry.npmjs.org/@patternfly/react-topology/-/react-topology-5.4.0-prerelease.9.tgz",
-      "integrity": "sha512-mECBtZ+MsnOwONM56a5x0YGjHg+Z7D6AOIGEq2Tz1DRDTq2hnw+naMLq+oQRs8ijSqhpvaA/IYHY3Bi/CW412A==",
+      "version": "5.4.0-prerelease.10",
+      "resolved": "https://registry.npmjs.org/@patternfly/react-topology/-/react-topology-5.4.0-prerelease.10.tgz",
+      "integrity": "sha512-7hTc6Pe5Z1qd54VyONHyANshtJigd9AEWos6y+ekW4QjgUEF+kJ134x7hW7jlNcLLHcrBF3RClCA4Kja8sqVzQ==",
       "dependencies": {
         "@dagrejs/dagre": "1.1.2",
         "@patternfly/react-core": "^5.1.1",
diff --git a/frontend/package.json b/frontend/package.json
index ea20c525ec..cb8c23c41e 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -66,7 +66,7 @@
     "@patternfly/react-styles": "^5.3.1",
     "@patternfly/react-table": "^5.3.3",
     "@patternfly/react-tokens": "^5.3.1",
-    "@patternfly/react-topology": "^5.4.0-prerelease.9",
+    "@patternfly/react-topology": "^5.4.0-prerelease.10",
     "@patternfly/react-virtualized-extension": "^5.1.0",
     "@types/classnames": "^2.3.1",
     "axios": "^1.6.4",
diff --git a/frontend/src/concepts/topology/PipelineDefaultTaskGroup.tsx b/frontend/src/concepts/topology/PipelineDefaultTaskGroup.tsx
index b877763c03..8c8d016496 100644
--- a/frontend/src/concepts/topology/PipelineDefaultTaskGroup.tsx
+++ b/frontend/src/concepts/topology/PipelineDefaultTaskGroup.tsx
@@ -12,6 +12,8 @@ import {
   NodeModel,
   useHover,
   PipelineNodeModel,
+  TaskGroupPillLabel,
+  LabelPosition,
 } from '@patternfly/react-topology';
 import { Flex, FlexItem, Popover, Stack, StackItem } from '@patternfly/react-core';
 import { PipelineNodeModelExpanded, StandardTaskNodeData } from '~/concepts/topology/types';
@@ -57,9 +59,12 @@ const DefaultTaskGroupInner: React.FunctionComponent<PipelinesDefaultGroupInnerP
         element={element}
         collapsible
         recreateLayoutOnCollapseChange
+        GroupLabelComponent={TaskGroupPillLabel}
         selected={selected}
         onSelect={onSelect}
         hideDetailsAtMedium
+        centerLabelOnEdge
+        labelPosition={LabelPosition.top}
         showStatusState
         scaleNode={hover && detailsLevel !== ScaleDetailsLevel.high}
         showLabelOnHover