Merge pull request #1956 from alphagov/remove-summary-action-list

Remove lists from summary list action links
alphagov · Mar 9, 2021 · 0085f57 · 0085f57
2 parents d225947 + dc094eb
commit 0085f57
Show file tree

Hide file tree

Showing 3 changed files with 173 additions and 34 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,7 @@
 
 ## Unreleased
 
+* Remove lists from summary action links ([PR #1956](https://github.com/alphagov/govuk_publishing_components/pull/1956))
 * Fix GOV.UK Frontend deprecation warning for component-guide print stylesheet ([PR #1961](https://github.com/alphagov/govuk_publishing_components/pull/1961))
 
 ## 24.4.1

diff --git a/app/views/govuk_publishing_components/components/_summary_list.html.erb b/app/views/govuk_publishing_components/components/_summary_list.html.erb
@@ -15,32 +15,51 @@
   <%= tag.div class: "gem-c-summary-list #{"govuk-summary-list--no-border" if borderless}", id: id do %>
     <% if title %>
       <%= content_tag(shared_helper.get_heading_level, title, class: "govuk-heading-#{heading_size} gem-c-summary-list__group-title") %>
-      <% if edit.any? || delete.any? %>
+
+      <% if edit.any? %>
+        <% edit_main_link = capture do %>
+          <% edit_section_link_text = edit[:link_text] || t("components.summary_list.edit") %>
+          <%= link_to edit.fetch(:href),
+                    class: "govuk-link",
+                    title: "#{edit_section_link_text} #{title}",
+                    data: edit.fetch(:data_attributes, {}) do %>
+            <%= edit_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if delete.any? %>
+        <% delete_main_link = capture do %>
+          <% delete_section_link_text = delete[:link_text] || t("components.summary_list.delete") %>
+          <%= link_to delete.fetch(:href),
+                    class: "govuk-link gem-link--destructive",
+                    title: "#{delete_section_link_text} #{title}",
+                    data: delete.fetch(:data_attributes, {}) do %>
+            <%= delete_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if edit_main_link && delete_main_link %>
         <%= tag.ul class: "govuk-summary-list__actions-list gem-c-summary-list__group-actions-list" do %>
           <%- if edit.any? %>
-            <% edit_section_link_text = edit[:link_text] || t("components.summary_list.edit") %>
             <%= tag.li class: "govuk-summary-list__actions-list-item" do -%>
-              <%= link_to edit.fetch(:href),
-                        class: "govuk-link",
-                        title: "#{edit_section_link_text} #{title}",
-                        data: edit.fetch(:data_attributes, {}) do %>
-                <%= edit_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
-              <% end %>
+              <%= edit_main_link %>
             <% end %>
           <% end %>
           <% if delete.any? %>
-            <% delete_section_link_text = delete[:link_text] || t("components.summary_list.delete") %>
             <%= tag.li class: "govuk-summary-list__actions-list-item" do -%>
-              <%= link_to delete.fetch(:href),
-                        class: "govuk-link gem-link--destructive",
-                        title: "#{delete_section_link_text} #{title}",
-                        data: delete.fetch(:data_attributes, {}) do %>
-                <%= delete_section_link_text %><%= tag.span " #{title}", class: "govuk-visually-hidden" -%>
-              <% end %>
+              <%= delete_main_link %>
             <% end %>
           <% end %>
         <% end %>
+      <% else %>
+        <%= tag.div class: "govuk-summary-list__actions-list gem-c-summary-list__group-actions-list" do %>
+          <%= edit_main_link %>
+          <%= delete_main_link %>
+        <% end %>
       <% end %>
+
     <% end %>
 
     <% if items.any? %>
@@ -51,34 +70,52 @@
             <%= tag.dt item[:field], class: "govuk-summary-list__key" %>
             <%= tag.dd item[:value], class: "govuk-summary-list__value" %>
 
-            <% if item.fetch(:edit, {}).any? || item.fetch(:delete, {}).any? %>
+            <% if item.fetch(:edit, {}).any? %>
+              <% edit_link = capture do %>
+                <% edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit") %>
+                <%= link_to item[:edit].fetch(:href),
+                            class: "govuk-link",
+                            title: "#{edit_link_text} #{item[:field]}",
+                            data: item[:edit].fetch(:data_attributes, {}) do %>
+                  <%= edit_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if item.fetch(:delete, {}).any? %>
+              <% delete_link = capture do %>
+                <% delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete") %>
+                <%= link_to item[:delete].fetch(:href),
+                            class: "govuk-link gem-link--destructive",
+                            title: "#{delete_link_text} #{item[:field]}",
+                            data: item[:delete].fetch(:data_attributes, {}) do %>
+                  <%= delete_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if edit_link && delete_link %>
               <%= tag.dd class: "govuk-summary-list__actions" do %>
                 <%= tag.ul class: "govuk-summary-list__actions-list" do %>
                   <% if item.fetch(:edit, {}).any? %>
                     <%= tag.li class: "govuk-summary-list__actions-list-item" do %>
-                      <% edit_link_text = item[:edit][:link_text] || t("components.summary_list.edit") %>
-                      <%= link_to item[:edit].fetch(:href),
-                                  class: "govuk-link",
-                                  title: "#{edit_link_text} #{item[:field]}",
-                                  data: item[:edit].fetch(:data_attributes, {}) do %>
-                        <%= edit_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
-                      <% end %>
+                      <%= edit_link %>
                     <% end %>
                   <% end %>
                   <% if item.fetch(:delete, {}).any? %>
                     <%= tag.li class: "govuk-summary-list__actions-list-item" do %>
-                      <% delete_link_text = item[:delete][:link_text] || t("components.summary_list.delete") %>
-                      <%= link_to item[:delete].fetch(:href),
-                                  class: "govuk-link gem-link--destructive",
-                                  title: "#{delete_link_text} #{item[:field]}",
-                                  data: item[:delete].fetch(:data_attributes, {}) do %>
-                        <%= delete_link_text %><%= tag.span " #{item[:field]}", class: "govuk-visually-hidden" -%>
-                      <% end %>
+                      <%= delete_link %>
                     <% end %>
                   <% end %>
                 <% end %>
               <% end %>
+            <% else %>
+              <%= tag.dd class: "govuk-summary-list__actions" do %>
+                <%= edit_link %>
+                <%= delete_link %>
+              <% end %>
             <% end %>
+
           <% end %>
         <% end %>
       <% end %>

diff --git a/spec/components/summary_list_spec.rb b/spec/components/summary_list_spec.rb
@@ -85,7 +85,7 @@ def component_name
     assert_select ".govuk-summary-list__value", text: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
   end
 
-  it "renders items with edit action" do
+  it "renders items with only the edit action" do
     render_component(
       items: [
         {
@@ -102,10 +102,10 @@ def component_name
     )
     assert_select ".govuk-summary-list__key", text: "Title"
     assert_select ".govuk-summary-list__value", text: "Ethical standards for public service providers"
-    assert_select '.govuk-summary-list__actions-list-item .govuk-link[title="Change Title"][href="#edit-title"][data-gtm="edit-title"]', text: "Change Title"
+    assert_select 'dd.govuk-summary-list__actions .govuk-link[title="Change Title"][href="#edit-title"][data-gtm="edit-title"]', text: "Change Title"
   end
 
-  it "renders items with delete action" do
+  it "renders items with only the delete action" do
     render_component(
       items: [
         {
@@ -122,7 +122,28 @@ def component_name
     )
     assert_select ".govuk-summary-list__key", text: "Title"
     assert_select ".govuk-summary-list__value", text: "Ethical standards for public service providers"
-    assert_select '.govuk-summary-list__actions-list-item .govuk-link.gem-link--destructive[title="Delete Title"][href="#delete-title"][data-gtm="delete-title"]', text: "Delete Title"
+    assert_select 'dd.govuk-summary-list__actions .govuk-link.gem-link--destructive[title="Delete Title"][href="#delete-title"][data-gtm="delete-title"]', text: "Delete Title"
+  end
+
+  it "renders items with both the edit and the delete action" do
+    render_component(
+      items: [
+        {
+          field: "Title",
+          value: "Ethical standards for public service providers",
+          edit: {
+            href: "#edit-title",
+          },
+          delete: {
+            href: "#delete-title",
+          },
+        },
+      ],
+    )
+    assert_select ".govuk-summary-list__key", text: "Title"
+    assert_select ".govuk-summary-list__value", text: "Ethical standards for public service providers"
+    assert_select 'li.govuk-summary-list__actions-list-item .govuk-link[title="Change Title"][href="#edit-title"]', text: "Change Title"
+    assert_select 'li.govuk-summary-list__actions-list-item .govuk-link.gem-link--destructive[title="Delete Title"][href="#delete-title"]', text: "Delete Title"
   end
 
   it "renders items with custom text for edit and delete action" do
@@ -145,4 +166,84 @@ def component_name
     assert_select '.govuk-summary-list__actions-list-item .govuk-link[title="Edit Title"][href="#edit-title"]', text: "Edit Title"
     assert_select '.govuk-summary-list__actions-list-item .govuk-link.gem-link--destructive[title="Remove Title"][href="#delete-title"]', text: "Remove Title"
   end
+
+  it "renders the edit action on section" do
+    render_component(
+      title: "Title",
+      items: [
+        {
+          field: "Title",
+          value: "Ethical standards for public service providers",
+        },
+      ],
+      edit: {
+        href: "edit-title",
+      },
+    )
+    assert_select 'div.govuk-summary-list__actions-list .govuk-link[title="Change Title"][href="edit-title"]', text: "Change Title"
+  end
+
+  it "renders the delete action on section" do
+    render_component(
+      title: "Title",
+      items: [
+        {
+          field: "Title",
+          value: "Ethical standards for public service providers",
+        },
+      ],
+      delete: {
+        href: "delete-title",
+      },
+    )
+    assert_select 'div.govuk-summary-list__actions-list .govuk-link[title="Delete Title"][href="delete-title"]', text: "Delete Title"
+  end
+
+  it "renders the edit and delete actions on section" do
+    render_component(
+      title: "Title",
+      items: [
+        {
+          field: "Title",
+          value: "Ethical standards for public service providers",
+        },
+      ],
+      edit: {
+        href: "edit-title",
+        data_attributes: {
+          gtm: "edit-title",
+        },
+      },
+      delete: {
+        href: "delete-title",
+        data_attributes: {
+          gtm: "delete-title",
+        },
+      },
+    )
+    assert_select 'ul.govuk-summary-list__actions-list .govuk-summary-list__actions-list-item .govuk-link[title="Change Title"][href="edit-title"][data-gtm="edit-title"]', text: "Change Title"
+    assert_select 'ul.govuk-summary-list__actions-list .govuk-summary-list__actions-list-item .govuk-link[title="Delete Title"][href="delete-title"][data-gtm="delete-title"]', text: "Delete Title"
+  end
+
+  it "renders the edit and delete actions on section with custom text" do
+    render_component(
+      title: "Title",
+      items: [
+        {
+          field: "Title",
+          value: "Ethical standards for public service providers",
+        },
+      ],
+      edit: {
+        href: "edit-title",
+        link_text: "Edit",
+      },
+      delete: {
+        href: "delete-title",
+        link_text: "Destroy",
+      },
+    )
+    assert_select 'ul.govuk-summary-list__actions-list .govuk-summary-list__actions-list-item .govuk-link[title="Edit Title"][href="edit-title"]', text: "Edit Title"
+    assert_select 'ul.govuk-summary-list__actions-list .govuk-summary-list__actions-list-item .govuk-link[title="Destroy Title"][href="delete-title"]', text: "Destroy Title"
+  end
 end