zuul
/
zuul
Code Issues Proposed changes

Add estimated time remaining tooltip to UI 

With help from TristanC, this should create a tooltip when users hover
over the status bar of a running job, that displays the estimated time
left.

Change-Id: I8d386ea9dce81088eb09293e4d9643ce448434f4
Signed-off-by: Paul Belanger <pabelanger@redhat.com>
This commit is contained in:
Paul Belanger 2020-01-22 17:37:24 -05:00
parent 63dbf3476d
commit 09b4b8a5b3
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/src/containers/status/ChangePanel.jsx
View File

@ -16,6 +16,7 @@ import * as React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { Link } from 'react-router-dom'
import * as moment from 'moment'
class ChangePanel extends React.Component {
@ -191,14 +192,19 @@ class ChangePanel extends React.Component {
// Show animation in preparation phase
let className
let progressWidth = progressPercent
let title = ''
if (Number.isNaN(progressPercent)) {
progressWidth = 100
progressPercent = 0
className = 'progress-bar-striped progress-bar-animated'
}
if (remainingTime !== null) {
title = 'estimated time remaining ' + moment.duration(remainingTime, 'milliseconds').humanize()
}
return (
<div className='progress zuul-job-result'>
<div className='progress zuul-job-result'
title={title}>
<div className={'progress-bar ' + className}
role='progressbar'
aria-valuenow={progressPercent}