Use buttons instead of links to hide content

We're continuing to replace links with buttons, for the reasons
explained in commit 5311daadf.

Since we're using the admin action component, we can also simplify the
logic handling the confirmation message.

In order to avoid duplicate IDs when generating buttons to block the
same author more than once in a page, we're including the record dom_id
in the ID of the button to block an author.

app/assets/stylesheets/application.scss

@@ -30,6 +30,7 @@
 @import "legislation";
 @import "legislation_process";
 @import "legislation_process_form";
+@import "moderation_actions";
 @import "notification_item";
 @import "community";
 @import "stats";

app/assets/stylesheets/moderation_actions.scss

@@ -0,0 +1,10 @@
+.moderation-actions {
+  &,
+  form {
+    display: inline;
+  }
+
+  button {
+    @include link;
+  }
+}

app/components/shared/moderation_actions_component.html.erb

@@ -1,12 +1,25 @@
-<span class="moderation-actions">
+<div class="moderation-actions">
   <% if can? :hide, record %>
-    <%= link_to t("admin.actions.hide").capitalize, hide_path,
-                method: :put, remote: true, data: { confirm: confirm_hide_text } %>
+    <%= render Admin::ActionComponent.new(
+      :hide,
+      record,
+      path: hide_path,
+      method: :put,
+      remote: true,
+      confirm: true
+    ) %>
   <% end %>
 
-  <% if can? :hide, record.author %>
+  <% if can? :hide, author %>
     <%= raw separator %>
-    <%= link_to t("admin.actions.block_author").capitalize, block_moderation_user_path(record.author_id),
-                method: :put, data: { confirm: confirm_block_author_text } %>
+
+    <%= render Admin::ActionComponent.new(
+      :block_author,
+      author,
+      path: block_moderation_user_path(author),
+      id: dom_id(author, "#{dom_id(record)}_block_author"),
+      method: :put,
+      confirm: true
+    ) %>
   <% end %>
-</span>
+</div>

app/components/shared/moderation_actions_component.rb

@@ -7,23 +7,19 @@ class Shared::ModerationActionsComponent < ApplicationComponent
   end
 
   def render?
-    can?(:hide, record) || can?(:hide, record.author)
+    can?(:hide, record) || can?(:hide, author)
   end
 
   private
 
+    def author
+      record.author
+    end
+
     def hide_path
       polymorphic_path([:moderation, record], action: :hide)
     end
 
-    def confirm_hide_text
-      t("admin.actions.confirm_action", action: t("admin.actions.hide"), name: record.human_name)
-    end
-
-    def confirm_block_author_text
-      t("admin.actions.confirm_action", action: t("admin.actions.block_author"), name: record.author.name)
-    end
-
     def separator
       if record.is_a?(Comment)
         "&nbsp;&bull;&nbsp;"

spec/components/shared/moderation_actions_component_spec.rb

@@ -4,13 +4,15 @@ describe Shared::ModerationActionsComponent do
   include Rails.application.routes.url_helpers
   before { sign_in(create(:administrator).user) }
 
-  describe "Hide link" do
+  describe "Hide button" do
     it "is shown for debates" do
       debate = create(:debate)
 
       render_inline Shared::ModerationActionsComponent.new(debate)
 
-      expect(page).to have_link "Hide", href: hide_moderation_debate_path(debate)
+      page.find("form[action='#{hide_moderation_debate_path(debate)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
 
     it "is shown for proposals" do
@@ -18,7 +20,9 @@ describe Shared::ModerationActionsComponent do
 
       render_inline Shared::ModerationActionsComponent.new(proposal)
 
-      expect(page).to have_link "Hide", href: hide_moderation_proposal_path(proposal)
+      page.find("form[action='#{hide_moderation_proposal_path(proposal)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
 
     it "is shown for proposal notifications" do
@@ -26,7 +30,9 @@ describe Shared::ModerationActionsComponent do
 
       render_inline Shared::ModerationActionsComponent.new(notification)
 
-      expect(page).to have_link "Hide", href: hide_moderation_proposal_notification_path(notification)
+      page.find("form[action='#{hide_moderation_proposal_notification_path(notification)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
 
     it "is shown for comments" do
@@ -34,7 +40,9 @@ describe Shared::ModerationActionsComponent do
 
       render_inline Shared::ModerationActionsComponent.new(comment)
 
-      expect(page).to have_link "Hide", href: hide_moderation_comment_path(comment)
+      page.find("form[action='#{hide_moderation_comment_path(comment)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
 
     it "is shown for budget investments" do
@@ -42,7 +50,9 @@ describe Shared::ModerationActionsComponent do
 
       render_inline Shared::ModerationActionsComponent.new(investment)
 
-      expect(page).to have_link "Hide", href: hide_moderation_budget_investment_path(investment)
+      page.find("form[action='#{hide_moderation_budget_investment_path(investment)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
 
     it "is shown for legislation proposals" do
@@ -50,7 +60,9 @@ describe Shared::ModerationActionsComponent do
 
       render_inline Shared::ModerationActionsComponent.new(proposal)
 
-      expect(page).to have_link "Hide", href: hide_moderation_legislation_proposal_path(proposal)
+      page.find("form[action='#{hide_moderation_legislation_proposal_path(proposal)}']") do
+        expect(page).to have_button "Hide"
+      end
     end
   end
 end

spec/system/admin/activity_spec.rb

@@ -14,7 +14,7 @@ describe "Admin activity" do
       visit proposal_path(proposal)
 
       within("#proposal_#{proposal.id}") do
-        accept_confirm("Are you sure? Hide \"#{proposal.title}\"") { click_link "Hide" }
+        accept_confirm("Are you sure? Hide \"#{proposal.title}\"") { click_button "Hide" }
       end
       expect(page).to have_css("#proposal_#{proposal.id}.faded")
 
@@ -82,7 +82,7 @@ describe "Admin activity" do
       visit debate_path(debate)
 
       within("#debate_#{debate.id}") do
-        accept_confirm("Are you sure? Hide \"#{debate.title}\"") { click_link "Hide" }
+        accept_confirm("Are you sure? Hide \"#{debate.title}\"") { click_button "Hide" }
       end
       expect(page).to have_css("#debate_#{debate.id}.faded")
 
@@ -150,7 +150,7 @@ describe "Admin activity" do
       visit debate_path(debate)
 
       within("#comment_#{comment.id}") do
-        accept_confirm("Are you sure? Hide \"#{comment.body}\"") { click_link "Hide" }
+        accept_confirm("Are you sure? Hide \"#{comment.body}\"") { click_button "Hide" }
         expect(page).to have_css(".faded")
       end
 
@@ -217,7 +217,7 @@ describe "Admin activity" do
       visit proposal_path(proposal)
 
       within("#proposal_#{proposal.id}") do
-        accept_confirm("Are you sure? Block author \"#{proposal.author.name}\"") { click_link "Block author" }
+        accept_confirm("Are you sure? Block author \"#{proposal.author.name}\"") { click_button "Block author" }
 
         expect(page).to have_current_path(proposals_path)
       end

spec/system/admin/hidden_comments_spec.rb

@@ -13,7 +13,7 @@ describe "Admin hidden comments", :admin do
     visit proposal_path(proposal)
 
     within("#proposal_#{proposal.id}") do
-      accept_confirm("Are you sure? Block author \"#{proposal.author.name}\"") { click_link "Block author" }
+      accept_confirm("Are you sure? Block author \"#{proposal.author.name}\"") { click_button "Block author" }
     end
 
     expect(page).to have_current_path proposals_path

spec/system/moderation/budget_investments_spec.rb

@@ -10,7 +10,7 @@ describe "Moderate budget investments" do
     login_as(mod.user)
     visit budget_investment_path(budget, investment)
 
-    accept_confirm("Are you sure? Hide \"#{investment.title}\"") { click_link "Hide" }
+    accept_confirm("Are you sure? Hide \"#{investment.title}\"") { click_button "Hide" }
 
     expect(page).to have_css(".faded", count: 2)
 
@@ -23,7 +23,7 @@ describe "Moderate budget investments" do
     login_as(mod.user)
     visit budget_investment_path(budget, investment)
 
-    accept_confirm("Are you sure? Block author \"#{investment.author.name}\"") { click_link "Block author" }
+    accept_confirm("Are you sure? Block author \"#{investment.author.name}\"") { click_button "Block author" }
 
     expect(page).to have_current_path(budget_investments_path(budget))
     expect(page).not_to have_content(investment.title)
@@ -36,8 +36,8 @@ describe "Moderate budget investments" do
     visit budget_investment_path(budget, investment)
 
     within "#budget_investment_#{investment.id}" do
-      expect(page).not_to have_link("Hide")
-      expect(page).not_to have_link("Block author")
+      expect(page).not_to have_button "Hide"
+      expect(page).not_to have_button "Block author"
     end
   end
 

spec/system/moderation/comments_spec.rb

@@ -11,7 +11,7 @@ describe "Moderate comments" do
     visit debate_path(comment.commentable)
 
     within("#comment_#{comment.id}") do
-      accept_confirm("Are you sure? Hide") { click_link "Hide" }
+      accept_confirm("Are you sure? Hide") { click_button "Hide" }
       expect(page).to have_css(".comment .faded")
     end
 
@@ -31,8 +31,8 @@ describe "Moderate comments" do
     visit debate_path(comment.commentable)
 
     within("#comment_#{comment.id}") do
-      expect(page).not_to have_link("Hide")
-      expect(page).not_to have_link("Block author")
+      expect(page).not_to have_button "Hide"
+      expect(page).not_to have_button "Block author"
     end
   end
 

spec/system/moderation/debates_spec.rb

@@ -11,7 +11,7 @@ describe "Moderate debates" do
     visit debate_path(debate)
 
     within("#debate_#{debate.id}") do
-      accept_confirm("Are you sure? Hide") { click_link "Hide" }
+      accept_confirm("Are you sure? Hide") { click_button "Hide" }
     end
 
     expect(find("div#debate_#{debate.id}.faded")).to have_text debate.title
@@ -30,8 +30,8 @@ describe "Moderate debates" do
     visit debate_path(debate)
 
     within("#debate_#{debate.id}") do
-      expect(page).not_to have_link("Hide")
-      expect(page).not_to have_link("Block author")
+      expect(page).not_to have_button "Hide"
+      expect(page).not_to have_button "Block author"
     end
   end
 

spec/system/moderation/legislation_proposals_spec.rb

@@ -11,7 +11,7 @@ describe "Moderate legislation proposals" do
     visit legislation_process_proposal_path(legislation_process, legislation_proposal)
 
     within("#legislation_proposal_#{legislation_proposal.id}") do
-      accept_confirm("Are you sure? Hide \"#{legislation_proposal.title}\"") { click_link "Hide" }
+      accept_confirm("Are you sure? Hide \"#{legislation_proposal.title}\"") { click_button "Hide" }
     end
 
     expect(page).to have_css("#legislation_proposal_#{legislation_proposal.id}.faded")
@@ -21,6 +21,6 @@ describe "Moderate legislation proposals" do
     visit legislation_process_proposals_path(legislation_process)
 
     expect(page).to have_css(".proposal-content", count: 0)
-    expect(page).not_to have_link("Hide")
+    expect(page).not_to have_button "Hide"
   end
 end

spec/system/moderation/proposal_notifications_spec.rb

@@ -12,7 +12,7 @@ describe "Moderate proposal notifications" do
     click_link "Notifications (1)"
 
     within("#proposal_notification_#{proposal_notification.id}") do
-      accept_confirm("Are you sure? Hide") { click_link "Hide" }
+      accept_confirm("Are you sure? Hide") { click_button "Hide" }
     end
 
     expect(page).to have_css("#proposal_notification_#{proposal_notification.id}.faded")
@@ -34,8 +34,8 @@ describe "Moderate proposal notifications" do
     click_link "Notifications (1)"
 
     within("#proposal_notification_#{proposal_notification.id}") do
-      expect(page).not_to have_link("Hide")
-      expect(page).not_to have_link("Block author")
+      expect(page).not_to have_button "Hide"
+      expect(page).not_to have_button "Block author"
     end
   end
 

spec/system/moderation/proposals_spec.rb

@@ -10,7 +10,7 @@ describe "Moderate proposals" do
     visit proposal_path(proposal)
 
     within("#proposal_#{proposal.id}") do
-      accept_confirm("Are you sure? Hide") { click_link "Hide" }
+      accept_confirm("Are you sure? Hide") { click_button "Hide" }
     end
 
     expect(page).to have_css("#proposal_#{proposal.id}.faded")
@@ -29,8 +29,8 @@ describe "Moderate proposals" do
     visit proposal_path(proposal)
 
     within("#proposal_#{proposal.id}") do
-      expect(page).to have_link("Hide")
-      expect(page).not_to have_link("Block author")
+      expect(page).to have_button "Hide"
+      expect(page).not_to have_button "Block author"
     end
   end
 

spec/system/moderation/users_spec.rb

@@ -24,7 +24,7 @@ describe "Moderate users" do
     visit debate_path(debate1)
 
     within("#debate_#{debate1.id}") do
-      accept_confirm("Are you sure? Block author \"#{debate1.author.name}\"") { click_link "Block author" }
+      accept_confirm("Are you sure? Block author \"#{debate1.author.name}\"") { click_button "Block author" }
     end
 
     expect(page).to have_current_path(debates_path)