Due date can be removed from milestones

Closes #15063

4 files changed, 19 insertions, 7 deletions

diff --git a/CHANGELOG b/CHANGELOG
index b00c149a753..07c7ad19c5f 100644
--- a/CHANGELOG
+++ b/CHANGELOG
@@ -73,6 +73,8 @@ v 8.8.5 (unreleased)
 
 v 8.8.4
   - Fix LDAP-based login for users with 2FA enabled. !4493
+  - Added descriptions to notification settings dropdown
+  - Due date can be removed from milestones
 
 v 8.8.3
   - Fix 404 page when viewing TODOs that contain milestones or labels in different projects. !4312
diff --git a/app/assets/javascripts/dispatcher.js.coffee b/app/assets/javascripts/dispatcher.js.coffee
index 29ac0f70b30..08ab9604361 100644
--- a/app/assets/javascripts/dispatcher.js.coffee
+++ b/app/assets/javascripts/dispatcher.js.coffee
@@ -29,6 +29,7 @@ class Dispatcher
         new Todos()
       when 'projects:milestones:new', 'projects:milestones:edit'
         new ZenMode()
+        new DueDateSelect()
         new GLForm($('.milestone-form'))
       when 'groups:milestones:new'
         new ZenMode()
diff --git a/app/assets/javascripts/due_date_select.js.coffee b/app/assets/javascripts/due_date_select.js.coffee
index 3d009a96d05..99d59eca9cb 100644
--- a/app/assets/javascripts/due_date_select.js.coffee
+++ b/app/assets/javascripts/due_date_select.js.coffee
@@ -1,5 +1,20 @@
 class @DueDateSelect
   constructor: ->
+    # Milestone edit/new form
+    $datePicker = $('.datepicker')
+    $dueDate = $('#milestone_due_date')
+    $datePicker.datepicker
+      dateFormat: 'yy-mm-dd'
+      onSelect: (dateText, inst) ->
+        $dueDate.val(dateText)
+    .datepicker('setDate', $.datepicker.parseDate('yy-mm-dd', $dueDate.val()))
+
+    $('.js-clear-due-date').on 'click', (e) ->
+      e.preventDefault()
+      $dueDate.val('')
+      $datePicker.datepicker('setDate', '')
+
+    # Issuable sidebar
     $loading = $('.js-issuable-update .due_date')
       .find('.block-loading')
       .hide()
diff --git a/app/views/projects/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml
index f5e2b927da8..cbf1ba04170 100644
--- a/app/views/projects/milestones/_form.html.haml
+++ b/app/views/projects/milestones/_form.html.haml
@@ -19,6 +19,7 @@
         = f.label :due_date, "Due Date", class: "control-label"
         .col-sm-10
           = f.text_field :due_date, class: "datepicker form-control", placeholder: "Select due date"
+          %a.inline.prepend-top-5.js-clear-due-date{ href: "#" } Clear due date
 
   .form-actions
     - if @milestone.new_record?
@@ -27,10 +28,3 @@
     -else
       = f.submit 'Save changes', class: "btn-save btn"
       = link_to "Cancel", namespace_project_milestone_path(@project.namespace, @project, @milestone), class: "btn btn-cancel"
-
-
-:javascript
-  $(".datepicker").datepicker({
-    dateFormat: "yy-mm-dd",
-    onSelect: function(dateText, inst) { $("#milestone_due_date").val(dateText) }
-  }).datepicker("setDate", $.datepicker.parseDate('yy-mm-dd', $('#milestone_due_date').val()));