Merge pull request #5867 from kenny-luong/5776-UPDATE-CASE-CONTACT-FORM

Updates case contact form to use dropdown selector

Gemfile.lock

@@ -663,4 +663,4 @@ RUBY VERSION
    ruby 3.2.2p53
 
 BUNDLED WITH
-   2.5.11
+   2.5.14

app/controllers/case_contacts/form_controller.rb

@@ -60,7 +60,7 @@ def get_cases_and_contact_types
       @contact_types = current_organization.contact_types
     end
     @contact_types.order(name: :asc)
-
+    @selected_cases = @case_contact.draft_case_ids
     @selected_contact_type_ids = @case_contact.contact_type_ids
   end
 

app/decorators/casa_case_decorator.rb

@@ -114,4 +114,10 @@ def emancipation_checklist_count
   def show_contact_type?(contact_type_id)
     object.casa_case_contact_types.map(&:contact_type_id).include?(contact_type_id)
   end
+
+  def hash_for_multi_select
+    volunteers = object.volunteers.map(&:display_name).join(", ")
+
+    {value: object.id, text: object.case_number, group: object&.casa_org_id, subtext: volunteers}
+  end
 end

app/views/case_contacts/form/_contact_types.html.erb

@@ -1,8 +1,10 @@
 <p>Choose from the available options below by searching or selecting from the dropdown menu.</p>
-<%= render(Form::MultipleSelectComponent.new(
-  form: form,
-  name: :contact_type_ids,
-  options: options.decorate.map { |ct| ct.hash_for_multi_select_with_cases(casa_cases&.pluck(:id)) },
-  selected_items: selected_items,
-  render_option_subtext: true
-)) %>
+<div id="contact-type-id-selector">
+  <%= render(Form::MultipleSelectComponent.new(
+    form: form,
+    name: :contact_type_ids,
+    options: options.decorate.map { |ct| ct.hash_for_multi_select_with_cases(casa_cases&.pluck(:id)) },
+    selected_items: selected_items,
+    render_option_subtext: true
+  )) %>
+</div>

app/views/case_contacts/form/_relevant_cases.html.erb

@@ -0,0 +1,10 @@
+<p>Select the relevant cases below by searching or selecting from the dropdown menu.</p>
+<div id="draft-case-id-selector">
+  <%= render(Form::MultipleSelectComponent.new(
+    form: form,
+    name: :draft_case_ids,
+    options: options.decorate.map { |casa_case| casa_case.hash_for_multi_select },
+    selected_items: selected_items,
+    render_option_subtext: current_user.supervisor?
+  )) %>
+</div>

app/views/case_contacts/form/details.html.erb

@@ -6,20 +6,9 @@
 
     <div class="card-style-1 pl-25 mb-10">
       <h4 class="mb-20"><label for="case_contact_casa_case">1. Select the relevant <%= "case".pluralize(@casa_cases.count) %> for this contact <span class="red-letter">*</span></label></h4>
-      <div class="casa-case-scroll">
+      <div class="d-flex flex-column gap-4">
         <%= form.hidden_field :draft_case_ids, multiple: true, value: nil %>
-        <% @casa_cases.each do |casa_case| %>
-          <div class="form-check checkbox-style mb-10 ml-5">
-            <%= check_box_tag "case_contact[draft_case_ids][]",
-              casa_case.id,
-              @case_contact.draft_case_ids.include?(casa_case.id),
-              id: "case_contact_draft_case_id_#{casa_case.id}",
-              class: ["form-check-input", "casa-case-id", "case-contacts-form-checkbox"] %>
-            <label class="form-check-label" for="case_contact_draft_case_id_<%= casa_case.id %>">
-              <%= casa_case.case_number %>
-            </label>
-          </div>
-        <% end %>
+        <%= render "relevant_cases", form: form, options: @casa_cases, selected_items: @selected_cases, casa_cases: @casa_cases %>
       </div>
     </div>
     <div class="card-style-1 pl-25 pr-25 mb-10">

config/environments/test.rb

@@ -7,9 +7,7 @@
 
 Rails.application.configure do
   # Settings specified here will take precedence over those in config/application.rb.
-
   config.action_mailer.default_url_options = {host: "localhost", port: 3000} # for devise authentication
-
   # While tests run files are not watched, reloading is not necessary.
   config.enable_reloading = false
   # Turn false under Spring and add config.action_view.cache_template_loading = true.

spec/support/fill_in_case_contact_fields.rb

@@ -7,15 +7,30 @@ module FillInCaseContactFields
   # @param hours [Integer]
   # @param minutes [Integer]
   def complete_details_page(contact_made:, medium: nil, occurred_on: nil, hours: nil, minutes: nil, case_numbers: [], contact_types: [], contact_topics: [])
+    within find("#draft-case-id-selector") do
+      find(".ts-control").click
+    end
+
     case_numbers.each do |case_number|
-      check case_number
+      checkbox_for_case_number = find("span", text: case_number).sibling("input")
+      checkbox_for_case_number.click unless checkbox_for_case_number.checked?
+    end
+
+    within find("#draft-case-id-selector") do
+      find(".ts-control").click
+    end
+
+    within find("#contact-type-id-selector") do
+      find(".ts-control").click
     end
 
-    find(".ts-control").click
     contact_types.each do |contact_type|
       find("span", text: contact_type).click
     end
-    find(".ts-control").click
+
+    within find("#contact-type-id-selector") do
+      find(".ts-control").click
+    end
 
     within "#enter-contact-details" do
       choose contact_made ? "Yes" : "No"
@@ -32,6 +47,12 @@ def complete_details_page(contact_made:, medium: nil, occurred_on: nil, hours: n
     click_on "Save and Continue"
   end
 
+  def choose_medium(medium, click_continue: true)
+    choose medium if medium
+
+    click_on "Save and Continue" if click_continue
+  end
+
   # @param notes [String]
   def complete_notes_page(notes: "", click_continue: true)
     fill_in "Additional notes", with: notes

spec/system/case_contacts/new_spec.rb

@@ -129,11 +129,10 @@
         create_contact_types(volunteer_casa_case_one.casa_org)
 
         visit new_case_contact_path
-
         complete_details_page(case_numbers: [volunteer_casa_case_one.case_number], contact_types: %w[School], contact_made: true, medium: nil, occurred_on: "04/04/2020", hours: 1, minutes: 45)
         expect(page).to have_text("Medium type can't be blank")
 
-        complete_details_page(case_numbers: [volunteer_casa_case_one.case_number], contact_types: %w[School], contact_made: true, medium: "In Person", occurred_on: "04/04/2020", hours: 1, minutes: 45)
+        choose_medium("In Person")
         complete_notes_page
         fill_in_expenses_page(want_reimbursement: true)
         click_on "Submit"
@@ -168,7 +167,10 @@
 
         visit new_case_contact_path
 
-        find(".ts-control").click
+        within find("#contact-type-id-selector") do
+          find(".ts-control").click
+        end
+
         expect(page).not_to have_text("Attorney")
         expect(page).to have_text("School")
         expect(page).to have_text("Therapist")
@@ -228,8 +230,8 @@
           it "selects no cases" do
             visit new_case_contact_path
 
-            expect(page).not_to have_checked_field(first_case.case_number)
-            expect(page).not_to have_checked_field(second_case.case_number)
+            expect(page).not_to have_text(first_case.case_number)
+            expect(page).not_to have_text(second_case.case_number)
           end
 
           it "warns user about using the back button on step 1" do
@@ -243,8 +245,8 @@
             it "select the cases defined in the params" do
               visit new_case_contact_path(case_contact: {casa_case_id: first_case.id})
 
-              expect(page).to have_checked_field(first_case.case_number)
-              expect(page).not_to have_checked_field(second_case.case_number)
+              expect(page).to have_text(first_case.case_number)
+              expect(page).not_to have_text(second_case.case_number)
             end
 
             it "does not warn user when clicking the back button" do
@@ -264,7 +266,7 @@
         it "selects the only case" do
           visit new_case_contact_path
 
-          expect(page).to have_checked_field(first_case.case_number)
+          expect(page).to have_text(first_case.case_number)
         end
 
         it "does not warn user when clicking the back button" do