Use GOV.UK Design System task list

This upgrades our task lists to use the new one that is included as part of the GOV.UK Design System.
DFE-Digital · Feb 22, 2024 · 2df8636 · 2df8636
1 parent a8dd047
commit 2df8636
Show file tree

Hide file tree

Showing 40 changed files with 270 additions and 473 deletions.
diff --git a/app/assets/stylesheets/_task_list.scss b/app/assets/stylesheets/_task_list.scss
diff --git a/app/assets/stylesheets/application.sass.scss b/app/assets/stylesheets/application.sass.scss
@@ -16,7 +16,6 @@ $moj-images-path: "/";
 @import "_environments";
 @import "_search_results";
 @import "_support";
-@import "_task_list";
 
 ul.autocomplete__menu {
   li {

diff --git a/app/components/task_list/component.html.erb b/app/components/task_list/component.html.erb
diff --git a/app/components/task_list/component.rb b/app/components/task_list/component.rb
diff --git a/app/view_objects/teacher_interface/further_information_request_view_object.rb b/app/view_objects/teacher_interface/further_information_request_view_object.rb
@@ -15,26 +15,23 @@ def further_information_request
           .find(params[:id])
     end
 
-    def task_list_sections
-      items =
-        further_information_request
-          .items
-          .order(:created_at)
-          .map do |item|
-            {
-              name: item_name(item),
-              link: [
-                :edit,
-                :teacher_interface,
-                :application_form,
-                further_information_request,
-                item,
-              ],
-              status: item.state,
-            }
-          end
-
-      [{ title: "Further information requested", items: }]
+    def task_list_items
+      further_information_request
+        .items
+        .order(:created_at)
+        .map do |item|
+          {
+            title: item_name(item),
+            href: [
+              :edit,
+              :teacher_interface,
+              :application_form,
+              further_information_request,
+              item,
+            ],
+            status: item.state,
+          }
+        end
     end
 
     def can_check_answers?

diff --git a/app/views/assessor_interface/application_forms/show.html.erb b/app/views/assessor_interface/application_forms/show.html.erb
@@ -30,4 +30,14 @@
 
 <h2 class="govuk-heading-l govuk-!-margin-top-9">Task list</h2>
 
-<%= render(TaskList::Component.new(@view_object.task_list_sections)) %>
+<% @view_object.task_list_sections.each do |section| %>
+  <% if (items = section[:items]).present? %>
+    <h3 class="govuk-heading-m"><%= section[:title] %></h3>
+
+    <%= govuk_task_list(id_prefix: section[:title].parameterize) do |task_list|
+      items.each do |item|
+        task_list.with_item(title: item[:name], href: item[:link], status: render(StatusTag::Component.new(item[:status])))
+      end
+    end %>
+  <% end %>
+<% end %>
diff --git a/app/views/assessor_interface/assessments/review.html.erb b/app/views/assessor_interface/assessments/review.html.erb
@@ -7,48 +7,41 @@
   The following verification tasks have been flagged for review:
 </p>
 
-<%= render(TaskList::Component.new([
-  if @professional_standing_request.present?
-    {
-      title: "LoPS",
-      indentation: false,
-      items: [
-        {
-          name: region_teaching_authority_name(@application_form.region, context: :assessor).upcase_first,
-          link: [:review, :assessor_interface, @application_form, @assessment, :professional_standing_request],
-          status: @professional_standing_request.review_status,
-        }
-      ],
-    }
-  end,
-  if @qualification_requests.present?
-    {
-      title: "Qualifications",
-      indentation: false,
-      items: @qualification_requests.map do |qualification_request|
-        {
-          name: qualification_title(qualification_request.qualification),
-          link: [:review, :assessor_interface, @application_form, @assessment, qualification_request],
-          status: qualification_request.review_status,
-        }
-      end
-    }
-  end,
-  if @reference_requests.present?
-    {
-      title: "References",
-      indentation: false,
-      items: @reference_requests.map do |reference_request|
-        {
-          name: work_history_name(reference_request.work_history),
-          link: [:review, :assessor_interface, @application_form, @assessment, reference_request],
-          status: reference_request.review_status,
-        }
-      end
-    }
-  end
-].compact)) %>
+<% if @professional_standing_request.present? %>
+  <h2 class="govuk-heading-m">LoPS</h2>
+  <%= govuk_task_list(id_prefix: "lops") do |task_list|
+    task_list.with_item(
+      title: region_teaching_authority_name(@application_form.region, context: :assessor).upcase_first,
+      href: [:review, :assessor_interface, @application_form, @assessment, :professional_standing_request],
+      status: render(StatusTag::Component.new(@professional_standing_request.review_status)),
+    )
+  end %>
+<% end %>
 
-<div class="govuk-!-padding-top-3">
-  <%= govuk_button_link_to "Back to overview", [:assessor_interface, @application_form] %>
-</div>
+<% if @qualification_requests.present? %>
+  <h2 class="govuk-heading-m">Qualifications</h2>
+  <%= govuk_task_list(id_prefix: "qualifications") do |task_list|
+    @qualification_requests.each do |qualification_request|
+      task_list.with_item(
+        title: qualification_title(qualification_request.qualification),
+        href: [:review, :assessor_interface, @application_form, @assessment, qualification_request],
+        status: render(StatusTag::Component.new(qualification_request.review_status)),
+      )
+    end
+  end %>
+<% end %>
+
+<% if @reference_requests.present? %>
+  <h2 class="govuk-heading-m">References</h2>
+  <%= govuk_task_list(id_prefix: "references") do |task_list|
+    @reference_requests.each do |reference_request|
+      task_list.with_item(
+        title: work_history_name(reference_request.work_history),
+        href: [:review, :assessor_interface, @application_form, @assessment, reference_request],
+        status: render(StatusTag::Component.new(reference_request.review_status)),
+      )
+    end
+  end %>
+<% end %>
+
+<%= govuk_button_link_to "Back to overview", [:assessor_interface, @application_form] %>
diff --git a/app/views/assessor_interface/professional_standing_requests/show.html.erb b/app/views/assessor_interface/professional_standing_requests/show.html.erb
@@ -7,46 +7,40 @@
   You need to request verification for this application’s LoPS.
 </p>
 
-<%= render(TaskList::Component.new(
-  [
-    {
-      indentation: false,
-      items: [
-        {
-          name: "Request LoPS verification",
-          link: unless @professional_standing_request.requested?
-                  [
-                    :request,
-                    :assessor_interface,
-                    @application_form,
-                    @assessment,
-                    :professional_standing_request,
-                  ]
-                end,
-          status: @professional_standing_request.requested? ? "completed" : "not_started"
-        },
-        {
-          name: "Record LoPS response",
-          link: if @professional_standing_request.requested?
-                  [
-                    :verify,
-                    :assessor_interface,
-                    @application_form,
-                    @assessment,
-                    :professional_standing_request
-                  ]
-                end,
-          status: if @professional_standing_request.verify_passed?
-                    "completed"
-                  elsif @professional_standing_request.requested?
-                    @professional_standing_request.status
-                  else
-                    "cannot_start"
-                  end
-        }
-      ],
-    }
-  ]
-)) %>
+<%= govuk_task_list do |task_list|
+  task_list.with_item(
+    title: "Request LoPS verification",
+    href: unless @professional_standing_request.requested?
+            [
+              :request,
+              :assessor_interface,
+              @application_form,
+              @assessment,
+              :professional_standing_request,
+            ]
+          end,
+    status: render(StatusTag::Component.new(@professional_standing_request.requested? ? "completed" : "not_started"))
+  )
+
+  task_list.with_item(
+    title: "Record LoPS response",
+    href: if @professional_standing_request.requested?
+            [
+              :verify,
+              :assessor_interface,
+              @application_form,
+              @assessment,
+              :professional_standing_request
+            ]
+          end,
+    status: render(StatusTag::Component.new(if @professional_standing_request.verify_passed?
+                                              "completed"
+                                            elsif @professional_standing_request.requested?
+                                              @professional_standing_request.status
+                                            else
+                                              "cannot_start"
+                                            end))
+  )
+end %>
 
 <%= govuk_button_link_to "Back to overview", [:assessor_interface, @application_form] %>