feat(types_de_champ_editor.ts): wires move_and_morph with type de champs editor [for now, the select is empty and will be synced]

app/components/types_de_champ_editor/champ_component.rb

@@ -30,7 +30,8 @@ class TypesDeChampEditor::ChampComponent < ApplicationComponent
         controller: 'type-de-champ-editor',
         type_de_champ_editor_move_url_value: move_admin_procedure_type_de_champ_path(procedure, type_de_champ.stable_id),
         type_de_champ_editor_move_up_url_value: move_up_admin_procedure_type_de_champ_path(procedure, type_de_champ.stable_id),
-        type_de_champ_editor_move_down_url_value: move_down_admin_procedure_type_de_champ_path(procedure, type_de_champ.stable_id)
+        type_de_champ_editor_move_down_url_value: move_down_admin_procedure_type_de_champ_path(procedure, type_de_champ.stable_id),
+        type_de_champ_editor_move_and_morph_url_value: move_and_morph_admin_procedure_type_de_champ_path(procedure, type_de_champ.stable_id)
       }
     }
   end

app/components/types_de_champ_editor/champ_component/champ_component.html.haml

@@ -136,5 +136,6 @@
 
     = render(Conditions::ChampsConditionsComponent.new(tdc: type_de_champ, upper_tdcs: @upper_coordinates.map(&:type_de_champ), procedure_id: procedure.id))
 
-  .type-de-champ-add-button{ class: class_names(root: !coordinate.child?) }
+  .type-de-champ-add-button{ class: class_names(root: !coordinate.child?, flex: true) }
     = render TypesDeChampEditor::AddChampButtonComponent.new(revision: coordinate.revision, parent: coordinate&.parent, is_annotation: coordinate.private?, after_stable_id: type_de_champ.stable_id)
+    = render TypesDeChampEditor::SelectChampPositionComponent.new(revision:, coordinate:)

app/components/types_de_champ_editor/select_champ_position_component.rb

@@ -0,0 +1,14 @@
+class TypesDeChampEditor::SelectChampPositionComponent < ApplicationComponent
+  def initialize(revision:, coordinate:)
+    @revision = revision
+    @coordinate = coordinate
+  end
+
+  def options
+    [["Selectionner une option", @coordinate.stable_id]]
+  end
+
+  def describedby_id
+    dom_id(@coordinate, :move_and_morph)
+  end
+end

app/components/types_de_champ_editor/select_champ_position_component/select_champ_position_component.html.haml

@@ -0,0 +1,3 @@
+.fr-ml-3w.flex.select-position
+  = label_tag :target_stable_id, "Déplacer le champ", for: describedby_id, class: 'flex align-center flex-no-shrink fr-mr-3w' 
+  = select_tag :target_stable_id, options_for_select(options), id: describedby_id, class: 'fr-select', aria: { discribedby: describedby_id }, data: { action: 'change->type-de-champ-editor#onMoveAndMorphChange', selected: @coordinate.stable_id } 

app/javascript/controllers/type_de_champ_editor_controller.ts

@@ -17,12 +17,14 @@ export class TypeDeChampEditorController extends ApplicationController {
     typeDeChampStableId: String,
     moveUrl: String,
     moveUpUrl: String,
-    moveDownUrl: String
+    moveDownUrl: String,
+    moveAndMorphUrl: String
   };
 
   declare readonly moveUrlValue: string;
   declare readonly moveUpUrlValue: string;
   declare readonly moveDownUrlValue: string;
+  declare readonly moveAndMorphUrlValue: string;
   declare readonly isVisible: boolean;
 
   #latestPromise = Promise.resolve();
@@ -54,6 +56,14 @@ export class TypeDeChampEditorController extends ApplicationController {
     this.requestSubmitForm(form);
   }
 
+  onMoveAndMorphChange(event: ActionEvent) {
+    const form = createForm(this.moveAndMorphUrlValue, 'patch');
+    const target = event.target as HTMLSelectElement;
+
+    createHiddenInput(form, target.name, target.value);
+    this.requestSubmitForm(form);
+  }
+
   private onChange(event: Event) {
     matchInputElement(event.target, {
       file: (target) => {

spec/components/types_de_champ_editor/champ_component_spec.rb

@@ -59,5 +59,14 @@ describe TypesDeChampEditor::ChampComponent, type: :component do
         expect(page).to have_css('input[type=file]')
       end
     end
+
+    describe 'select champ position' do
+      let(:tdc) { procedure.draft_revision.types_de_champ.first }
+      let(:coordinate) { procedure.draft_revision.revision_types_de_champ_public.first }
+      let(:procedure) { create(:procedure, types_de_champ_public: [{ type: :text, libelle: 'a' }]) }
+      it 'does not have select to move champs' do
+        expect(page).not_to have_css("select##{ActionView::RecordIdentifier.dom_id(coordinate, :move_and_morph)}")
+      end
+    end
   end
 end