Append no-actions class to rows without actions

See https://design-system.service.gov.uk/components/summary-list/#showing-rows-with-and-without-actions This ensures that the bottom border is drawn correctly in some browsers, as well as ensures that items without actions span the full width of the component.
alphagov · Nov 7, 2024 · 6e88bad · 6e88bad
1 parent 5a92892
commit 6e88bad
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 1 deletion.
diff --git a/app/views/govuk_publishing_components/components/_summary_card.html.erb b/app/views/govuk_publishing_components/components/_summary_card.html.erb
@@ -28,7 +28,11 @@
         <%= tag.div class: "govuk-summary-card__content" do %>
           <%= tag.dl class: "govuk-summary-list" do %>
             <% rows.each do |row| %>
-              <%= tag.div class: "govuk-summary-list__row", data: row[:data] do %>
+              <%
+                row_classes = "govuk-summary-list__row"
+                row_classes << " govuk-summary-list__row--no-actions" if row[:actions].blank?
+              %>
+              <%= tag.div class: row_classes, data: row[:data] do %>
                 <%= tag.dt class: "govuk-summary-list__key" do %>
                   <%= row[:key] %>
                 <% end %>

diff --git a/spec/components/summary_card_spec.rb b/spec/components/summary_card_spec.rb
@@ -169,4 +169,44 @@ def component_name
 
     assert_select ".govuk-summary-list__row[data-module='something']", text: /One/
   end
+
+  it "appends a no-actions class to rows without actions" do
+    render_component(
+      title: "Title",
+      rows: [
+        {
+          key: "One",
+          value: "Value 1",
+          actions: [
+            {
+              label: "View",
+              href: "#1",
+            },
+          ],
+        },
+        {
+          key: "Two",
+          value: "Value 2",
+        },
+        {
+          key: "Three",
+          value: "Value 3",
+        },
+      ],
+    )
+
+    assert_select ".govuk-summary-list__row", 3
+    assert_select ".govuk-summary-list__row:not(.govuk-summary-list__row--no-actions)", 1
+    assert_select ".govuk-summary-list__row.govuk-summary-list__row--no-actions", 2
+
+    assert_select ".govuk-summary-list__row:not(.govuk-summary-list__row--no-actions) .govuk-summary-list__key", text: "One"
+    assert_select ".govuk-summary-list__row:not(.govuk-summary-list__row--no-actions) .govuk-summary-list__value", text: "Value 1"
+    assert_select '.govuk-summary-list__row:not(.govuk-summary-list__row--no-actions) .govuk-link[href="#1"]', text: "View One"
+
+    assert_select ".govuk-summary-list__row.govuk-summary-list__row--no-actions .govuk-summary-list__key", text: "Two"
+    assert_select ".govuk-summary-list__row.govuk-summary-list__row--no-actions .govuk-summary-list__value", text: "Value 2"
+
+    assert_select ".govuk-summary-list__row.govuk-summary-list__row--no-actions .govuk-summary-list__key", text: "Three"
+    assert_select ".govuk-summary-list__row.govuk-summary-list__row--no-actions .govuk-summary-list__value", text: "Value 3"
+  end
 end