From bd097335c828caf46649e2d52e8efc01463d7ce0 Mon Sep 17 00:00:00 2001
From: AshGDS <8880610+AshGDS@users.noreply.github.com>
Date: Tue, 14 Jan 2025 09:38:32 +0000
Subject: [PATCH] BREAKING Use component wrapper on attachment component

---
 CHANGELOG.md                                      |  4 ++++
 .../components/_attachment.html.erb               | 15 ++++++++-------
 .../components/docs/attachment.yml                |  5 +++--
 spec/components/attachment_spec.rb                |  2 +-
 4 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b925d08ff7..52d4e9a21f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@
   useful summary for people upgrading their application, not a replication
   of the commit log.
 
+## Unreleased
+
+* **BREAKING** Use component wrapper on attachment component ([PR #4545](https://github.com/alphagov/govuk_publishing_components/pull/4545))
+
 ## 48.0.0
 
 * Report cache status to RUM ([PR #4537](https://github.com/alphagov/govuk_publishing_components/pull/4537))
diff --git a/app/views/govuk_publishing_components/components/_attachment.html.erb b/app/views/govuk_publishing_components/components/_attachment.html.erb
index 0370d62efd..903e135799 100644
--- a/app/views/govuk_publishing_components/components/_attachment.html.erb
+++ b/app/views/govuk_publishing_components/components/_attachment.html.erb
@@ -6,12 +6,13 @@
   hide_opendocument_metadata ||= false
   hide_order_copy_link ||= false
   attributes = []
-  data_attributes ||= {}
+  url_data_attributes ||= {}
   details_ga4_attributes ||= {}
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
 
-  container_class_names = %w[gem-c-attachment]
-  container_class_names << shared_helper.get_margin_bottom if local_assigns.key?(:margin_bottom)
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-attachment")
+  component_helper.add_data_attribute({ module: "ga4-link-tracker" })
   ga4_link = { 'event_name': 'navigation', 'type': 'attachment' }
 
   case attachment.type
@@ -55,16 +56,16 @@
     )
   end
 
-  data_attributes[:ga4_link] = ga4_link
+  url_data_attributes[:ga4_link] = ga4_link
 %>
-<%= tag.section class: class_names(container_class_names), data: { module: "ga4-link-tracker" } do %>
+<%= tag.section(**component_helper.all_attributes) do %>
   <%= tag.div class: "gem-c-attachment__thumbnail govuk-!-display-none-print" do %>
     <%= link_to attachment.url,
                 class: "govuk-link",
                 target: target,
                 tabindex: "-1",
                 "aria-hidden": true,
-                data: data_attributes do %>
+                data: url_data_attributes do %>
       <% if attachment.thumbnail_url.present? %>
         <% image_tag(attachment.thumbnail_url, alt: "", class: "gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--custom") %>
       <% elsif attachment.html? %>
@@ -88,7 +89,7 @@
       <%= link_to attachment.title, attachment.url,
       class: "govuk-link gem-c-attachment__link",
       target: target,
-      data: data_attributes %>
+      data: url_data_attributes %>
     <% end %>
 
     <% if attachment.reference.present? %>
diff --git a/app/views/govuk_publishing_components/components/docs/attachment.yml b/app/views/govuk_publishing_components/components/docs/attachment.yml
index ca23e144a9..dfe0967ce2 100644
--- a/app/views/govuk_publishing_components/components/docs/attachment.yml
+++ b/app/views/govuk_publishing_components/components/docs/attachment.yml
@@ -17,6 +17,7 @@ shared_accessibility_criteria:
 accessibility_criteria: |
   The thumbnail image, and the link wrapping it, must not focusable or shown to
   screenreaders.
+uses_component_wrapper_helper: true
 examples:
   default:
     data:
@@ -89,7 +90,7 @@ examples:
       details_ga4_attributes: {
         index_section_count: 4
       }
-  with_data_attributes:
+  with_data_attributes_on_url:
     data:
       attachment:
         title: "Department for Transport information asset register"
@@ -97,7 +98,7 @@ examples:
         filename: department-for-transport-information-asset-register.csv
         content_type: application/pdf
         file_size: 20000
-      data_attributes:
+      url_data_attributes:
         gtm: "attachment-preview"
   with_margin_bottom:
     description: The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to no margin bottom.
diff --git a/spec/components/attachment_spec.rb b/spec/components/attachment_spec.rb
index eaef1617a2..aa1690e0e0 100644
--- a/spec/components/attachment_spec.rb
+++ b/spec/components/attachment_spec.rb
@@ -134,7 +134,7 @@ def component_name
         url: "attachment",
         content_type: "application/vnd.oasis.opendocument.spreadsheet",
       },
-      data_attributes: { gtm: "attachment-preview" },
+      url_data_attributes: { gtm: "attachment-preview" },
     )
 
     assert_select ".gem-c-attachment__thumbnail a.govuk-link[data-gtm='attachment-preview']"