Use order links in print proposals management

A `<select>` tag here might make more sense than in other similar places
since there are 5 options to choose among, and using links might take
too much screen space.

However, as mentioned in the previous commits, `<select>` tags which
automatically submit a form have many accessibility and usability
issues.

An alternative would be to create a dropdown menu with a button and a
list of links (similar to what Foundation does). I'm keeping the links
for simplicity and because the interface looks a bit more consistent
with the rest of the sections. Before these changes, we had a heading,
then a `<select>` field to choose the filter, and then a button to print
the page. We never use a similar interface, and some people might think
the "Print" button is related to the same form as the `<select>` field.

Now that we don't use the `order_selector` partial anywhere anymore, we
can remove it.
This commit is contained in:
Javi Martín
2021-06-27 20:28:07 +02:00
parent 227a5868b8
commit 14d8bef0d8
6 changed files with 6 additions and 23 deletions

View File

@@ -14,7 +14,9 @@
<span class="not-print"><%= t("proposals.index.select_order_long") %></span> <span class="not-print"><%= t("proposals.index.select_order_long") %></span>
<span class="for-print-only"><%= t("management.print.proposals_title") %></span> <span class="for-print-only"><%= t("management.print.proposals_title") %></span>
</h2> </h2>
<%= render "shared/order_selector", i18n_namespace: "proposals.index" %> <div class="not-print">
<%= render "shared/order_links", i18n_namespace: "proposals.index" %>
</div>
</div> </div>
<%= render @proposals %> <%= render @proposals %>

View File

@@ -1,16 +0,0 @@
<% if @valid_orders.present? && @valid_orders.count > 1 %>
<form class="inline-block">
<label for="order-selector-participation" class="show-for-sr"><%= t("#{i18n_namespace}.select_order") %></label>
<select class="js-location-changer js-order-selector select-order"
data-order="<%= @current_order %>"
name="order-selector"
id="order-selector-participation">
<% @valid_orders.each do |order| %>
<option <%= "selected" if order == @current_order %>
value="<%= current_path_with_query_params(order: order, page: 1) %>">
<%= t("#{i18n_namespace}.orders.#{order}") %>
</option>
<% end %>
</select>
</form>
<% end %>

View File

@@ -190,7 +190,6 @@ ignore_unused:
- "debates.index.select_order" - "debates.index.select_order"
- "debates.index.orders.*" - "debates.index.orders.*"
- "debates.index.section_header.*" - "debates.index.section_header.*"
- "proposals.index.select_order"
- "proposals.index.orders.*" - "proposals.index.orders.*"
- "proposals.index.section_header.*" - "proposals.index.section_header.*"
- "*.index.search_form.*" - "*.index.search_form.*"

View File

@@ -378,7 +378,6 @@ en:
search_results: search_results:
one: " containing the term <strong>'%{search_term}'</strong>" one: " containing the term <strong>'%{search_term}'</strong>"
other: " containing the term <strong>'%{search_term}'</strong>" other: " containing the term <strong>'%{search_term}'</strong>"
select_order: Order by
select_order_long: "You are viewing proposals according to:" select_order_long: "You are viewing proposals according to:"
start_proposal: Create a proposal start_proposal: Create a proposal
title: Proposals title: Proposals

View File

@@ -378,7 +378,6 @@ es:
search_results: search_results:
one: " que contiene <strong>'%{search_term}'</strong>" one: " que contiene <strong>'%{search_term}'</strong>"
other: " que contienen <strong>'%{search_term}'</strong>" other: " que contienen <strong>'%{search_term}'</strong>"
select_order: Ordenar por
select_order_long: "Estas viendo las propuestas" select_order_long: "Estas viendo las propuestas"
start_proposal: Crea una propuesta start_proposal: Crea una propuesta
title: Propuestas ciudadanas title: Propuestas ciudadanas

View File

@@ -214,16 +214,16 @@ describe "Proposals" do
login_as_manager login_as_manager
click_link "Print proposals" click_link "Print proposals"
expect(page).to have_selector(".js-order-selector[data-order='confidence_score']") expect(page).to have_link "highest rated", class: "is-active"
within(".proposals-list") do within(".proposals-list") do
expect(best_proposal.title).to appear_before(medium_proposal.title) expect(best_proposal.title).to appear_before(medium_proposal.title)
expect(medium_proposal.title).to appear_before(worst_proposal.title) expect(medium_proposal.title).to appear_before(worst_proposal.title)
end end
select "newest", from: "order-selector" click_link "newest"
expect(page).to have_selector(".js-order-selector[data-order='created_at']") expect(page).to have_link "newest", class: "is-active"
expect(page).to have_current_path(/order=created_at/) expect(page).to have_current_path(/order=created_at/)
expect(page).to have_current_path(/page=1/) expect(page).to have_current_path(/page=1/)