Use section break helper

Gemfile.lock

@@ -174,8 +174,9 @@ GEM
     ffi (1.15.5)
     globalid (1.0.0)
       activesupport (>= 5.0)
-    govuk-components (3.0.4)
+    govuk-components (3.0.5)
       activemodel (>= 6.1)
+      html-attributes-utils (~> 0.9.0)
       railties (>= 6.1)
       view_component (~> 2.49.1)
     govuk_design_system_formbuilder (3.0.3)

app/views/case_logs/index.html.erb

@@ -14,7 +14,7 @@
   <%= render partial: "log_filters" %>
   <div class="app-filter-layout__content">
     <%= render SearchComponent.new(current_user:, search_label: "Search by log ID, tenant code, property reference or postcode", value: @searched) %>
-    <hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+    <%= govuk_section_break(visible: true, size: "m") %>
     <%= render partial: "log_list", locals: { case_logs: @case_logs, title: "Logs", pagy: @pagy, searched: @searched, item_label:, total_count: @total_count } %>
     <%== render partial: "pagy/nav", locals: { pagy: @pagy, item_name: "logs" } %>
   </div>

app/views/form/page.html.erb

@@ -31,7 +31,7 @@
       <% @page.non_conditional_questions.map do |question| %>
         <div id="<%= question.id %>_div" <%= display_question_key_div(@page, question) %>>
           <% if question.read_only? %>
-            <hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+            <%= govuk_section_break(visible: true, size: "m") %>
           <% end %>
           <% if question.type == "interruption_screen" %>
             <%= render partial: "form/#{question.type}_question", locals: { question:, caption_text: @subsection.label, page_header: @page.header, case_log: @case_log, title_text: @page.title_text, informative_text: @page.informative_text, form: @form, f:, conditional: false } %>

app/views/organisations/index.html.erb

@@ -13,7 +13,7 @@
 
 <%= render SearchComponent.new(current_user:, search_label: "Search by organisation name", value: @searched) %>
 
-<hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+<%= govuk_section_break(visible: true, size: "m") %>
 
 <%= render partial: "organisation_list", locals: { organisations: @organisations, title: "Organisations", pagy: @pagy, searched: @searched, item_label:, total_count: @total_count } %>
 <%== render partial: "pagy/nav", locals: { pagy: @pagy, item_name: "organisations" } %>

app/views/organisations/logs.html.erb

@@ -15,7 +15,7 @@
   <%= render partial: "case_logs/log_filters" %>
   <div class="app-filter-layout__content">
     <%= render SearchComponent.new(current_user:, search_label: "Search by log ID, tenant code, property reference or postcode", value: @searched) %>
-    <hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+    <%= govuk_section_break(visible: true, size: "m") %>
     <%= render partial: "case_logs/log_list", locals: { case_logs: @case_logs, title: "Logs", pagy: @pagy, searched: @searched, item_label:, total_count: @total_count } %>
     <%== render partial: "pagy/nav", locals: { pagy: @pagy, item_name: "logs" } %>
   </div>

app/views/organisations/users.html.erb

@@ -17,7 +17,7 @@
 
 <%= render SearchComponent.new(current_user:, search_label: "Search by name or email address", value: @searched) %>
 
-<hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+<%= govuk_section_break(visible: true, size: "m") %>
 
 <%= render partial: "users/user_list", locals: { users: @users, title:, pagy: @pagy, searched: @searched, item_label:, total_count: @total_count } %>
 <%== render partial: "pagy/nav", locals: { pagy: @pagy, item_name: "users" } %>

app/views/users/index.html.erb

@@ -13,7 +13,7 @@
 
 <%= render SearchComponent.new(current_user:, search_label: "Search by name or email address", value: @searched) %>
 
-<hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
+<%= govuk_section_break(visible: true, size: "m") %>
 
 <%= render partial: "users/user_list", locals: { users: @users, title:, pagy: @pagy, searched: @searched, item_label:, total_count: @total_count } %>
 <%== render partial: "pagy/nav", locals: { pagy: @pagy, item_name: "users" } %>