From 698fc753ba77232d0f6bea63ebd746e883e71f6e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Thu, 2 Feb 2023 21:11:57 +0100
Subject: [PATCH] Fix invalid HTML in budget stats tables

The <th> elements should be inside <tr> elements.

Since we're changing this code, we're also adding <thead> and <tbody>
tags because that's what we usually do and it makes it easier to select
<tr> tags from either the table head or the table body using CSS or
JavaScript.
---
 .../stats/budget_balloting_component.html.erb | 52 +++++++++++--------
 .../admin/stats/budget_supporting.html.erb    | 30 ++++++-----
 2 files changed, 48 insertions(+), 34 deletions(-)

diff --git a/app/components/admin/stats/budget_balloting_component.html.erb b/app/components/admin/stats/budget_balloting_component.html.erb
index 1bb7edb24..4d118b732 100644
--- a/app/components/admin/stats/budget_balloting_component.html.erb
+++ b/app/components/admin/stats/budget_balloting_component.html.erb
@@ -27,31 +27,39 @@
 </div>
 
 <table class="investment-projects-summary">
-  <th colspan="2"><%= t("admin.stats.budget_balloting.votes_per_heading") %></th>
+  <thead>
+    <tr><th colspan="2"><%= t("admin.stats.budget_balloting.votes_per_heading") %></th></tr>
+  </thead>
 
-  <% vote_count_by_heading.each do |heading_name, count| %>
-    <tr id="vote_count_<%= heading_name.parameterize %>">
-      <td class="name">
-        <%= heading_name %>
-      </td>
-      <td class="name">
-        <%= number_with_delimiter count %>
-      </td>
-    </tr>
-  <% end %>
+  <tbody>
+    <% vote_count_by_heading.each do |heading_name, count| %>
+      <tr id="vote_count_<%= heading_name.parameterize %>">
+        <td class="name">
+          <%= heading_name %>
+        </td>
+        <td class="name">
+          <%= number_with_delimiter count %>
+        </td>
+      </tr>
+    <% end %>
+  </tbody>
 </table>
 
 <table class="investment-projects-summary">
-  <th colspan="2"><%= t("admin.stats.budget_balloting.participants_per_district") %></th>
+  <thead>
+    <tr><th colspan="2"><%= t("admin.stats.budget_balloting.participants_per_district") %></th></tr>
+  </thead>
 
-  <% user_count_by_heading.each do |heading_name, count| %>
-    <tr id="user_count_<%= heading_name.parameterize %>">
-      <td class="name">
-        <%= heading_name %>
-      </td>
-      <td class="name">
-        <%= number_with_delimiter count %>
-      </td>
-    </tr>
-  <% end %>
+  <tbody>
+    <% user_count_by_heading.each do |heading_name, count| %>
+      <tr id="user_count_<%= heading_name.parameterize %>">
+        <td class="name">
+          <%= heading_name %>
+        </td>
+        <td class="name">
+          <%= number_with_delimiter count %>
+        </td>
+      </tr>
+    <% end %>
+  </tbody>
 </table>
diff --git a/app/views/admin/stats/budget_supporting.html.erb b/app/views/admin/stats/budget_supporting.html.erb
index 770029969..8affe4cd2 100644
--- a/app/views/admin/stats/budget_supporting.html.erb
+++ b/app/views/admin/stats/budget_supporting.html.erb
@@ -33,17 +33,23 @@
 <%= render "graph", name: "user_supported_budgets", event: "", count: @user_count %>
 
 <table class="investment-projects-summary">
-  <th><%= t("admin.stats.budget_supporting.headings") %></th>
-  <th><%= t("admin.stats.budget_supporting.users") %></th>
-
-  <% @voters_in_heading.each do |heading, count| %>
-    <tr id="<%= dom_id(heading) %>">
-      <td class="name">
-        <%= heading.name %>
-      </td>
-      <td class="name">
-        <%= number_with_delimiter count %>
-      </td>
+  <thead>
+    <tr>
+      <th><%= t("admin.stats.budget_supporting.headings") %></th>
+      <th><%= t("admin.stats.budget_supporting.users") %></th>
     </tr>
-  <% end %>
+  </thead>
+
+  <tbody>
+    <% @voters_in_heading.each do |heading, count| %>
+      <tr id="<%= dom_id(heading) %>">
+        <td class="name">
+          <%= heading.name %>
+        </td>
+        <td class="name">
+          <%= number_with_delimiter count %>
+        </td>
+      </tr>
+    <% end %>
+  </tbody>
 </table>