diff --git a/app/javascript/components/miq-data-table/miq-table-cell.jsx b/app/javascript/components/miq-data-table/miq-table-cell.jsx index 0922d0143a7..70ce994af6e 100644 --- a/app/javascript/components/miq-data-table/miq-table-cell.jsx +++ b/app/javascript/components/miq-data-table/miq-table-cell.jsx @@ -90,12 +90,12 @@ const MiqTableCell = ({ }; /** Function to render icon(s) in cell. */ - const renderIcon = (icon, style, showText) => { + const renderIcon = (icon, style, showText, title = '') => { const hasBackground = Object.keys(style).includes('background'); const styledIconClass = hasBackground ? 'styled_icon' : ''; const longerTextClass = hasBackground && veryLongText ? 'styled_icon_margin' : ''; return ( -
+
{ typeof (icon) === 'string' ? returnIcon(icon, style, styledIconClass, longerTextClass) @@ -111,7 +111,7 @@ const MiqTableCell = ({ if (showText) { const color = item.props ? item.props.style : {}; const iconStyle = item.background ? { background: item.background, color: '#FFF' } : color; - return renderIcon(item.icon, iconStyle, showText); + return renderIcon(item.icon, iconStyle, showText, item.title); } const { className, style } = item.props ? item.props : { className: item.icon, style: { color: '#000' } }; return renderIcon(className, style, showText); diff --git a/app/javascript/components/request-workflow-status/data.js b/app/javascript/components/request-workflow-status/data.js index 41ae940c1ff..a406cc1b8a2 100644 --- a/app/javascript/components/request-workflow-status/data.js +++ b/app/javascript/components/request-workflow-status/data.js @@ -65,12 +65,19 @@ const convertDuration = (duration) => { }; const getItemIcon = (item) => { - if (item.RunnerContext && item.RunnerContext.success) { - return { icon: 'carbon--CheckmarkOutline' }; - } if (item.RunnerContext && item.RunnerContext.Error) { - return { icon: 'carbon--MisuseOutline' }; + if (item.FinishedTime) { + if (item.Output && item.Output.Error) { + if (item.RetryCount) { + return { icon: 'carbon--RetryFailed' } + } else { + return { icon: 'carbon--MisuseOutline' } + } + } else { + return { icon: 'carbon--CheckmarkOutline' } + } + } else { + return { icon: 'carbon--PlayOutline' } } - return { icon: 'carbon--PlayOutline' }; }; /** Function to get the row data of workflow states table. */ @@ -97,7 +104,7 @@ export const workflowStatusData = (response) => { rows.push({ id: state.Guid.toString(), - name: { text: state.Name, icon: 'carbon--PlayOutline' }, + name: { text: state.Name, ...getItemIcon(state) }, enteredTime: convertDate(state.EnteredTime.toString()), finishedTime: '', duration: convertDuration(durationTime), diff --git a/app/stylesheet/miq-data-table.scss b/app/stylesheet/miq-data-table.scss index c94ad6510ec..53a66b56761 100644 --- a/app/stylesheet/miq-data-table.scss +++ b/app/stylesheet/miq-data-table.scss @@ -409,4 +409,8 @@ table.miq_preview { .carbon--PlayOutline { color: var(--yellow) } + + .carbon--RetryFailed { + color: var(--red); + } }