add customStatusIcon support to DefaultTaskGroup

patternfly · Oct 21, 2024 · 4c2aa8f · 4c2aa8f
1 parent 02f6fbe
commit 4c2aa8f
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 3 deletions.
diff --git a/packages/demo-app-ts/src/demos/pipelineGroupsDemo/DemoTaskGroup.tsx b/packages/demo-app-ts/src/demos/pipelineGroupsDemo/DemoTaskGroup.tsx
@@ -53,6 +53,7 @@ const DemoTaskGroup: React.FunctionComponent<DemoTaskGroupProps> = ({ element, .
         hideDetailsAtMedium
         showStatusState
         status={data.status}
+        customStatusIcon={data.customStatusIcon}
         hiddenDetailsShownStatuses={[RunStatus.Succeeded]}
         {...rest}
       />

diff --git a/...oupsDemo/createDemoPipelineGroupsNodes.ts → ...upsDemo/createDemoPipelineGroupsNodes.tsx b/...oupsDemo/createDemoPipelineGroupsNodes.ts → ...upsDemo/createDemoPipelineGroupsNodes.tsx
@@ -1,4 +1,6 @@
 /* eslint-disable camelcase */
+import React from 'react';
+import { BanIcon } from '@patternfly/react-icons';
 import { PipelineNodeModel, RunStatus } from '@patternfly/react-topology';
 
 export const NODE_PADDING_VERTICAL = 0;
@@ -112,7 +114,8 @@ export const createExecution3 = (runAfter?: string): [string, PipelineNodeModel[
     group: true,
     runAfterTasks: runAfter ? [runAfter] : [],
     data: {
-      status: RunStatus.Succeeded,
+      status: RunStatus.Failed,
+      customStatusIcon: <BanIcon />,
       isDependency: true
     }
   };

diff --git a/packages/module/src/pipelines/components/groups/DefaultTaskGroup.tsx b/packages/module/src/pipelines/components/groups/DefaultTaskGroup.tsx
@@ -39,6 +39,8 @@ export interface DefaultTaskGroupProps {
   dragRegroupable?: boolean;
   /** RunStatus to depict, supported on collapsed groups only. */
   status?: RunStatus;
+  /** Custom icon to use as the status icon */
+  customStatusIcon?: React.ReactNode;
   /** Flag indicating the status indicator, supported on collapsed groups only */
   showStatusState?: boolean;
   /** Statuses to show at when details are hidden, supported on collapsed groups only */

diff --git a/packages/module/src/pipelines/components/groups/DefaultTaskGroupExpanded.tsx b/packages/module/src/pipelines/components/groups/DefaultTaskGroupExpanded.tsx
@@ -29,6 +29,7 @@ const DefaultTaskGroupExpanded: React.FunctionComponent<Omit<DefaultTaskGroupPro
       showLabelOnHover,
       hideDetailsAtMedium,
       status,
+      customStatusIcon,
       GroupLabelComponent = NodeLabel,
       truncateLength,
       canDrop,
@@ -179,6 +180,7 @@ const DefaultTaskGroupExpanded: React.FunctionComponent<Omit<DefaultTaskGroupPro
             position={labelPosition}
             centerLabelOnEdge={centerLabelOnEdge}
             runStatus={status}
+            customStatusIcon={customStatusIcon}
             paddingX={8}
             paddingY={5}
             dragRef={dragNodeRef ? dragLabelRef : undefined}

diff --git a/packages/module/src/pipelines/components/nodes/TaskPill.tsx b/packages/module/src/pipelines/components/nodes/TaskPill.tsx
@@ -56,6 +56,7 @@ const TaskPill: React.FC<TaskPillProps> = observer(
     badgeClassName = styles.topologyPipelinesPillBadge,
     badgeTooltip,
     badgePopoverParams,
+    customStatusIcon,
     nameLabelClass,
     taskIconClass,
     taskIcon,
@@ -306,7 +307,7 @@ const TaskPill: React.FC<TaskPillProps> = observer(
                   (status === RunStatus.Running || status === RunStatus.InProgress) && styles.modifiers.spin
                 )}
               >
-                <StatusIcon status={status} />
+                {customStatusIcon ?? <StatusIcon status={status} />}
               </g>
             </g>
           ) : null}
@@ -371,7 +372,7 @@ const TaskPill: React.FC<TaskPillProps> = observer(
                 (status === RunStatus.Running || status === RunStatus.InProgress) && styles.modifiers.spin
               )}
             >
-              <StatusIcon status={status} />
+              {customStatusIcon ?? <StatusIcon status={status} />}
             </g>
           </g>
         )}