Use a switch to toggle proposal selection

The button to select/deselect a proposal wasn't very intuitive; for
example, it wasn't obvious that pressing a button saying "selected"
would deselect the proposal.

So we're using a switch control, like we do to enable/disable features
since commit fabe97e50.
This commit is contained in:
Javi Martín
2021-08-20 02:58:10 +02:00
parent b127bd2f51
commit fec44c146c
7 changed files with 53 additions and 30 deletions

View File

@@ -1 +1 @@
<%= button_to text, path, options %>
<%= render Admin::ToggleSwitchComponent.new(action, proposal, pressed: selected?, **options) %>

View File

@@ -7,27 +7,21 @@ class Admin::Proposals::ToggleSelectionComponent < ApplicationComponent
private
def text
if proposal.selected?
t("admin.proposals.index.selected")
else
t("admin.proposals.index.select")
end
def action
:toggle_selection
end
def path
admin_polymorphic_path(proposal, action: :toggle_selection)
def selected?
proposal.selected?
end
def options
{ remote: true, method: :patch, class: html_class }
{
"aria-label": label
}
end
def html_class
if proposal.selected?
"button expanded"
else
"button hollow expanded"
end
def label
t("admin.actions.label", action: t("admin.actions.select"), name: proposal.title)
end
end

View File

@@ -16,6 +16,7 @@ en:
unmark_featured: Unmark featured
edit: Edit
configure: Configure
select: Select
officing_booth:
title: "You are officing the booth located at %{booth}. If this is not correct, do not continue and call the help phone number. Thank you."
banners:
@@ -1294,7 +1295,6 @@ en:
title: Proposals
id: ID
author: Author
select: Select
selected: Selected
milestones: Milestones
no_proposals: There are no proposals.

View File

@@ -16,6 +16,7 @@ es:
unmark_featured: Quitar destacado
edit: Editar
configure: Configurar
select: Seleccionar
officing_booth:
title: "Estás ahora mismo en la mesa ubicada en %{booth}. Si esto no es correcto no sigas adelante y llama al teléfono de incidencias. Gracias."
banners:
@@ -1295,7 +1296,6 @@ es:
id: ID
author: Autor
milestones: Hitos
select: Seleccionar
selected: Seleccionada
no_proposals: No hay propuestas.
show:

View File

@@ -0,0 +1,21 @@
require "rails_helper"
describe Admin::Proposals::ToggleSelectionComponent, :admin do
describe "aria-pressed attribute" do
it "is true for selected proposals" do
proposal = create(:proposal, :selected)
render_inline Admin::Proposals::ToggleSelectionComponent.new(proposal)
expect(page).to have_css "button[aria-pressed='true']"
end
it "is false for not selected proposals" do
proposal = create(:proposal)
render_inline Admin::Proposals::ToggleSelectionComponent.new(proposal)
expect(page).to have_css "button[aria-pressed='false']"
end
end
end

View File

@@ -11,18 +11,18 @@ describe "Admin collaborative legislation", :admin do
expect(page).to have_content(proposal.title)
expect(page).to have_content(proposal.id)
expect(page).to have_content(proposal.cached_votes_score)
expect(page).to have_content("Select")
expect(page).to have_content("No")
end
end
scenario "Selecting legislation proposals" do
proposal = create(:legislation_proposal, cached_votes_score: 10)
proposal = create(:legislation_proposal, title: "Add more accessibility tests")
visit admin_legislation_process_proposals_path(proposal.legislation_process_id)
click_button "Select"
click_button "Select Add more accessibility tests"
within "#legislation_proposal_#{proposal.id}" do
expect(page).to have_content("Selected")
expect(page).to have_content "Yes"
end
end

View File

@@ -22,31 +22,39 @@ describe "Admin proposals", :admin do
end
scenario "Select a proposal" do
proposal = create(:proposal)
proposal = create(:proposal, title: "Forbid door-to-door sales")
visit admin_proposals_path
within("#proposal_#{proposal.id}") { click_button "Select" }
within("#proposal_#{proposal.id}") do
expect(page).to have_content "No"
within("#proposal_#{proposal.id}") { expect(page).to have_button "Selected" }
click_button "Select Forbid door-to-door sales"
expect(page).to have_content "Yes"
end
refresh
within("#proposal_#{proposal.id}") { expect(page).to have_button "Selected" }
within("#proposal_#{proposal.id}") { expect(page).to have_content "Yes" }
end
scenario "Unselect a proposal" do
proposal = create(:proposal, :selected)
proposal = create(:proposal, :selected, title: "Allow door-to-door sales")
visit admin_proposals_path
within("#proposal_#{proposal.id}") { click_button "Selected" }
within("#proposal_#{proposal.id}") do
expect(page).to have_content "Yes"
within("#proposal_#{proposal.id}") { expect(page).to have_button "Select" }
click_button "Select Allow door-to-door sales"
expect(page).to have_content "No"
end
refresh
within("#proposal_#{proposal.id}") { expect(page).to have_button "Select" }
within("#proposal_#{proposal.id}") { expect(page).to have_content "No" }
end
end