Replace formatPipelineDuration with formatTime

app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue

 <script>
 import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
-import '~/lib/utils/datetime_utility';
 import timeagoMixin from '~/vue_shared/mixins/timeago';
-import { formatPipelineDuration } from '~/pipelines/utils';
+import { formatTime } from '~/lib/utils/datetime_utility';
 
 export default {
   directives: {
@@ -28,7 +27,7 @@ export default {
       return this.finishedTime !== '';
     },
     durationFormatted() {
-      return formatPipelineDuration(this.duration);
+      return formatTime(this.duration);
     },
   },
 };

app/assets/javascripts/pipelines/utils.js

@@ -94,22 +94,3 @@ export const generateJobNeedsDict = ({ jobs }) => {
     return { ...acc, [jobs[value].id]: uniqueValues };
   }, {});
 };
-
-export const formatPipelineDuration = duration => {
-  let ss = duration % 60;
-  let mm = Math.floor(duration / 60) % 60;
-  let hh = Math.floor(duration / 60 / 60);
-
-  // left pad with 0s
-  if (hh < 10) {
-    hh = `0${hh}`;
-  }
-  if (mm < 10) {
-    mm = `0${mm}`;
-  }
-  if (ss < 10) {
-    ss = `0${ss}`;
-  }
-
-  return `${hh}:${mm}:${ss}`;
-};

app/assets/javascripts/projects/pipelines/charts/components/statistics_list.vue

 <script>
-import { formatPipelineDuration } from '~/pipelines/utils';
+import { formatTime } from '~/lib/utils/datetime_utility';
 import { s__, n__ } from '~/locale';
 
 export default {
@@ -11,7 +11,7 @@ export default {
   },
   computed: {
     totalDuration() {
-      return formatPipelineDuration(this.counts.totalDuration);
+      return formatTime(this.counts.totalDuration);
     },
     statistics() {
       return [

spec/frontend/pipelines/pipeline_graph/utils_spec.js

@@ -2,7 +2,6 @@ import {
   preparePipelineGraphData,
   createUniqueJobId,
   generateJobNeedsDict,
-  formatPipelineDuration,
 } from '~/pipelines/utils';
 
 describe('utils functions', () => {
@@ -210,27 +209,3 @@ describe('utils functions', () => {
     });
   });
 });
-
-describe('formatPipelineDuration', () => {
-  it.each`
-    hours       | minutes | seconds | result
-    ${0}        | ${0}    | ${0}    | ${'00:00:00'}
-    ${0}        | ${0}    | ${10}   | ${'00:00:10'}
-    ${0}        | ${1}    | ${0}    | ${'00:01:00'}
-    ${0}        | ${1}    | ${1}    | ${'00:01:01'}
-    ${1}        | ${0}    | ${0}    | ${'01:00:00'}
-    ${1}        | ${17}   | ${40}   | ${'01:17:40'}
-    ${23}       | ${59}   | ${59}   | ${'23:59:59'}
-    ${1 * 24}   | ${0}    | ${0}    | ${'24:00:00'}
-    ${2 * 24}   | ${0}    | ${0}    | ${'48:00:00'}
-    ${1 * 24}   | ${5}    | ${34}   | ${'24:05:34'}
-    ${10 * 24}  | ${0}    | ${0}    | ${'240:00:00'}
-    ${100 * 24} | ${0}    | ${0}    | ${'2400:00:00'}
-  `(
-    'returns $result for $hours hour(s), $minutes minute(s), $seconds second(s)',
-    ({ hours, minutes, seconds, result }) => {
-      const totalSeconds = 60 * 60 * hours + 60 * minutes + seconds;
-      expect(formatPipelineDuration(totalSeconds)).toBe(result);
-    },
-  );
-});