From bc0f0407583b3697c4569451b4cfa2ded94a1c8b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Sun, 27 Jun 2021 23:40:04 +0200
Subject: [PATCH] Use order links in legislation proposals admin

As mentioned in the previous commits, a `<select>` field which submits
its form on change causes many accessibility and usability issues, so
we're replacing it with the order links we use everywhere else.

Since the links "Id" and "Title" by themselves don't have enough
information to let users know they're used to sort by ID or title, we
have to update them somehow. We could add a "Sort by:" prefix before the
list of links (and associate it with the `aria-labelledby` attribute);
however, we don't do this anywhere else and might look weird depending
on the screen size.

So we're simply adding "Sort by" before each link.

Now that we don't use the `wide_order_selector` partial anymore, we can
remove it alongside the styles for the `select-order` class.
---
 app/assets/stylesheets/admin.scss             |  4 ---
 app/assets/stylesheets/layout.scss            | 19 -------------
 app/assets/stylesheets/print.css              | 12 ---------
 .../legislation/proposals/_proposals.html.erb |  2 +-
 .../shared/_wide_order_selector.html.erb      | 27 -------------------
 config/i18n-tasks.yml                         |  1 -
 config/locales/en/admin.yml                   |  7 +++--
 config/locales/es/admin.yml                   |  7 +++--
 .../admin/legislation/proposals_spec.rb       |  6 ++---
 9 files changed, 10 insertions(+), 75 deletions(-)
 delete mode 100644 app/views/shared/_wide_order_selector.html.erb

diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index c8e05d7d6..6115a94aa 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -340,10 +340,6 @@ $table-header:   #ecf1f6;
   .is-featured {
     margin-top: rem-calc(36);
   }
-
-  .select-order {
-    min-width: rem-calc(160);
-  }
 }
 
 .for-print-only {
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 25f7f641e..737d3240e 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -2039,25 +2039,6 @@ table {
   opacity: 0.4;
 }
 
-.wide-order-selector {
-  float: none;
-  margin-top: 0;
-
-  @include breakpoint(medium) {
-    float: right;
-    margin-top: rem-calc(-24);
-  }
-
-  label {
-    padding-right: $line-height / 2;
-    float: none;
-
-    @include breakpoint(medium) {
-      float: right;
-    }
-  }
-}
-
 .comment-form {
   display: inline-block;
   width: 100%;
diff --git a/app/assets/stylesheets/print.css b/app/assets/stylesheets/print.css
index 58d2bab5e..d60a06238 100644
--- a/app/assets/stylesheets/print.css
+++ b/app/assets/stylesheets/print.css
@@ -44,18 +44,6 @@ input[type="submit"] { display: none !important; }
 
 .admin h2 { font-size: 20px !important; line-height: 20px !important; }
 
-.select-order {
-  border: 0 !important;
-  font-size: 20px !important;
-  font-weight: bold !important;
-  line-height: 20px !important;
-  margin-left: 10px !important;
-  margin-top: 0 !important;
-  margin-bottom: 0 !important;
-  margin-right: 0 !important;
-  padding: 0 !important;
-}
-
 p.proposal-info { margin-left: -6px; }
 
 a { text-decoration: none !important; }
diff --git a/app/views/admin/legislation/proposals/_proposals.html.erb b/app/views/admin/legislation/proposals/_proposals.html.erb
index a740cbd38..b884120ed 100644
--- a/app/views/admin/legislation/proposals/_proposals.html.erb
+++ b/app/views/admin/legislation/proposals/_proposals.html.erb
@@ -1,7 +1,7 @@
 <% if proposals.any? %>
   <h3><%= page_entries_info proposals %></h3>
 
-  <%= render "shared/wide_order_selector", i18n_namespace: "admin.legislation.processes.proposals" %>
+  <%= render "shared/order_links", i18n_namespace: "admin.legislation.processes.proposals" %>
 
   <table class="stack" id="legislation_proposals_list">
     <thead>
diff --git a/app/views/shared/_wide_order_selector.html.erb b/app/views/shared/_wide_order_selector.html.erb
deleted file mode 100644
index 2aa092cbd..000000000
--- a/app/views/shared/_wide_order_selector.html.erb
+++ /dev/null
@@ -1,27 +0,0 @@
-<% # Params:
-   #
-   #   i18n_namespace: for example "moderation.debates.index" %>
-
-<% if @valid_orders.present? && @valid_orders.count > 1 %>
-  <div class="wide-order-selector small-12 medium-8">
-    <form>
-      <div class="small-12 medium-6 float-left">
-        <label for="order-selector-participation">
-          <%= t("#{i18n_namespace}.select_order") %>
-        </label>
-      </div>
-      <div class="small-12 medium-6 float-left">
-        <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| %>
-            <% value = current_path_with_query_params(order: order, page: 1) %>
-            <option value="<%= value %>" <%= "selected" if order == @current_order %>>
-              <%= t("#{i18n_namespace}.orders.#{order}") %>
-            </option>
-          <% end %>
-        </select>
-      </div>
-    </form>
-  </div>
-<% end %>
diff --git a/config/i18n-tasks.yml b/config/i18n-tasks.yml
index 87697fe2f..08a5bebff 100644
--- a/config/i18n-tasks.yml
+++ b/config/i18n-tasks.yml
@@ -157,7 +157,6 @@ ignore_unused:
   - "admin.legislation.processes.index.filter*"
   - "admin.legislation.processes.*.submit_button"
   - "admin.legislation.processes.proposals.orders.*"
-  - "admin.legislation.processes.proposals.select_order"
   - "admin.legislation.draft_versions.*.submit_button"
   - "admin.legislation.questions.*.submit_button"
   - "admin.hidden_comments.index.hidden_*"
diff --git a/config/locales/en/admin.yml b/config/locales/en/admin.yml
index 564ef35dc..315641017 100644
--- a/config/locales/en/admin.yml
+++ b/config/locales/en/admin.yml
@@ -584,11 +584,10 @@ en:
           title: Create new collaborative legislation process
           submit_button: Create process
         proposals:
-          select_order: Sort by
           orders:
-            id: Id
-            title: Title
-            supports: Total supports
+            id: "Sort by ID"
+            title: "Sort by title"
+            supports: "Sort by total supports"
         process:
           title: Process
           comments: Comments
diff --git a/config/locales/es/admin.yml b/config/locales/es/admin.yml
index 930343b95..bd53a4758 100644
--- a/config/locales/es/admin.yml
+++ b/config/locales/es/admin.yml
@@ -584,11 +584,10 @@ es:
           title: Crear nuevo proceso de legislación colaborativa
           submit_button: Crear proceso
         proposals:
-          select_order: Ordenar por
           orders:
-            id: Id
-            title: Título
-            supports: Apoyos totales
+            id: "Ordenar por ID"
+            title: "Ordenar por título"
+            supports: "Ordenar por apoyos totales"
         process:
           title: Proceso
           comments: Comentarios
diff --git a/spec/system/admin/legislation/proposals_spec.rb b/spec/system/admin/legislation/proposals_spec.rb
index ff8fad6b9..8653594f2 100644
--- a/spec/system/admin/legislation/proposals_spec.rb
+++ b/spec/system/admin/legislation/proposals_spec.rb
@@ -33,7 +33,7 @@ describe "Admin collaborative legislation", :admin do
       create(:legislation_proposal, title: "cccc", legislation_process_id: process.id)
 
       visit admin_legislation_process_proposals_path(process.id)
-      select "Title", from: "order-selector-participation"
+      click_link "Sort by title"
 
       within("#legislation_proposals_list") do
         within all(".legislation_proposal")[0] { expect(page).to have_content("aaaa") }
@@ -49,7 +49,7 @@ describe "Admin collaborative legislation", :admin do
       create(:legislation_proposal, cached_votes_score: 20, legislation_process_id: process.id)
 
       visit admin_legislation_process_proposals_path(process.id)
-      select "Total supports", from: "order-selector-participation"
+      click_link "Sort by total supports"
 
       within("#legislation_proposals_list") do
         within all(".legislation_proposal")[0] { expect(page).to have_content("30") }
@@ -65,7 +65,7 @@ describe "Admin collaborative legislation", :admin do
       proposal3 = create(:legislation_proposal, title: "cccc", legislation_process_id: process.id)
 
       visit admin_legislation_process_proposals_path(process.id, order: :title)
-      select "Id", from: "order-selector-participation"
+      click_link "Sort by ID"
 
       within("#legislation_proposals_list") do
         within all(".legislation_proposal")[0] { expect(page).to have_content(proposal1.id) }