Merge pull request #4530 from alphagov/translation-nav-component-wrapper

Use component wrapper on translation nav component

CHANGELOG.md

@@ -13,6 +13,7 @@
 * Use component wrapper on success alert component ([PR #4527](https://github.com/alphagov/govuk_publishing_components/pull/4527))
 * Use component wrapper on summary card component ([PR #4528](https://github.com/alphagov/govuk_publishing_components/pull/4528))
 * Use component wrapper on summary list component ([PR #4529](https://github.com/alphagov/govuk_publishing_components/pull/4529))
+* Use component wrapper on translation nav component ([PR #4530](https://github.com/alphagov/govuk_publishing_components/pull/4530))
 
 ## 47.0.0
 

app/views/govuk_publishing_components/components/_translation_nav.html.erb

@@ -4,12 +4,14 @@
   brand ||= false
   brand_helper = GovukPublishingComponents::AppHelpers::BrandHelper.new(brand)
   translation_helper = GovukPublishingComponents::Presenters::TranslationNavHelper.new(local_assigns)
+
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_role("navigation")
+  component_helper.add_class("gem-c-translation-nav govuk-!-display-none-print #{translation_helper.classes} #{brand_helper.brand_class}")
+  component_helper.add_aria_attribute({ label: t("common.translations") })
 %>
 <% if translation_helper.has_translations? %>
-  <nav role="navigation"
-    class="gem-c-translation-nav govuk-!-display-none-print <%= translation_helper.classes %> <%= brand_helper.brand_class %>"
-    aria-label="<%= t("common.translations") %>"
-  >
+  <%= tag.nav(**component_helper.all_attributes) do %>
     <ul class="gem-c-translation-nav__list">
       <% translation_helper.translations.each.with_index do |translation, i| %>
         <li class="gem-c-translation-nav__list-item">
@@ -27,5 +29,5 @@
         </li>
       <% end %>
     </ul>
-  </nav>
+  <% end %>
 <% end %>

app/views/govuk_publishing_components/components/docs/translation_nav.yml

@@ -16,6 +16,7 @@ shared_accessibility_criteria:
   - link
 accessibility_excluded_rules:
   - landmark-unique # aria-label attributes will be duplicated in component examples list
+uses_component_wrapper_helper: true
 examples:
   default:
     data: