CLDC-2100++ Add success notification after delete (#2589)

app/controllers/merge_requests_controller.rb

@@ -54,7 +54,8 @@ class MergeRequestsController < ApplicationController
 
   def delete
     @merge_request.discard!
-    redirect_to organisations_path(anchor: "merge-requests")
+    flash[:notice] = "The merge request has been deleted."
+    redirect_to organisations_path(tab: "merge-requests")
   end
 
   def merging_organisations

app/frontend/controllers/index.js

@@ -14,9 +14,13 @@ import GovukfrontendController from './govukfrontend_controller.js'
 import NumericQuestionController from './numeric_question_controller.js'
 
 import FilterLayoutController from './filter_layout_controller.js'
+
+import TabsController from './tabs_controller.js'
+
 application.register('accessible-autocomplete', AccessibleAutocompleteController)
 application.register('conditional-filter', ConditionalFilterController)
 application.register('conditional-question', ConditionalQuestionController)
 application.register('govukfrontend', GovukfrontendController)
 application.register('numeric-question', NumericQuestionController)
 application.register('filter-layout', FilterLayoutController)
+application.register('tabs', TabsController)

app/frontend/controllers/tabs_controller.js

@@ -0,0 +1,35 @@
+document.addEventListener('DOMContentLoaded', function () {
+  const urlParams = new URLSearchParams(window.location.search)
+  let tab = urlParams.get('tab')
+
+  if (!tab && window.location.hash) {
+    tab = window.location.hash.substring(1)
+    urlParams.set('tab', tab)
+    window.history.replaceState(null, null, `${window.location.pathname}?${urlParams.toString()}`)
+  }
+  function activateTab (tabId) {
+    const tabElement = document.getElementById(tabId)
+    if (tabElement) {
+      tabElement.click()
+    }
+    window.history.replaceState(null, null, `${window.location.pathname}?${urlParams.toString()}`)
+  }
+
+  function handleTabClick (event) {
+    event.preventDefault()
+    const targetId = this.getAttribute('href').substring(1)
+    activateTab(targetId)
+    urlParams.set('tab', targetId)
+    window.history.replaceState(null, null, `${window.location.pathname}?${urlParams.toString()}`)
+  }
+
+  if (tab) {
+    activateTab(`tab_${tab}`)
+  }
+
+  window.scrollTo(0, 0)
+
+  document.querySelectorAll('.govuk-tabs__tab').forEach(tabElement => {
+    tabElement.addEventListener('click', handleTabClick)
+  })
+})

app/helpers/merge_requests_helper.rb

@@ -59,7 +59,7 @@ module MergeRequestsHelper
 
     case page
     when "absorbing_organisation"
-      organisations_path(anchor: "merge-requests")
+      organisations_path(tab: "merge-requests")
     when "merging_organisations"
       absorbing_organisation_merge_request_path(merge_request)
     when "merge_date"

app/views/layouts/application.html.erb

@@ -126,7 +126,8 @@
           <%= govuk_notification_banner(
             title_text: "Success",
             success: true, title_heading_level: 3,
-            title_id: "flash-notice"
+            title_id: "flash-notice",
+            role: "alert"
           ) do |notification_banner|
             notification_banner.with_heading(text: flash.notice.html_safe)
             if flash[:notification_banner_body]

app/views/merge_requests/_notification_banners.html.erb

@@ -2,7 +2,7 @@
   <%= govuk_notification_banner(title_text: "Important") do %>
     <p class="govuk-notification-banner__heading govuk-!-width-full" style="max-width: fit-content">
       The absorbing organisation must accept the Data Sharing Agreement before merging.
-    <p>
+    </p>
     <% if @merge_request.dpo_user %>
         Contact the Data Protection Officer: <%= link_to @merge_request.dpo_user.name, user_path(@merge_request.dpo_user.id) %>
       <% else %>
@@ -15,7 +15,7 @@
   <%= govuk_notification_banner(title_text: "Important") do %>
     <p class="govuk-notification-banner__heading govuk-!-width-full" style="max-width: fit-content">
       An error occurred while processing the merge.
-    <p>
+    </p>
     No changes have been made. Try beginning the merge again.
   <% end %>
 <% end %>

app/views/merge_requests/absorbing_organisation.html.erb

@@ -11,7 +11,7 @@
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds-from-desktop">
       <p class="govuk-hint">If organisations are merging into a new organisation, <%= govuk_link_to "create the new organisation", new_organisation_path %> first and then select it here.</p>
-
+      <br>
       <%= f.govuk_select(:absorbing_organisation_id,
         label: { text: "Select organisation name", class: "govuk-label--m" },
         "data-controller": "accessible-autocomplete") do %>

app/views/merge_requests/delete_confirmation.html.erb

@@ -9,7 +9,7 @@
       <%= content_for(:title) %>
     </h1>
 
-    <%= govuk_warning_text(text: "You cannot undo this.") %>
+    <%= govuk_warning_text(text: "You will not be able to undo this action.") %>
 
     <div class="govuk-button-group">
       <%= govuk_button_to(

app/views/merge_requests/helpdesk_ticket.html.erb

@@ -14,7 +14,7 @@
       <br>
       <div class="govuk-grid-row">
         <div class="govuk-grid-column-two-thirds-from-desktop">
-          <%= f.govuk_text_field :helpdesk_ticket, caption: { text: "Ticket number", class: "govuk-label--m" }, label: { text: "For example, MSD-12345" } %>
+          <%= f.govuk_text_field :helpdesk_ticket, caption: { text: "Ticket number", class: "govuk-label govuk-label--s" }, label: { text: "For example, MSD-12345", class: "app-!-colour-muted" } %>
           <%= f.hidden_field :page, value: "helpdesk_ticket" %>
           <div class="govuk-button-group">
             <%= f.govuk_submit submit_merge_request_button_text(request.query_parameters["referrer"]) %>

app/views/merge_requests/merging_organisations.html.erb

@@ -11,7 +11,7 @@
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds-from-desktop">
       <p class="govuk-hint">Add all organisations that are merging.</p>
-
+      <br>
       <%= render partial: "organisation_relationships/related_organisation_select_question", locals: {
         label: { text: "Select an organisation", class: "govuk-label--m" },
         field: :merging_organisation,

app/views/merge_requests/show.html.erb

@@ -1,7 +1,7 @@
 <% content_for :before_content do %>
   <% title = "Merge details: #{@merge_request.absorbing_organisation_name}" %>
   <% content_for :title, title %>
-  <%= govuk_back_link href: organisations_path(anchor: "merge-requests") %>
+  <%= govuk_back_link href: organisations_path(tab: "merge-requests") %>
 <% end %>
 
 <%= render partial: "notification_banners" %>

app/views/organisations/index.html.erb

@@ -5,7 +5,7 @@
 
 <%= render partial: "organisations/headings", locals: request.path == organisations_path ? { main: "Organisations", sub: nil } : { main: @organisation.name, sub: "Organisations" } %>
 
-<div class="app-tab__list-view">
+<div class="app-tab__list-view" data-controller="tabs">
   <%= govuk_tabs(title: "Collection resources", classes: %w[app-tab__large-headers]) do |c| %>
     <% c.with_tab(label: "All organisations") do %>
       <%= govuk_button_link_to "Create a new organisation", new_organisation_path, html: { method: :get } %>

spec/requests/merge_request_spec.rb

@@ -20,7 +20,7 @@ RSpec.describe MergeRequest, type: :request do
 
     it "redirects to the merge request list" do
       delete delete_merge_request_path(merge_request)
-      expect(response).to redirect_to(organisations_path(anchor: "merge-requests"))
+      expect(response).to redirect_to(organisations_path(tab: "merge-requests"))
       follow_redirect!
       expect(page).to have_content("Merge requests")
     end

spec/requests/merge_requests_controller_spec.rb

@@ -202,7 +202,7 @@ RSpec.describe MergeRequestsController, type: :request do
       end
 
       it "has the correct back button" do
-        expect(page).to have_link("Back", href: organisations_path(anchor: "merge-requests"))
+        expect(page).to have_link("Back", href: organisations_path(tab: "merge-requests"))
       end
     end