import React , { FC , useMemo } from 'react' ; import { i18n } from '@kbn/i18n' ; import { EuiFlexGroup , EuiFlexItem , EuiIcon , EuiLoadingSpinner , EuiToolTip } from '@elastic/eui' ; import type { Job } from '../../lib/job' ; import { JOB_STATUSES } from '../../../common/constants' ; import { jobHasIssues } from '../utils' ; interface Props { job : Job ; } const i18nTexts = { completed : i18n . translate ( 'xpack.reporting.statusIndicator.completedLabel' , { defaultMessage : 'Done' , } ) , completedWithWarnings : i18n . translate ( 'xpack.reporting.statusIndicator.completedWithWarningsLabel' , { defaultMessage : 'Done, warnings detected' , } ) , pending : i18n . translate ( 'xpack.reporting.statusIndicator.pendingLabel' , { defaultMessage : 'Pending' , } ) , processing : ( { attempt , of } ) => of !== undefined ? i18n . translate ( 'xpack.reporting.statusIndicator.processingMaxAttemptsLabel' , { defaultMessage : `Processing, attempt {attempt} of {of}` , values : { attempt , of } , } ) : i18n . translate ( 'xpack.reporting.statusIndicator.processingLabel' , { defaultMessage : `Processing, attempt {attempt}` , values : { attempt } , } ) , failed : i18n . translate ( 'xpack.reporting.statusIndicator.failedLabel' , { defaultMessage : 'Failed' , } ) , unknown : i18n . translate ( 'xpack.reporting.statusIndicator.unknownLabel' , { defaultMessage : 'Unknown' , } ) , lastStatusUpdate : ( { date } ) => i18n . translate ( 'xpack.reporting.statusIndicator.lastStatusUpdateLabel' , { defaultMessage : 'Updated at {date}' , values : { date } , } ) , } ; export const ReportStatusIndicator = ( { job } ) => { const hasIssues = useMemo < boolean > ( ( ) => jobHasIssues ( job ) , [ job ] ) ; let icon ; let statusText ; switch ( job . status ) { case JOB_STATUSES . COMPLETED : if ( hasIssues ) { icon = < EuiIcon type = "alert" color = "warning" / > ; statusText = i18nTexts . completedWithWarnings ; break ; } icon = < EuiIcon type = "checkInCircleFilled" color = "success" / > ; statusText = i18nTexts . completed ; break ; case JOB_STATUSES . WARNINGS : icon = < EuiIcon type = "alert" color = "warning" / > ; statusText = i18nTexts . completedWithWarnings ; break ; case JOB_STATUSES . PENDING : icon = < EuiLoadingSpinner />; statusText = i18nTexts . pending ; break ; case JOB_STATUSES . PROCESSING : icon = < EuiLoadingSpinner />; statusText = i18nTexts . processing ( { attempt : job . attempts , of : job . max_attempts } ) ; break ; case JOB_STATUSES . FAILED : icon = < EuiIcon type = "crossInACircleFilled" color = "danger" / > ; statusText = i18nTexts . failed ; break ; default : icon = < EuiIcon type = "cross" color = "subdued" / > ; statusText = i18nTexts . unknown ; } return ( < EuiToolTip content = { i18nTexts . lastStatusUpdate ( { date : job . getPrettyStatusTimestamp ( ) } ) } > < EuiFlexGroup gutterSize = "s" alignItems = "center" responsive = { false } aria - label = { statusText } > < EuiFlexItem grow = { false } > { icon } < /EuiFlexItem> < EuiFlexItem grow = { false } > { statusText } < /EuiFlexItem> < /EuiFlexGroup> < /EuiToolTip>); } ;