Add filters on budget investments index page

app/assets/stylesheets/layout.scss

@@ -1159,6 +1159,10 @@ form {
     &:not(.locale-switcher) {
       min-height: $line-height * 2;
     }
+
+    &:focus {
+      border: 2px solid #d2d7dc;
+    }
   }
 
   [type="radio"] {

app/assets/stylesheets/participation.scss

@@ -1225,6 +1225,18 @@
   }
 }
 
+.filter-selector {
+
+  label {
+    margin-right: $line-height / 2;
+    padding-top: $line-height / 2;
+  }
+
+  select {
+    width: auto;
+  }
+}
+
 // 05. Featured
 // ------------
 

app/views/budgets/investments/index.html.erb

@@ -70,6 +70,8 @@
         <%= render("shared/order_links", i18n_namespace: "budgets.investments.index") %>
       <% end %>
 
+      <%= render "shared/filter_selector", i18n_namespace: "budgets.investments.index" %>
+
       <% if investments_default_view? %>
 
         <% @investments.each do |investment| %>

app/views/shared/_filter_selector.html.erb

@@ -0,0 +1,17 @@
+<form class="filter-selector">
+  <div class="small-12 column text-right">
+    <label for="filter_selector" class="small inline-block"><%= t("#{i18n_namespace}.filter") %></label>
+    <select class="js-location-changer inline-block"
+            data-order="<%= @current_filter %>"
+            name="filter-selector"
+            id="filter_selector"
+            title="<%= t("#{i18n_namespace}.filter") %>">
+      <% @valid_filters.each do |filter| %>
+        <option <%= "selected" if filter == @current_filter %>
+          value="<%= current_path_with_query_params(filter: filter, page: 1) %>">
+          <%= t("#{i18n_namespace}.filters.#{filter}") %>
+        </option>
+      <% end %>
+    </select>
+  </div>
+</form>

config/i18n-tasks.yml

@@ -125,6 +125,7 @@ ignore_missing:
 ## Consider these keys used:
 ignore_unused:
   - "budgets.phase.*"
+  - "budgets.investments.index.filter*"
   - "budgets.investments.index.orders.*"
   - "budgets.index.section_header.*"
   - "budgets.ballots.show.amount_available.*"

config/locales/en/budgets.yml

@@ -121,6 +121,14 @@ en:
           by_feasibility: By feasibility
           feasible: Feasible projects
           unfeasible: Unfeasible projects
+        filter: "Filtering projects by"
+        filters:
+          not_unfeasible: "Not unfeasible"
+          feasible: "Feasible"
+          unfeasible: "Unfeasible"
+          unselected: "Unselected"
+          selected: "Selected"
+          winners: "Winners"
         orders:
           random: random
           confidence_score: highest rated

config/locales/es/budgets.yml

@@ -121,6 +121,14 @@ es:
           by_feasibility: Por viabilidad
           feasible: Ver los proyectos viables
           unfeasible: Ver los proyectos inviables
+        filter: "Filtrando proyectos"
+        filters:
+          not_unfeasible: "No inviables"
+          feasible: "Viables"
+          unfeasible: "No viables"
+          unselected: "No seleccionados"
+          selected: "Seleccionados"
+          winners: "Ganadores"
         orders:
           random: Aleatorios
           confidence_score: Mejor valorados

spec/system/budgets/investments_spec.rb

@@ -151,6 +151,59 @@
     end
   end
 
+  scenario "Index filter by status", :js do
+    budget_new  = create(:budget)
+    group_new   = create(:budget_group, budget: budget_new)
+    heading_new = create(:budget_heading, group: group_new)
+
+    create_list(:budget_investment, 2, :feasible, heading: heading_new)
+    create_list(:budget_investment, 2, :unfeasible, heading: heading_new)
+    create_list(:budget_investment, 2, :unselected, heading: heading_new)
+    create_list(:budget_investment, 2, :selected, heading: heading_new)
+    create_list(:budget_investment, 2, :winner, heading: heading_new)
+
+    visit budget_investments_path(budget_new, heading_id: heading_new.id)
+
+    options = find("#filter_selector").all("option").map { |option| option.text.strip }
+    expect(options).to eq ["Not unfeasible", "Feasible", "Unfeasible", "Unselected", "Selected", "Winners"]
+
+    select "Feasible", from: "filter_selector"
+    feasible_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                        filter: "feasible", page: "1")
+    expect(page).to have_current_path(feasible_path)
+    expect(page).to have_css(".budget-investment", count: 8)
+
+    select "Unfeasible", from: "filter_selector"
+    unfeasible_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                          filter: "unfeasible", page: "1")
+    expect(page).to have_current_path(unfeasible_path)
+    expect(page).to have_css(".budget-investment", count: 2)
+
+    select "Unselected", from: "filter_selector"
+    unselected_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                          filter: "unselected", page: "1")
+    expect(page).to have_current_path(unselected_path)
+    expect(page).to have_css(".budget-investment", count: 4)
+
+    select "Selected", from: "filter_selector"
+    selected_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                        filter: "selected", page: "1")
+    expect(page).to have_current_path(selected_path)
+    expect(page).to have_css(".budget-investment", count: 4)
+
+    select "Winners", from: "filter_selector"
+    winners_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                       filter: "winners", page: "1")
+    expect(page).to have_current_path(winners_path)
+    expect(page).to have_css(".budget-investment", count: 2)
+
+    select "Not unfeasible", from: "filter_selector"
+    not_unfeasible_path = budget_investments_path(budget_new, heading_id: heading_new.id,
+                                                              filter: "not_unfeasible", page: "1")
+    expect(page).to have_current_path(not_unfeasible_path)
+    expect(page).to have_css(".budget-investment", count: 8)
+  end
+
   context("Search") do
     scenario "Search by text" do
       investment1 = create(:budget_investment, heading: heading, title: "Get Schwifty")