diff --git a/src/components/Details/DetailsHeader/DetailsHeader.js b/src/components/Details/DetailsHeader/DetailsHeader.js index 70f281c94..0a37c519d 100644 --- a/src/components/Details/DetailsHeader/DetailsHeader.js +++ b/src/components/Details/DetailsHeader/DetailsHeader.js @@ -17,7 +17,7 @@ illegal under applicable law, and the grant of the foregoing license under the Apache 2.0 license is conditioned upon your compliance with such restriction. */ -import React, { useCallback, useRef, useEffect, useState } from 'react' +import React, { useCallback, useRef, useEffect, useState, useMemo } from 'react' import PropTypes from 'prop-types' import { Link, useLocation, useNavigate, useParams } from 'react-router-dom' import { isEmpty } from 'lodash' @@ -66,6 +66,16 @@ const DetailsHeader = ({ const { actionButton, withToggleViewBtn } = pageData.details const headerRef = useRef() + const errorMessage = useMemo( + () => + selectedItem.reason + ? `Reason: ${selectedItem.reason}` + : selectedItem.error + ? `Error: ${selectedItem.error}` + : '', + [selectedItem.error, selectedItem.reason] + ) + const { value: stateValue, label: stateLabel, @@ -184,12 +194,12 @@ const DetailsHeader = ({ {selectedItem.ui.customError.title} {selectedItem.ui.customError.message} )} - {selectedItem.error && ( + {errorMessage && ( } + template={} > - Error - {selectedItem.error} + {errorMessage} )} {!isEmpty(detailsStore.pods.podsPending) && ( @@ -297,7 +307,9 @@ const DetailsHeader = ({ data-testid="details-close-btn" to={ getCloseDetailsLink - ? generateUrlFromRouterPath(getCloseDetailsLink(window.location, selectedItem.name)) + ? generateUrlFromRouterPath( + getCloseDetailsLink(window.location, selectedItem.name) + ) : `/projects/${params.projectName}/${pageData.page.toLowerCase()}${ params.pageTab ? `/${params.pageTab}` : tab ? `/${tab}` : '' }` diff --git a/src/utils/getState.js b/src/utils/getState.js index 71445e322..e2190983d 100644 --- a/src/utils/getState.js +++ b/src/utils/getState.js @@ -25,12 +25,13 @@ import { FAILED_STATE, FUNCTION_INITIALIZED_STATE, FUNCTIONS_PAGE, - JOBS_MONITORING_WORKFLOWS_TAB + JOBS_MONITORING_WORKFLOWS_TAB, + MONITOR_WORKFLOWS_TAB } from '../constants' const errorStates = [ERROR_STATE, FAIL_STATE, FAILED_STATE] -const getState = (state, page, kind, reason = '') => { +const getState = (state, page, kind, reason = '', error = '') => { const stateExists = !isEmpty(state) if (page === FUNCTIONS_PAGE) { @@ -42,8 +43,16 @@ const getState = (state, page, kind, reason = '') => { }` } } else { - const commonLabel = state ? commonStateLabels(page === JOBS_MONITORING_WORKFLOWS_TAB)[state] : '' - const label = reason && errorStates.includes(state) ? `${commonLabel}. Reason: ${reason}` : commonLabel + const commonLabel = state + ? commonStateLabels(page === JOBS_MONITORING_WORKFLOWS_TAB || page === MONITOR_WORKFLOWS_TAB)[ + state + ] + : '' + const additionalLabel = reason ? `Reason: ${reason}` : error ? `${error}` : '' + const label = + additionalLabel && errorStates.includes(state) + ? `${commonLabel}. ${additionalLabel}` + : commonLabel return { value: state ?? null, diff --git a/src/utils/parseJob.js b/src/utils/parseJob.js index 4e025de44..8e13aafd5 100644 --- a/src/utils/parseJob.js +++ b/src/utils/parseJob.js @@ -56,7 +56,8 @@ export const parseJob = (job, tab, customState, customError) => { job.last_run?.status?.state, JOBS_PAGE, JOB_KIND_JOB, - job.last_run?.status?.reason ?? job.last_run?.status?.error + job.last_run?.status?.reason, + job.last_run?.status?.error ), type: job.kind === JOB_KIND_PIPELINE || jobHasWorkflowLabel(job) ? JOB_KIND_WORKFLOW : job.kind, @@ -100,7 +101,8 @@ export const parseJob = (job, tab, customState, customError) => { customState || job.status?.state, JOBS_PAGE, JOB_KIND_JOB, - job.status?.reason ?? job.status?.error + job.status?.reason, + job.status?.error ), ui_run: job.status?.ui_url, uid: job.metadata.uid,