Use section break helper (#651)

* Use section break helper

* Fix failing TagHelper spec

* Bump govuk-components for zeitwerk fix

* Fix heisenspec

Co-authored-by: baarkerlounger <db@slothlife.xyz>

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.6)
       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" } %>

spec/helpers/tag_helper_spec.rb

@@ -10,7 +10,7 @@ RSpec.describe TagHelper do
     end
 
     it "returns tag with correct status text and colour and custom class" do
-      expect(status_tag("not_started", "app-tag--small")).to eq("<strong class=\"govuk-tag app-tag--small govuk-tag--grey\">Not started</strong>")
+      expect(status_tag("not_started", "app-tag--small")).to eq("<strong class=\"govuk-tag govuk-tag--grey app-tag--small\">Not started</strong>")
     end
   end
 end

spec/requests/organisations_controller_spec.rb

@@ -572,10 +572,10 @@ RSpec.describe OrganisationsController, type: :request do
 
               it "shows only logs matching both search and filters" do
                 get "/organisations/#{organisation.id}/logs?search=#{matching_postcode}&status[]=#{matching_status}", headers: headers, params: {}
-                expect(page).to have_content(log_matching_filter_and_search.id)
-                expect(page).not_to have_content(log_to_search.id)
+                expect(page).to have_link(log_matching_filter_and_search.id.to_s)
+                expect(page).not_to have_link(log_to_search.id.to_s)
                 logs.each do |log|
-                  expect(page).not_to have_content(log.id)
+                  expect(page).not_to have_link(log.id.to_s)
                 end
               end
             end