Merge branch 'release/2024-01-26' into feature/IO-1828-Front-End-Package-Updates

This commit is contained in:
Dave Richer
2024-01-26 18:08:41 -05:00
4 changed files with 29 additions and 17 deletions

View File

@@ -13,7 +13,7 @@ require('./job-lifecycle.styles.scss');
export function JobLifecycleComponent({job, statuses, ...rest}) { export function JobLifecycleComponent({job, statuses, ...rest}) {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [lifecycleData, setLifecycleData] = useState(null); const [lifecycleData, setLifecycleData] = useState(null);
const { t } = useTranslation(); // Used for tracking external state changes. const {t} = useTranslation(); // Used for tracking external state changes.
const {data} = useQuery(gql` const {data} = useQuery(gql`
query get_job_test($id: uuid!){ query get_job_test($id: uuid!){
@@ -157,7 +157,7 @@ export function JobLifecycleComponent({job, statuses, ...rest}) {
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`} title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
> >
{key.percentage > 5 ? {key.percentage > 15 ?
<> <>
<div>{key.roundedPercentage}</div> <div>{key.roundedPercentage}</div>
<div style={{ <div style={{
@@ -175,7 +175,8 @@ export function JobLifecycleComponent({job, statuses, ...rest}) {
); );
})} })}
</div> </div>
<Card type='inner' title={t('job_lifecycle.content.legend_title')} style={{marginTop: '10px'}}> <Card type='inner' title={t('job_lifecycle.content.legend_title')}
style={{marginTop: '10px'}}>
<div> <div>
{lifecycleData.durations.summations.map((key) => ( {lifecycleData.durations.summations.map((key) => (
<Tag color={key.color} style={{width: '13vh', padding: '4px', margin: '4px'}}> <Tag color={key.color} style={{width: '13vh', padding: '4px', margin: '4px'}}>
@@ -194,16 +195,25 @@ export function JobLifecycleComponent({job, statuses, ...rest}) {
))} ))}
</div> </div>
</Card> </Card>
<Card style={{marginTop: '10px'}}> {(lifecycleData?.durations?.humanReadableTotal) ||
<ul> (lifecycleData.lifecycle[0] && lifecycleData.lifecycle[0].value && lifecycleData?.durations?.totalCurrentStatusDuration?.humanReadable) ?
<li> <Card style={{marginTop: '10px'}}>
<span style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.previous_status_accumulated_time')}:</span> {lifecycleData.durations.humanReadableTotal} <ul>
</li> {lifecycleData.durations && lifecycleData.durations.humanReadableTotal &&
<li> <li>
<span style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.current_status_accumulated_time')} ({lifecycleData.lifecycle[0].value}):</span> {lifecycleData.durations.totalCurrentStatusDuration.humanReadable} <span
</li> style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.previous_status_accumulated_time')}:</span> {lifecycleData.durations.humanReadableTotal}
</ul> </li>
</Card> }
{lifecycleData.lifecycle[0] && lifecycleData.lifecycle[0].value && lifecycleData?.durations?.totalCurrentStatusDuration?.humanReadable &&
<li>
<span
style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.current_status_accumulated_time')} ({lifecycleData.lifecycle[0].value}):</span> {lifecycleData.durations.totalCurrentStatusDuration.humanReadable}
</li>
}
</ul>
</Card>
: null}
</Card> </Card>
<Card type='inner' title={( <Card type='inner' title={(
<> <>
@@ -213,7 +223,10 @@ export function JobLifecycleComponent({job, statuses, ...rest}) {
</Space> </Space>
</> </>
)}> )}>
<Table columns={columns} dataSource={lifecycleData.lifecycle}/> <Table style={{
overflow: 'auto',
width: '100%',
}} columns={columns} dataSource={lifecycleData.lifecycle}/>
</Card> </Card>
</Space> </Space>
) : ( ) : (

View File

@@ -1266,7 +1266,7 @@
"not_available": "N/A", "not_available": "N/A",
"previous_status_accumulated_time": "Previous Status Accumulated Time", "previous_status_accumulated_time": "Previous Status Accumulated Time",
"title": "Job Lifecycle Component", "title": "Job Lifecycle Component",
"title_durations": "Historical Status Duration's", "title_durations": "Historical Status Durations",
"title_loading": "Loading", "title_loading": "Loading",
"title_transitions": "Transitions" "title_transitions": "Transitions"
}, },

View File

@@ -87,7 +87,6 @@ const calculateStatusDuration = (transitions, statuses) => {
const humanReadableTotal = durationToHumanReadable(moment.duration(totalDuration)); const humanReadableTotal = durationToHumanReadable(moment.duration(totalDuration));
return { return {
summations: _.isArray(statuses) && !_.isEmpty(statuses) ? summations.sort((a, b) => { summations: _.isArray(statuses) && !_.isEmpty(statuses) ? summations.sort((a, b) => {
return statuses.indexOf(a.status) - statuses.indexOf(b.status); return statuses.indexOf(a.status) - statuses.indexOf(b.status);

View File

@@ -15,7 +15,7 @@ const durationToHumanReadable = (duration) => {
if (days) parts.push(days + ' day' + (days > 1 ? 's' : '')); if (days) parts.push(days + ' day' + (days > 1 ? 's' : ''));
if (hours) parts.push(hours + ' hour' + (hours > 1 ? 's' : '')); if (hours) parts.push(hours + ' hour' + (hours > 1 ? 's' : ''));
if (minutes) parts.push(minutes + ' minute' + (minutes > 1 ? 's' : '')); if (minutes) parts.push(minutes + ' minute' + (minutes > 1 ? 's' : ''));
if (!minutes && !hours && !days && !months && !years && seconds) parts.push(seconds + ' second' + (seconds > 1 ? 's' : '')); if (seconds) parts.push(seconds + ' second' + (seconds > 1 ? 's' : ''));
return parts.join(', '); return parts.join(', ');
} }