Merge branch 'ui/issuable-filter' into 'master'

UI: Issuable filter tweaks

Depends on !1953

See the commits for more details, the messages mostly speak for themselves.

# Highlights

## Filter bar

Before:

![filter_before](/uploads/b061be7521c6d5babb77c7d12e77f65e/filter_before.png)

After:

![filter_after](/uploads/aadfbcd77caf1b49fde8ca6d781f1004/filter_after.png)

## Bulk edit bar

Before:

![bulk_before](/uploads/849c98224e1f335c65c0de5616bbcdae/bulk_before.png)

After:

![bulk_after](/uploads/185d29116663f9f663acab76d328096f/bulk_after.png)


See merge request !1963

app/assets/javascripts/issues.js.coffee

@@ -29,7 +29,7 @@
     $('#filter_issue_search').val($('#issue_search').val())
 
   initSelects: ->
-    $("select#update_status").select2(width: 'resolve', dropdownAutoWidth: true)
+    $("select#update_state_event").select2(width: 'resolve', dropdownAutoWidth: true)
     $("select#update_assignee_id").select2(width: 'resolve', dropdownAutoWidth: true)
     $("select#update_milestone_id").select2(width: 'resolve', dropdownAutoWidth: true)
     $("select#label_name").select2(width: 'resolve', dropdownAutoWidth: true)

app/assets/javascripts/users_select.js.coffee

@@ -32,17 +32,15 @@ class @UsersSelect
               if showNullUser
                 nullUser = {
                   name: 'Unassigned',
-                  avatar: null,
-                  username: 'none',
                   id: 0
                 }
                 data.results.unshift(nullUser)
 
               if showAnyUser
+                name = showAnyUser
+                name = 'Any User' if name == true
                 anyUser = {
-                  name: 'Any',
-                  avatar: null,
-                  username: 'none',
+                  name: name,
                   id: null
                 }
                 data.results.unshift(anyUser)
@@ -50,7 +48,6 @@ class @UsersSelect
             if showEmailUser && data.results.length == 0 && query.term.match(/^[^@]+@[^@]+$/)
               emailUser = {
                 name: "Invite \"#{query.term}\"",
-                avatar: null,
                 username: query.term,
                 id: query.term
               }
@@ -82,10 +79,10 @@ class @UsersSelect
     else
       avatar = gon.default_avatar_url
 
-    "<div class='user-result'>
+    "<div class='user-result #{'no-username' unless user.username}'>
        <div class='user-image'><img class='avatar s24' src='#{avatar}'></div>
        <div class='user-name'>#{user.name}</div>
-       <div class='user-username'>#{user.username}</div>
+       <div class='user-username'>#{user.username || ""}</div>
      </div>"
 
   formatSelection: (user) ->

app/assets/stylesheets/framework/selects.scss

@@ -15,6 +15,16 @@
       border-left: none;
       padding-top: 5px;
     }
+
+    .select2-chosen {
+      color: $gl-text-color;
+    }
+
+    &.select2-default {
+      .select2-chosen {
+        color: #999;
+      }
+    }
   }
 }
 
@@ -23,6 +33,7 @@
   border: 1px solid #e7e9ed;
 }
 
+
 .select2-drop {
   @include box-shadow(rgba(76, 86, 103, 0.247059) 0px 0px 1px 0px, rgba(31, 37, 50, 0.317647) 0px 2px 18px 0px);
   @include border-radius (0px);
@@ -123,10 +134,16 @@
 }
 
 .user-result {
+  min-height: 24px;
+
   .user-image {
     float: left;
   }
+
+  &.no-username {
     .user-name {
+      line-height: 24px;
+    }
   }
 }
 

app/helpers/issues_helper.rb

@@ -44,9 +44,10 @@ module IssuesHelper
   end
 
   def bulk_update_milestone_options
-    options_for_select([['None (backlog)', -1]]) +
-        options_from_collection_for_select(project_active_milestones, 'id',
-                                           'title', params[:milestone_id])
+    milestones = project_active_milestones.to_a
+    milestones.unshift(Milestone::None)
+
+    options_from_collection_for_select(milestones, 'id', 'title', params[:milestone_id])
   end
 
   def milestone_options(object)

app/helpers/selects_helper.rb

@@ -15,12 +15,14 @@ module SelectsHelper
 
     html = {
       class: css_class,
-      'data-placeholder' => placeholder,
-      'data-null-user' => null_user,
-      'data-any-user' => any_user,
-      'data-email-user' => email_user,
-      'data-first-user' => first_user,
-      'data-current-user' => current_user
+      data: {
+        placeholder: placeholder,
+        null_user: null_user,
+        any_user: any_user,
+        email_user: email_user,
+        first_user: first_user,
+        current_user: current_user
+      }
     }
 
     unless opts[:scope] == :all

app/models/label.rb

@@ -17,7 +17,7 @@ class Label < ActiveRecord::Base
   # Requests that have no label assigned.
   LabelStruct = Struct.new(:title, :name)
   None = LabelStruct.new('No Label', 'No Label')
-  Any = LabelStruct.new('Any', '')
+  Any = LabelStruct.new('Any Label', '')
 
   DEFAULT_COLOR = '#428BCA'
 

app/models/milestone.rb

@@ -16,9 +16,9 @@
 class Milestone < ActiveRecord::Base
   # Represents a "No Milestone" state used for filtering Issues and Merge
   # Requests that have no milestone assigned.
-  MilestoneStruct = Struct.new(:title, :name)
-  None = MilestoneStruct.new('No Milestone', 'No Milestone')
-  Any = MilestoneStruct.new('Any', '')
+  MilestoneStruct = Struct.new(:title, :name, :id)
+  None = MilestoneStruct.new('No Milestone', 'No Milestone', 0)
+  Any = MilestoneStruct.new('Any Milestone', '', -1)
 
   include InternalId
   include Sortable

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

@@ -31,11 +31,11 @@
       .issues-other-filters
         .filter-item.inline
           = users_select_tag(:assignee_id, selected: params[:assignee_id],
-            placeholder: 'Assignee', class: 'trigger-submit', any_user: true, null_user: true, first_user: true, current_user: true)
+            placeholder: 'Assignee', class: 'trigger-submit', any_user: "Any Assignee", null_user: true, first_user: true, current_user: true)
 
         .filter-item.inline
           = users_select_tag(:author_id, selected: params[:author_id],
-            placeholder: 'Author', class: 'trigger-submit', any_user: true, first_user: true, current_user: true)
+            placeholder: 'Author', class: 'trigger-submit', any_user: "Any Author", first_user: true, current_user: true)
 
         .filter-item.inline.milestone-filter
           = select_tag('milestone_title', projects_milestones_options,
@@ -53,11 +53,15 @@
     - if controller.controller_name == 'issues'
       .issues_bulk_update.hide
         = form_tag bulk_update_namespace_project_issues_path(@project.namespace, @project), method: :post  do
-          = select_tag('update[state_event]', options_for_select([['Open', 'reopen'], ['Closed', 'close']]), prompt: "Status", class: 'form-control')
+          .filter-item.inline
+            = select_tag('update[state_event]', options_for_select([['Open', 'reopen'], ['Closed', 'close']]), include_blank: true, data: { placeholder: "Status" })
+          .filter-item.inline
             = users_select_tag('update[assignee_id]', placeholder: 'Assignee', null_user: true, first_user: true, current_user: true)
-          = select_tag('update[milestone_id]', bulk_update_milestone_options, prompt: "Milestone")
+          .filter-item.inline
+            = select_tag('update[milestone_id]', bulk_update_milestone_options, include_blank: true, data: { placeholder: "Milestone" })
           = hidden_field_tag 'update[issues_ids]', []
           = hidden_field_tag :state_event, params[:state_event]
+          .filter-item.inline
             = button_tag "Update issues", class: "btn update_selected_issues btn-save"
 
 :javascript

features/steps/project/issues/issues.rb

@@ -65,7 +65,7 @@ class Spinach::Features::ProjectIssues < Spinach::FeatureSteps
   step 'I see current user as the first user' do
     expect(page).to have_selector('.user-result', visible: true, count: 4)
     users = page.all('.user-name')
-    expect(users[0].text).to eq 'Any'
+    expect(users[0].text).to eq 'Any Assignee'
     expect(users[1].text).to eq 'Unassigned'
     expect(users[2].text).to eq current_user.name
   end