From d0747af4975dbae44c1ba06da77ac52f41f958cc Mon Sep 17 00:00:00 2001
From: Winnie Hellmann <winnie@gitlab.com>
Date: Mon, 29 Oct 2018 11:23:11 +0100
Subject: Add dynamic timer for delayed jobs in job list

---
 .../javascripts/pages/projects/jobs/index/index.js       | 16 ++++++++++++++++
 app/views/projects/ci/builds/_build.html.haml            |  6 +++---
 changelogs/unreleased/winh-job-list-dynamic-timer.yml    |  5 +++++
 3 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 app/assets/javascripts/pages/projects/jobs/index/index.js
 create mode 100644 changelogs/unreleased/winh-job-list-dynamic-timer.yml

diff --git a/app/assets/javascripts/pages/projects/jobs/index/index.js b/app/assets/javascripts/pages/projects/jobs/index/index.js
new file mode 100644
index 00000000000..1b57c67f16b
--- /dev/null
+++ b/app/assets/javascripts/pages/projects/jobs/index/index.js
@@ -0,0 +1,16 @@
+import Vue from 'vue';
+import GlCountdown from '~/vue_shared/components/gl_countdown.vue';
+
+document.addEventListener('DOMContentLoaded', () => {
+  const remainingTimeElements = document.querySelectorAll('.js-remaining-time');
+  remainingTimeElements.forEach(
+    el =>
+      new Vue({
+        ...GlCountdown,
+        el,
+        propsData: {
+          endDateString: el.dateTime,
+        },
+      }),
+  );
+});
diff --git a/app/views/projects/ci/builds/_build.html.haml b/app/views/projects/ci/builds/_build.html.haml
index f5685d3b50d..0b10c66777a 100644
--- a/app/views/projects/ci/builds/_build.html.haml
+++ b/app/views/projects/ci/builds/_build.html.haml
@@ -105,10 +105,10 @@
             = icon('remove', class: 'cred')
         - elsif job.scheduled?
           .btn-group
-            .btn.btn-default.has-tooltip{ disabled: true,
-              title: job.scheduled_at }
+            .btn.btn-default{ disabled: true }
               = sprite_icon('planning')
-              = duration_in_numbers(job.execute_in)
+              %time.js-remaining-time{ datetime: job.scheduled_at.utc.iso8601 }
+                = duration_in_numbers(job.execute_in)
             - confirmation_message = s_("DelayedJobs|Are you sure you want to run %{job_name} immediately? This job will run automatically after it's timer finishes.") % { job_name: job.name }
             = link_to play_project_job_path(job.project, job, return_to: request.original_url),
               method: :post,
diff --git a/changelogs/unreleased/winh-job-list-dynamic-timer.yml b/changelogs/unreleased/winh-job-list-dynamic-timer.yml
new file mode 100644
index 00000000000..333a974d6aa
--- /dev/null
+++ b/changelogs/unreleased/winh-job-list-dynamic-timer.yml
@@ -0,0 +1,5 @@
+---
+title: Add dynamic timer for delayed jobs in job list
+merge_request: 22656
+author:
+type: changed
-- 
cgit v1.2.3