Add labels as proper POST arrays using new dropdown

app/assets/javascripts/labels_select.js.coffee

@@ -6,8 +6,8 @@ class @LabelsSelect
       labelUrl = $dropdown.data('labels')
       issueUpdateURL = $dropdown.data('issueUpdate')
       selectedLabel = $dropdown.data('selected')
-      if selectedLabel
-        selectedLabel = selectedLabel.toString().split(',')
+      if selectedLabel?
+        selectedLabel = selectedLabel.split(',')
       newLabelField = $('#new_label_name')
       newColorField = $('#new_label_color')
       showNo = $dropdown.data('show-no')
@@ -17,19 +17,6 @@ class @LabelsSelect
       $block = $selectbox.closest('.block')
       $value = $block.find('.value')
       $loading = $block.find('.block-loading').fadeOut()
-      issueURLSplit = issueUpdateURL.split('/')
-      labelHTMLTemplate = _.template(
-          '<% _.each(labels, function(label){ %>'+
-          '<a href="'+ 
-          ['',issueURLSplit[1], issueURLSplit[2],''].join('/') +
-          'issues?label_name=<%= label.title %>">'+
-          '<span class="label color-label" '+
-          'style="background-color: <%= label.color %>; '+
-          'color: #FFFFFF">'+
-          '<%= label.title %>'+
-          '</span>'+
-          '</a>'+
-          '<% }); %>');
 
       if newLabelField.length
         $newLabelCreateButton = $('.js-new-label-btn')
@@ -39,6 +26,24 @@ class @LabelsSelect
 
         # Suggested colors in the dropdown to chose from pre-chosen colors
         $('.suggest-colors-dropdown a').on 'click', (e) ->
+
+      issueURLSplit = issueURL.split('/') if issueURL?
+      if issueURL
+        labelHTMLTemplate = _.template(
+            '<% _.each(labels, function(label){ %>'+
+            '<a href="'+ 
+            ['',issueURLSplit[1], issueURLSplit[2],''].join('/') +
+            'issues?label_name=<%= label.title %>">'+
+            '<span class="label color-label" '+
+            'style="background-color: <%= label.color %>; '+
+            'color: #FFFFFF">'+
+            '<%= label.title %>'+
+            '</span>'+
+            '</a>'+
+            '<% }); %>');
+
+      if newLabelField.length and $dropdown.hasClass 'js-extra-options'
+        $('.suggest-colors-dropdown a').on "click", (e) ->
           e.preventDefault()
           e.stopPropagation()
           newColorField
@@ -113,22 +118,23 @@ class @LabelsSelect
           $.ajax(
             url: labelUrl
           ).done (data) ->
-            if showNo
-              data.unshift(
-                id: 0
-                title: 'No Label'
-              )
-
-            if showAny
-              data.unshift(
-                isAny: true
-                title: 'Any Label'
-              )
-
-            if data.length > 2
-              data.splice 2, 0, 'divider'
-
+            if $dropdown.hasClass 'js-extra-options'
+              if showNo
+                data.unshift(
+                  id: 0
+                  title: 'No Label'
+                )
+
+              if showAny
+                data.unshift(
+                  isAny: true
+                  title: 'Any Label'
+                )
+
+              if data.length > 2
+                data.splice 2, 0, 'divider'
             callback data
+
         renderRow: (label) ->
           if $.isArray(selectedLabel)
             selected = ''
@@ -184,16 +190,19 @@ class @LabelsSelect
               .closest('.selectbox')
               .find('input[type="hidden"]')
               .val()
+            console.log 'selected', selected
             # need inline-block here instead of show, 
             # which will default to the element's style in this case inline.
+            selected = if selected? then [ selected ] else ['']
+            console.log 'selected', selected
             $loading
               .fadeIn()
             $.ajax(
               type: 'PUT'
-              url: issueUpdateURL
+              url: issueURL
               data:
                 issue: 
-                  label_ids: [selected]
+                  label_ids:  selected
             ).done (data) ->
               $loading.fadeOut()
               $selectbox.hide()

app/assets/javascripts/milestone_select.js.coffee

@@ -21,21 +21,21 @@ class @MilestoneSelect
           $.ajax(
             url: milestonesUrl
           ).done (data) ->
-            if showNo
-              data.unshift(
-                id: '0'
-                title: 'No Milestone'
-              )
+            if $dropdown.hasClass "js-extra-options"
+              if showNo
+                data.unshift(
+                  id: '0'
+                  title: 'No Milestone'
+                )
 
-            if showAny
-              data.unshift(
-                isAny: true
-                title: 'Any Milestone'
-              )
-
-            if data.length > 2
-              data.splice 2, 0, 'divider'
+              if showAny
+                data.unshift(
+                  isAny: true
+                  title: 'Any Milestone'
+                )
 
+              if data.length > 2
+                data.splice 2, 0, 'divider'
             callback(data)
         filterable: true
         search:

app/controllers/projects/issues_controller.rb

@@ -69,7 +69,13 @@ class Projects::IssuesController < Projects::ApplicationController
     @merge_requests = @issue.referenced_merge_requests(current_user)
     @related_branches = @issue.related_branches - @merge_requests.map(&:source_branch)
 
-    respond_with(@issue)
+    respond_to do |format|
+      format.html
+      format.json do
+        render json: @issue.to_json(include: [:milestone, :labels])
+      end
+    end
+
   end
 
   def create

app/views/shared/issuable/_filter.html.haml

@@ -40,8 +40,7 @@
             = dropdown_tag("Assignee", options: { toggle_class: "js-user-search js-update-assignee", title: "Assign to", filter: true, dropdown_class: "dropdown-menu-user dropdown-menu-selectable",
               placeholder: "Search authors", data: { first_user: (current_user.username if current_user), null_user: true, current_user: true, project_id: @project.id, field_name: "update[assignee_id]" } })
           .filter-item.inline
-            = dropdown_tag("Milestone", options: { title: "Assign milestone", toggle_class: 'js-milestone-select', filter: true, dropdown_class: "dropdown-menu-selectable dropdown-menu-milestone",
-              placeholder: "Search milestones", data: { show_no: true, field_name: "update[milestone_id]", project_id: @project.id, milestones: namespace_project_milestones_path(@project.namespace, @project, :json), use_id: true } })
+            = dropdown_tag("Milestone", options: { title: "Assign milestone", toggle_class: 'js-milestone-select js-extra-options', filter: true, dropdown_class: "dropdown-menu-selectable dropdown-menu-milestone", placeholder: "Search milestones", data: { show_no: true, field_name: "update[milestone_id]", project_id: @project.id, milestones: namespace_project_milestones_path(@project.namespace, @project, :json), use_id: true } })
           = hidden_field_tag 'update[issues_ids]', []
           = hidden_field_tag :state_event, params[:state_event]
           .filter-item.inline

app/views/shared/issuable/_sidebar.html.haml

@@ -86,7 +86,7 @@
               .light None
           .selectbox.hide-collapsed
             .dropdown
-              %button.dropdown-menu-toggle.js-label-select{type: "button", data: {toggle: "dropdown", field_name: "label_name", show_no: "true", show_any: "true", selected: params[:label_name], project_id: (@project.id if @project), issue_update: namespace_project_issue_path(@project.namespace, @project, issuable.id, :json), labels: (namespace_project_labels_path(@project.namespace, @project, :json) if @project)}}
+              %button.dropdown-menu-toggle.js-label-select.js-multiselect{type: "button", data: {toggle: "dropdown", field_name: "label_name", show_no: "true", show_any: "true", selected: issuable.label_names.join(","), project_id: (@project.id if @project), issue_update: namespace_project_issue_path(@project.namespace, @project, issuable.id, :json), labels: (namespace_project_labels_path(@project.namespace, @project, :json) if @project)}}
                 %span.dropdown-toggle-text
                   Label
                 = icon('chevron-down')