display if background task processing crossed midnight

2 files changed, 12 insertions, 4 deletions

diff --git a/server/sonar-web/src/main/js/apps/background-tasks/components/Task.js b/server/sonar-web/src/main/js/apps/background-tasks/components/Task.js
index c8bbf919a95..ad384d12529 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/components/Task.js
+++ b/server/sonar-web/src/main/js/apps/background-tasks/components/Task.js
@@ -41,9 +41,9 @@ export default function Task ({ task, index, tasks, component, onCancelTask, onF
         <TaskStatus task={task}/>
         <TaskComponent task={task}/>
         <TaskDay task={task} prevTask={prevTask}/>
-        <TaskDate date={task.submittedAt} format="LTS"/>
-        <TaskDate date={task.startedAt} format="LTS"/>
-        <TaskDate date={task.executedAt} format="LTS"/>
+        <TaskDate date={task.submittedAt} baseDate={task.submittedAt} format="LTS"/>
+        <TaskDate date={task.startedAt} baseDate={task.submittedAt} format="LTS"/>
+        <TaskDate date={task.executedAt} baseDate={task.submittedAt} format="LTS"/>
         <TaskExecutionTime task={task}/>
 
         <td className="thin nowrap text-right">
diff --git a/server/sonar-web/src/main/js/apps/background-tasks/components/TaskDate.js b/server/sonar-web/src/main/js/apps/background-tasks/components/TaskDate.js
index 5c8759cfa9e..568b65df97b 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/components/TaskDate.js
+++ b/server/sonar-web/src/main/js/apps/background-tasks/components/TaskDate.js
@@ -20,9 +20,17 @@
 import moment from 'moment';
 import React from 'react';
 
-export default function TaskDate ({ date, format }) {
+export default function TaskDate ({ date, baseDate, format }) {
+  const m = moment(date);
+  const baseM = moment(baseDate);
+  const diff = (date && baseDate) ? m.diff(baseM, 'days') : 0;
+
   return (
       <td className="thin nowrap text-right">
+        {diff > 0 && (
+            <span className="text-warning little-spacer-right">{`(+${diff})`}</span>
+        )}
+
         {date ? moment(date).format(format) : ''}
       </td>
   );