From 7ebc4396303c594c0ebad8e3d20c272c612196a9 Mon Sep 17 00:00:00 2001
From: Paul Chavard <github@paul.chavard.net>
Date: Tue, 26 Oct 2021 20:42:17 +0200
Subject: [PATCH] refactor(drop_down_list_champ): other option

---
 .../new_design/champs/drop-down-list.js       | 20 ++++++++++++++
 app/javascript/new_design/dropdown.js         | 27 -------------------
 app/javascript/packs/application.js           |  1 +
 app/models/champs/drop_down_list_champ.rb     |  2 +-
 .../dossiers/_drop_down_other_input.html.haml |  2 +-
 .../editable_champs/_drop_down_list.html.haml |  2 +-
 6 files changed, 24 insertions(+), 30 deletions(-)
 create mode 100644 app/javascript/new_design/champs/drop-down-list.js

diff --git a/app/javascript/new_design/champs/drop-down-list.js b/app/javascript/new_design/champs/drop-down-list.js
new file mode 100644
index 000000000..874946ae2
--- /dev/null
+++ b/app/javascript/new_design/champs/drop-down-list.js
@@ -0,0 +1,20 @@
+import { delegate, show, hide } from '@utils';
+
+delegate(
+  'change',
+  '.editable-champ-drop_down_list select, .editable-champ-drop_down_list input[type="radio"]',
+  (event) => {
+    const parent = event.target.closest('.editable-champ-drop_down_list');
+    const inputGroup = parent?.querySelector('.drop_down_other');
+    if (inputGroup) {
+      const input = inputGroup.querySelector('input');
+      if (event.target.value === '__other__') {
+        show(inputGroup);
+        input.disabled = false;
+      } else {
+        hide(inputGroup);
+        input.disabled = true;
+      }
+    }
+  }
+);
diff --git a/app/javascript/new_design/dropdown.js b/app/javascript/new_design/dropdown.js
index c7fe5a872..dc948c983 100644
--- a/app/javascript/new_design/dropdown.js
+++ b/app/javascript/new_design/dropdown.js
@@ -20,30 +20,3 @@ delegate('click', '.dropdown-button', (event) => {
     button.setAttribute('aria-expanded', !buttonExpanded);
   }
 });
-
-function onChangeSelectWithOther(target) {
-  const parent = target.closest('.editable-champ-drop_down_list');
-  const inputGroup = parent?.querySelector('.drop_down_other');
-  if (inputGroup) {
-    const input = inputGroup.querySelector('input');
-    if (target.value === '__other__') {
-      show(inputGroup);
-      input.disabled = false;
-    } else {
-      hide(inputGroup);
-      input.disabled = true;
-    }
-  }
-}
-
-delegate('change', '.editable-champ-drop_down_list select', (event) => {
-  onChangeSelectWithOther(event.target);
-});
-
-delegate(
-  'click',
-  '.editable-champ-drop_down_list input[type="radio"]',
-  (event) => {
-    onChangeSelectWithOther(event.target);
-  }
-);
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index bfaa7cda4..f6a7fb267 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -27,6 +27,7 @@ import '../new_design/dossiers/auto-upload';
 import '../new_design/champs/carte';
 import '../new_design/champs/linked-drop-down-list';
 import '../new_design/champs/repetition';
+import '../new_design/champs/drop-down-list';
 
 import {
   toggleCondidentielExplanation,
diff --git a/app/models/champs/drop_down_list_champ.rb b/app/models/champs/drop_down_list_champ.rb
index 649947693..248eb443f 100644
--- a/app/models/champs/drop_down_list_champ.rb
+++ b/app/models/champs/drop_down_list_champ.rb
@@ -52,7 +52,7 @@ class Champs::DropDownListChamp < Champ
   end
 
   def other_value_present?
-    value.present? && drop_down_list_options.exclude?(value)
+    drop_down_other? && value.present? && drop_down_list_options.exclude?(value)
   end
 
   def drop_down_other?
diff --git a/app/views/shared/dossiers/_drop_down_other_input.html.haml b/app/views/shared/dossiers/_drop_down_other_input.html.haml
index 4bd74b97f..349e8c458 100644
--- a/app/views/shared/dossiers/_drop_down_other_input.html.haml
+++ b/app/views/shared/dossiers/_drop_down_other_input.html.haml
@@ -1,4 +1,4 @@
 .drop_down_other{ class: champ.other_value_present? ? '' : 'hidden' }
   .notice
     %p Veuillez saisir votre autre choix
-  = form.text_field :value_other, { maxlength: "200", placeholder: "Saisissez ici", disabled: !champ.other_value_present? }
+  = form.text_field :value_other, maxlength: "200", placeholder: "Saisissez ici", disabled: !champ.other_value_present?
diff --git a/app/views/shared/dossiers/editable_champs/_drop_down_list.html.haml b/app/views/shared/dossiers/editable_champs/_drop_down_list.html.haml
index 8a5552174..ec7f81ee7 100644
--- a/app/views/shared/dossiers/editable_champs/_drop_down_list.html.haml
+++ b/app/views/shared/dossiers/editable_champs/_drop_down_list.html.haml
@@ -16,7 +16,7 @@
           = form.radio_button :value, Champs::DropDownListChamp::OTHER, checked: champ.other_value_present?
           Autre
   - else
-    = form.select :value, champ.options, { selected: champ.selected, required: champ.mandatory? }
+    = form.select :value, champ.options, selected: champ.selected, required: champ.mandatory?
 
   - if champ.drop_down_other?
     = render partial: "shared/dossiers/drop_down_other_input", locals: { form: form, champ: champ }