Filter issues by multiple labels with Spinach feature spec

app/assets/stylesheets/main/variables.scss

@@ -5,6 +5,7 @@ $primary_color: #2FA0BB;
 $link_color: #3A89A3;
 $style_color: #474D57;
 $bg_style_color: #2299BB;
+$list-group-active-bg: $bg_style_color;
 $hover: #D9EDF7;
 
 /**

app/helpers/projects_helper.rb

@@ -64,6 +64,31 @@ module ProjectsHelper
     project_nav_tabs.include? name
   end
 
+  def selected_label?(label_name)
+    params[:label_name].to_s.split(',').include?(label_name)
+  end
+
+  def labels_filter_path(label_name)
+    label_name =
+      if selected_label?(label_name)
+        params[:label_name].split(',').reject { |l| l == label_name }.join(',')
+      elsif params[:label_name].present?
+        "#{params[:label_name]},#{label_name}"
+      else
+        label_name
+      end
+
+    project_filter_path(label_name: label_name)
+  end
+
+  def label_filter_class(label_name)
+    if selected_label?(label_name)
+      'list-group-item active'
+    else
+      'list-group-item'
+    end
+  end
+
   def project_filter_path(options={})
     exist_opts = {
       state: params[:state],

app/views/projects/issues/_issues.html.haml

@@ -2,25 +2,6 @@
   .check-all-holder
     = check_box_tag "check_all_issues", nil, false, class: "check_all_issues left"
   .issues-filters
-    .dropdown.inline
-      %a.dropdown-toggle.btn{href: '#', "data-toggle" => "dropdown"}
-        %i.icon-tags
-        %span.light labels:
-        - if params[:label_name].present?
-          %strong= params[:label_name]
-        - else
-          Any
-        %b.caret
-      %ul.dropdown-menu
-        %li
-          = link_to project_filter_path(label_name: nil) do
-            Any
-        - issue_label_names.each do |label_name|
-          %li
-            = link_to project_filter_path(label_name: label_name) do
-              %span{class: "label #{label_css_class(label_name)}"}
-                %i.icon-tag
-              = label_name
     .dropdown.inline.prepend-left-10
       %a.dropdown-toggle.btn{href: '#', "data-toggle" => "dropdown"}
         %i.icon-user

app/views/shared/_project_filter.html.haml

@@ -26,6 +26,18 @@
           = link_to project_filter_path(state: 'all') do
             All
 
+    %fieldset
+      %legend Labels
+      %ul.list-group
+        - issue_label_names.each do |label_name|
+          = link_to labels_filter_path(label_name), class: label_filter_class(label_name) do
+            %span{class: "label #{label_css_class(label_name)}"}
+              %i.icon-tag
+            = label_name
+            - if selected_label?(label_name)
+              .pull-right
+                %i.icon-remove
+
     %fieldset
       - if %w(state scope milestone_id assignee_id label_name).select { |k| params[k].present? }.any?
         = link_to project_entities_path, class: 'cgray pull-right' do

features/project/issues/filter_labels.feature

+Feature: Project Filter Labels
+  Background:
+    Given I sign in as a user
+    And I own project "Shop"
+    And project "Shop" has issue "Bugfix1" with tags: "bug", "feature"
+    And project "Shop" has issue "Bugfix2" with tags: "bug", "enhancement"
+    And project "Shop" has issue "Feature1" with tags: "feature"
+    Given I visit project "Shop" issues page
+
+  Scenario: I should see project issues
+    Then I should see "bug" in labels filter
+    And I should see "feature" in labels filter
+    And I should see "enhancement" in labels filter
+
+  Scenario: I filter by one label
+    Given I click link "bug"
+    Then I should see "Bugfix1" in issues list
+    And I should see "Bugfix2" in issues list
+    And I should not see "Feature1" in issues list
+
+  Scenario: I filter by two labels
+    Given I click link "bug"
+    And I click link "feature"
+    Then I should see "Bugfix1" in issues list
+    And I should not see "Bugfix2" in issues list
+    And I should not see "Feature1" in issues list

features/steps/project/project_filter_labels.rb

+class ProjectFilterLabels < Spinach::FeatureSteps
+  include SharedAuthentication
+  include SharedProject
+  include SharedPaths
+
+  Then 'I should see "bug" in labels filter' do
+    within ".list-group" do
+      page.should have_content "bug"
+    end
+  end
+
+  And 'I should see "feature" in labels filter' do
+    within ".list-group" do
+      page.should have_content "feature"
+    end
+  end
+
+  And 'I should see "enhancement" in labels filter' do
+    within ".list-group" do
+      page.should have_content "enhancement"
+    end
+  end
+
+  Then 'I should see "Bugfix1" in issues list' do
+    within ".issues-list" do
+      page.should have_content "Bugfix1"
+    end
+  end
+
+  And 'I should see "Bugfix2" in issues list' do
+    within ".issues-list" do
+      page.should have_content "Bugfix2"
+    end
+  end
+
+  And 'I should not see "Bugfix2" in issues list' do
+    within ".issues-list" do
+      page.should_not have_content "Bugfix2"
+    end
+  end
+
+  And 'I should not see "Feature1" in issues list' do
+    within ".issues-list" do
+      page.should_not have_content "Feature1"
+    end
+  end
+
+  Given 'I click link "bug"' do
+    click_link "bug"
+  end
+
+  Given 'I click link "feature"' do
+    click_link "feature"
+  end
+
+  And 'project "Shop" has issue "Bugfix1" with tags: "bug", "feature"' do
+    project = Project.find_by(name: "Shop")
+    create(:issue, title: "Bugfix1", project: project, label_list: ['bug', 'feature'])
+  end
+
+  And 'project "Shop" has issue "Bugfix2" with tags: "bug", "enhancement"' do
+    project = Project.find_by(name: "Shop")
+    create(:issue, title: "Bugfix2", project: project, label_list: ['bug', 'enhancement'])
+  end
+
+  And 'project "Shop" has issue "Feature1" with tags: "feature"' do
+    project = Project.find_by(name: "Shop")
+    create(:issue, title: "Feature1", project: project, label_list: 'feature')
+  end
+end