Merge branch 'add_autocomplete_for_labels' into 'master'

Add GFM autocomplete for labels

Closes #14637 

See merge request !4013

CHANGELOG

@@ -67,6 +67,7 @@ v 8.9.0 (unreleased)
   - Use downcased path to container repository as this is expected path by Docker
   - Projects pending deletion will render a 404 page
   - Measure queue duration between gitlab-workhorse and Rails
+  - Added Gfm autocomplete for labels
   - Make Omniauth providers specs to not modify global configuration
   - Make authentication service for Container Registry to be compatible with < Docker 1.11
   - Add Application Setting to configure Container Registry token expire delay (default 5min)

app/assets/javascripts/gfm_auto_complete.js.coffee

@@ -15,6 +15,9 @@ GitLab.GfmAutoComplete =
   Members:
     template: '<li>${username} <small>${title}</small></li>'
 
+  Labels:
+    template: '<li><span class="dropdown-label-box" style="background: ${color}"></span> ${title}</li>'
+
   # Issues and MergeRequests
   Issues:
     template: '<li><small>${id}</small> ${title}</li>'
@@ -176,6 +179,25 @@ GitLab.GfmAutoComplete =
             title:  sanitize(m.title)
             search: "#{m.iid} #{m.title}"
 
+    @input.atwho
+      at: '~'
+      alias: 'labels'
+      searchKey: 'search'
+      displayTpl: @Labels.template
+      insertTpl: '${atwho-at}${title}'
+      callbacks:
+        beforeSave: (merges) ->
+          sanitizeLabelTitle = (title)->
+            if /\w+\s+\w+/g.test(title)
+              "\"#{sanitize(title)}\""
+            else
+              sanitize(title)
+
+          $.map merges, (m) ->
+            title: sanitizeLabelTitle(m.title)
+            color: m.color
+            search: "#{m.title}"
+
   destroyAtWho: ->
     @input.atwho('destroy')
 
@@ -195,6 +217,8 @@ GitLab.GfmAutoComplete =
     @input.atwho 'load', 'mergerequests', data.mergerequests
     # load emojis
     @input.atwho 'load', ':', data.emojis
+    # load labels
+    @input.atwho 'load', '~', data.labels
 
     # This trigger at.js again
     # otherwise we would be stuck with loading until the user types

app/controllers/projects_controller.rb

@@ -143,6 +143,7 @@ class ProjectsController < Projects::ApplicationController
       issues: autocomplete.issues,
       milestones: autocomplete.milestones,
       mergerequests: autocomplete.merge_requests,
+      labels: autocomplete.labels,
       members: participants
     }
 

app/services/projects/autocomplete_service.rb

@@ -11,5 +11,9 @@ module Projects
     def merge_requests
       @project.merge_requests.opened.select([:iid, :title])
     end
+
+    def labels
+      @project.labels.select([:title, :color])
+    end
   end
 end