diff --git a/CHANGELOG.md b/CHANGELOG.md index 9679c38eca..5c29889e5c 100644 --- 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 index b857876d05..658c622535 100644 --- 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 index 586e3ff540..09ce6918e9 100644 --- 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