From 562091916986c8f57211c918633098b829118aec Mon Sep 17 00:00:00 2001
From: Ynda Jas <yndajas@gmail.com>
Date: Thu, 19 Sep 2024 17:06:18 +0100
Subject: [PATCH] WIP Use autocomplete on all organisation fields

This was previously added to the organisation field on the page to
invite a new user to Signon. This adds it to other pages that have an
organisations field

TODO: integration tests if needed (simple ones to say it works with
JavaScript)
---
 app/views/account/organisations/edit.html.erb | 13 +++++++++-
 app/views/batch_invitations/new.html.erb      | 14 +++++++++--
 app/views/users/organisations/edit.html.erb   | 25 +++++++++++++------
 3 files changed, 42 insertions(+), 10 deletions(-)

diff --git a/app/views/account/organisations/edit.html.erb b/app/views/account/organisations/edit.html.erb
index 4636218f8..232601de3 100644
--- a/app/views/account/organisations/edit.html.erb
+++ b/app/views/account/organisations/edit.html.erb
@@ -20,12 +20,23 @@
   <div class="govuk-grid-column-two-thirds">
     <% if policy(%i[account organisations]).update? %>
       <%= form_for current_user, url: account_organisation_path do |f| %>
-        <%= render "govuk_publishing_components/components/select", {
+        <div data-module="accessible-autocomplete">
+          <%= render "govuk_publishing_components/components/select", {
             id: "user_organisation_id",
             name: "user[organisation_id]",
             label: "Organisation",
             options: options_for_your_organisation_select(current_user)
+          } %>
+
+          <div class="govuk-button-group">
+            <%= render "govuk_publishing_components/components/button", {
+              text: "Clear selection",
+              type: "button",
+              classes: "js-autocomplete__clear-button",
+              secondary_solid: true
             } %>
+          </div>
+        </div>
         <%= render "govuk_publishing_components/components/button", {
           text: "Change organisation"
         } %>
diff --git a/app/views/batch_invitations/new.html.erb b/app/views/batch_invitations/new.html.erb
index 859301c06..f6bb20427 100644
--- a/app/views/batch_invitations/new.html.erb
+++ b/app/views/batch_invitations/new.html.erb
@@ -66,13 +66,23 @@
           column, or the value is blank for a row, the user will be
           assigned to this organisation instead."  } %>
 
-      <%= render "govuk_publishing_components/components/select", {
+      <div data-module="accessible-autocomplete">
+        <%= render "govuk_publishing_components/components/select", {
           id: "batch_invitation_organisation_id",
           name: "batch_invitation[organisation_id]",
           label: "Organisation",
           options: policy_scope(Organisation).not_closed.order(:name).map { |organisation| { text: organisation.name_with_abbreviation, value: organisation.id } }
-          } %>
+        } %>
 
+        <div class="govuk-button-group">
+          <%= render "govuk_publishing_components/components/button", {
+            text: "Clear selection",
+            type: "button",
+            classes: "js-autocomplete__clear-button",
+            secondary_solid: true
+          } %>
+        </div>
+      </div>
     <% end %>
 
     <%= render "govuk_publishing_components/components/button", {
diff --git a/app/views/users/organisations/edit.html.erb b/app/views/users/organisations/edit.html.erb
index bea538d0c..cc8fefca0 100644
--- a/app/views/users/organisations/edit.html.erb
+++ b/app/views/users/organisations/edit.html.erb
@@ -38,13 +38,24 @@
 <div class="govuk-grid-row">
   <div class="govuk-grid-column-two-thirds">
     <%= form_for @user, url: user_organisation_path(@user) do %>
-      <%= render "govuk_publishing_components/components/select", {
-        id: "user_organisation_id",
-        name: "user[organisation_id]",
-        label: "Organisation",
-        options: options_for_organisation_select(selected: @user.organisation_id),
-        error_message: @user.errors[:organisation_id].any? ? @user.errors.full_messages_for(:organisation_id).to_sentence : nil
-      } %>
+      <div data-module="accessible-autocomplete">
+        <%= render "govuk_publishing_components/components/select", {
+          id: "user_organisation_id",
+          name: "user[organisation_id]",
+          label: "Organisation",
+          options: options_for_organisation_select(selected: @user.organisation_id),
+          error_message: @user.errors[:organisation_id].any? ? @user.errors.full_messages_for(:organisation_id).to_sentence : nil
+        } %>
+
+        <div class="govuk-button-group">
+          <%= render "govuk_publishing_components/components/button", {
+            text: "Clear selection",
+            type: "button",
+            classes: "js-autocomplete__clear-button",
+            secondary_solid: true
+          } %>
+        </div>
+      </div>
       <div class="govuk-button-group">
         <%= render "govuk_publishing_components/components/button", {
           text: "Change organisation",