Parcourir la source

Dim all but the last task's progress updates

This applies to the progress updates found in execution's tasks. If the
task is not running, dim all its progress updates.
Sergiu Miclea il y a 7 ans
Parent
commit
55cd0aade7
1 fichiers modifiés avec 3 ajouts et 2 suppressions
  1. 3 2
      src/components/molecules/TaskItem/TaskItem.jsx

+ 3 - 2
src/components/molecules/TaskItem/TaskItem.jsx

@@ -41,7 +41,7 @@ const Wrapper = styled.div`
     background: ${Palette.grayscale[0]};
     background: ${Palette.grayscale[0]};
   }
   }
 `
 `
-const ArrowStyled = styled(Arrow) `
+const ArrowStyled = styled(Arrow)`
   position: absolute;
   position: absolute;
   left: -24px;
   left: -24px;
 `
 `
@@ -123,6 +123,7 @@ const ProgressUpdates = styled.div`
 `
 `
 const ProgressUpdate = styled.div`
 const ProgressUpdate = styled.div`
   display: flex;
   display: flex;
+  color: ${props => props.secondary ? Palette.grayscale[5] : 'inherit'};
 `
 `
 const ProgressUpdateDate = styled.div`
 const ProgressUpdateDate = styled.div`
   min-width: ${props => props.width || 'auto'};
   min-width: ${props => props.width || 'auto'};
@@ -221,7 +222,7 @@ class TaskItem extends React.Component<Props> {
           let messageProgress = this.getMessageProgress(update.message)
           let messageProgress = this.getMessageProgress(update.message)
 
 
           return (
           return (
-            <ProgressUpdate key={i}>
+            <ProgressUpdate key={i} secondary={i < this.props.item.progress_updates.length - 1 || this.props.item.status !== 'RUNNING'}>
               <ProgressUpdateDate width={this.props.columnWidths[0]}>
               <ProgressUpdateDate width={this.props.columnWidths[0]}>
                 <span>{DateUtils.getLocalTime(update.created_at).format('YYYY-MM-DD HH:mm:ss')}</span>
                 <span>{DateUtils.getLocalTime(update.created_at).format('YYYY-MM-DD HH:mm:ss')}</span>
               </ProgressUpdateDate>
               </ProgressUpdateDate>