fix(orchestrator):improve workflow details card in workflow page (#220)

* fix(orchestrator):improve workflow details card in workflwo page Signed-off-by: Lior Soffer <[email protected]> * remove grid tag Signed-off-by: Lior Soffer <[email protected]> * fix Signed-off-by: Lior Soffer <[email protected]> --------- Signed-off-by: Lior Soffer <[email protected]> Co-authored-by: Lior Soffer <[email protected]>
redhat-developer · Dec 24, 2024 · a75cfff · a75cfff
1 parent 9cc8c89
commit a75cfff
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 12 deletions.
diff --git a/workspaces/orchestrator/.changeset/big-needles-grin.md b/workspaces/orchestrator/.changeset/big-needles-grin.md
@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-orchestrator': patch
+---
+
+improve workflow details card in workflow page
diff --git a/...ces/orchestrator/plugins/orchestrator/src/components/WorkflowPage/WorkflowDetailsCard.tsx b/...ces/orchestrator/plugins/orchestrator/src/components/WorkflowPage/WorkflowDetailsCard.tsx
@@ -57,7 +57,7 @@ const WorkflowDefinitionDetailsCard = ({
   const details = React.useMemo(
     () => [
       {
-        label: 'type',
+        label: 'category',
         value: formattedWorkflowOverview?.category,
       },
 
@@ -87,17 +87,15 @@ const WorkflowDefinitionDetailsCard = ({
   return (
     <InfoCard title="Details" className={classes.details}>
       <Grid container spacing={3} alignContent="flex-start">
-        <Grid container item md={4} spacing={3} alignContent="flex-start">
-          {details?.map(({ label, value, children }) => (
-            <Grid item md={6} key={label}>
-              {/* AboutField requires the value to be defined as a prop as well */}
-              <AboutField label={label} value={value}>
-                {loading ? <Skeleton variant="text" /> : children || value}
-              </AboutField>
-            </Grid>
-          ))}
-        </Grid>
-        <Grid item md={8}>
+        {details?.map(({ label, value, children }) => (
+          <Grid item md={3} key={label}>
+            {/* AboutField requires the value to be defined as a prop as well */}
+            <AboutField label={label} value={value}>
+              {loading ? <Skeleton variant="text" /> : children || value}
+            </AboutField>
+          </Grid>
+        ))}
+        <Grid item md={3}>
           <AboutField
             label="description"
             value={formattedWorkflowOverview?.description}