From 785b48d7dd19b9f0627387a9ff7cd7b7c9c8b831 Mon Sep 17 00:00:00 2001
From: AshGDS <8880610+AshGDS@users.noreply.github.com>
Date: Mon, 6 Jan 2025 14:34:45 +0000
Subject: [PATCH] Use component wrapper on step nav header component

---
 .../components/_step_by_step_nav_header.html.erb       | 10 +++++-----
 .../components/docs/step_by_step_nav_header.yml        |  1 +
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/app/views/govuk_publishing_components/components/_step_by_step_nav_header.html.erb b/app/views/govuk_publishing_components/components/_step_by_step_nav_header.html.erb
index fd066cbbf5..75c5fb73ab 100644
--- a/app/views/govuk_publishing_components/components/_step_by_step_nav_header.html.erb
+++ b/app/views/govuk_publishing_components/components/_step_by_step_nav_header.html.erb
@@ -10,10 +10,10 @@
   ]
   breadcrumb_presenter = GovukPublishingComponents::Presenters::Breadcrumbs.new(breadcrumbs)
 
-  data = {}
-  data[:module] = "ga4-link-tracker" unless disable_ga4
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
 
   unless disable_ga4
+    component_helper.add_data_attribute({ module: "ga4-link-tracker" })
     ga4_data = {
       event_name: "navigation",
       type: "super breadcrumb",
@@ -23,15 +23,15 @@
   end
 
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
-  classes = %w[gem-c-step-nav-header]
-  classes << shared_helper.get_margin_bottom if local_assigns[:margin_bottom]
+  component_helper.add_class("gem-c-step-nav-header")
+  component_helper.add_class(shared_helper.get_margin_bottom) if local_assigns[:margin_bottom]
 %>
 <% if title %>
   <script type="application/ld+json">
     <%= raw JSON.pretty_generate(breadcrumb_presenter.structured_data) %>
   </script>
 
-  <%= tag.div(class: classes, data: data) do %>
+  <%= tag.div(**component_helper.all_attributes) do %>
     <strong class="gem-c-step-nav-header__part-of">Part of</strong>
     <% if path %>
       <a href="<%= path %>"
diff --git a/app/views/govuk_publishing_components/components/docs/step_by_step_nav_header.yml b/app/views/govuk_publishing_components/components/docs/step_by_step_nav_header.yml
index 83075597fc..1ac1338a52 100644
--- a/app/views/govuk_publishing_components/components/docs/step_by_step_nav_header.yml
+++ b/app/views/govuk_publishing_components/components/docs/step_by_step_nav_header.yml
@@ -12,6 +12,7 @@ accessibility_criteria: |
   Always place the step by step navigation header at the top of a page, before the `<main>` element. Placing the component here means that the "Skip to main content" link allows the user to skip all navigation links, including the step by step navigation header.
 shared_accessibility_criteria:
   - link
+uses_component_wrapper_helper: true
 examples:
   default:
     data: