Set external_id from combo search inputs

app/controllers/users/dossiers_controller.rb

@@ -323,8 +323,8 @@ module Users
     def champs_params
       params.permit(dossier: {
         champs_attributes: [
-          :id, :value, :primary_value, :secondary_value, :piece_justificative_file, value: [],
+          :id, :value, :external_id, :primary_value, :secondary_value, :piece_justificative_file, value: [],
-          champs_attributes: [:id, :_destroy, :value, :primary_value, :secondary_value, :piece_justificative_file, value: []]
+          champs_attributes: [:id, :_destroy, :value, :external_id, :primary_value, :secondary_value, :piece_justificative_file, value: []]
         ]
       })
     end

app/javascript/components/ComboSearch.js

@@ -28,22 +28,38 @@ function ComboSearch({
   transformResults = defaultTransformResults
 }) {
   const label = scope;
-  const hiddenField = useMemo(
+  const hiddenValueField = useMemo(
     () => document.querySelector(`input[data-uuid="${hiddenFieldId}"]`),
     [hiddenFieldId]
   );
-  const initialValue = hiddenField && hiddenField.value;
+  const hiddenIdField = useMemo(
+    () =>
+      document.querySelector(
+        `input[data-uuid="${hiddenFieldId}"] + input[data-reference]`
+      ),
+    [hiddenFieldId]
+  );
+  const initialValue = hiddenValueField && hiddenValueField.value;
   const [searchTerm, setSearchTerm] = useState('');
   const [debouncedSearchTerm, setDebouncedSearchTerm] = useState('');
   const [value, setValue] = useState(initialValue);
   const resultsMap = useRef({});
   const setExternalValue = useCallback((value) => {
-    if (hiddenField) {
+    if (hiddenValueField) {
-      hiddenField.setAttribute('value', value);
+      hiddenValueField.setAttribute('value', value);
-      fire(hiddenField, 'autosave:trigger');
+      fire(hiddenValueField, 'autosave:trigger');
     }
+  });
+  const setExternalId = useCallback((key) => {
+    if (hiddenIdField) {
+      hiddenIdField.setAttribute('value', key);
+    }
+  });
+  const setExternalValueAndId = useCallback((value) => {
+    const [key, result] = resultsMap.current[value];
+    setExternalId(key);
+    setExternalValue(value);
     if (onChange) {
-      const result = resultsMap.current[value];
       onChange(value, result);
     }
   });
@@ -62,6 +78,7 @@ function ComboSearch({
       if (value.length >= minimumInputLength) {
         setSearchTerm(value.trim());
         if (allowInputValues) {
+          setExternalId('');
           setExternalValue(value);
         }
       }
@@ -70,7 +87,7 @@ function ComboSearch({
   );
 
   const handleOnSelect = useCallback((value) => {
-    setExternalValue(value);
+    setExternalValueAndId(value);
     setValue(value);
   });
 
@@ -95,7 +112,7 @@ function ComboSearch({
             <ComboboxList>
               {results.map((result) => {
                 const [key, str] = transformResult(result);
-                resultsMap.current[str] = result;
+                resultsMap.current[str] = [key, result];
                 return (
                   <ComboboxOption
                     key={key}

app/views/shared/dossiers/editable_champs/_address.html.haml

@@ -1,3 +1,4 @@
 - hidden_field_id = SecureRandom.uuid
 = form.hidden_field :value, { data: { uuid: hidden_field_id } }
+= form.hidden_field :external_id, { data: { reference: true } }
 = react_component("ComboAdresseSearch", mandatory: champ.mandatory?, hiddenFieldId: hidden_field_id)

app/views/shared/dossiers/editable_champs/_annuaire_education.html.haml

@@ -1,3 +1,4 @@
 - hidden_field_id = SecureRandom.uuid
 = form.hidden_field :value, { data: { uuid: hidden_field_id } }
+= form.hidden_field :external_id, { data: { reference: true } }
 = react_component("ComboAnnuaireEducationSearch", mandatory: champ.mandatory?, hiddenFieldId: hidden_field_id )

app/views/shared/dossiers/editable_champs/_communes.html.haml

@@ -1,3 +1,4 @@
 - hidden_field_id = SecureRandom.uuid
 = form.hidden_field :value, { data: { uuid: hidden_field_id } }
+= form.hidden_field :external_id, { data: { reference: true } }
 = react_component("ComboCommunesSearch", mandatory: champ.mandatory?, hiddenFieldId: hidden_field_id)

app/views/shared/dossiers/editable_champs/_departements.html.haml

@@ -1,3 +1,4 @@
 - hidden_field_id = SecureRandom.uuid
 = form.hidden_field :value, { data: { uuid: hidden_field_id } }
+= form.hidden_field :external_id, { data: { reference: true } }
 = react_component("ComboDepartementsSearch", mandatory: champ.mandatory?, hiddenFieldId: hidden_field_id)

app/views/shared/dossiers/editable_champs/_regions.html.haml

@@ -1,3 +1,4 @@
 - hidden_field_id = SecureRandom.uuid
 = form.hidden_field :value, { data: { uuid: hidden_field_id } }
+= form.hidden_field :external_id, { data: { reference: true } }
 = react_component("ComboRegionsSearch", mandatory: champ.mandatory?, hiddenFieldId: hidden_field_id)