plug column_filter, column_picker, column_header in new controller

app/components/instructeurs/column_filter_component/column_filter_component.html.haml

@@ -1,4 +1,4 @@
-= form_tag add_filter_instructeur_procedure_path(procedure), method: :post, class: 'dropdown-form large', id: 'filter-component', data: { turbo: true, controller: 'autosubmit' } do
+= form_with model: [:instructeur, @procedure_presentation], class: 'dropdown-form large', id: 'filter-component', data: { turbo: true, controller: 'autosubmit' } do
   = current_filter_tags
 
   .fr-select-group

app/components/instructeurs/column_picker_component/column_picker_component.html.haml

@@ -1,5 +1,5 @@
-= form_tag update_displayed_fields_instructeur_procedure_path(@procedure), method: :patch, class: 'dropdown-form large columns-form' do
+= form_with model: [:instructeur, @procedure_presentation], class: 'dropdown-form large columns-form' do
   %react-fragment
-    = render ReactComponent.new "ComboBox/MultiComboBox", items: @displayable_columns_for_select, selected_keys: @displayable_columns_selected, name: 'values[]', 'aria-label': 'Colonne à afficher', value_separator: false
+    = render ReactComponent.new "ComboBox/MultiComboBox", items: @displayable_columns_for_select, selected_keys: @displayable_columns_selected, name: 'displayed_columns[]', 'aria-label': 'Colonne à afficher', value_separator: false
 
   = submit_tag t('.save'), class: 'fr-btn fr-btn--secondary'

app/components/instructeurs/column_table_header_component.rb

@@ -2,7 +2,7 @@
 
 class Instructeurs::ColumnTableHeaderComponent < ApplicationComponent
   def initialize(procedure_presentation:)
-    @procedure = procedure_presentation.procedure
+    @procedure_presentation = procedure_presentation
     @columns = procedure_presentation.displayed_fields_for_headers
     @sorted_column = procedure_presentation.sorted_column
   end
@@ -15,11 +15,16 @@ class Instructeurs::ColumnTableHeaderComponent < ApplicationComponent
     return 'sva-col' if column.column == 'sva_svr_decision_on'
   end
 
-  def update_sort_path(column)
+  def column_header(column)
     id = column.id
     order = opposite_order_for(column)
 
-    update_sort_instructeur_procedure_path(@procedure, sorted_column: { id:, order: })
+    button_to(
+      label_and_arrow(column),
+      [:instructeur, @procedure_presentation],
+      params: { sorted_column: { id: id, order: order } },
+      class: 'fr-text--bold'
+    )
   end
 
   def opposite_order_for(column)

app/components/instructeurs/column_table_header_component/column_table_header_component.html.haml

@@ -1,3 +1,3 @@
 - @columns.each do |column|
   %th{ aria_sort(column), scope: "col", class: classname(column) }
-    = link_to label_and_arrow(column), update_sort_path(column)
+    = column_header(column)

spec/system/instructeurs/procedure_filters_spec.rb

@@ -19,7 +19,7 @@ describe "procedure filters" do
 
   scenario "should display demandeur by default" do
     within ".dossiers-table" do
-      expect(page).to have_link("Demandeur")
+      expect(page).to have_button("Demandeur")
       expect(page).to have_link(new_unfollow_dossier.user.email)
     end
   end
@@ -28,7 +28,7 @@ describe "procedure filters" do
     procedure.update!(sva_svr: SVASVRConfiguration.new(decision: :sva).attributes)
     visit instructeur_procedure_path(procedure)
     within ".dossiers-table" do
-      expect(page).to have_link("Date décision SVA")
+      expect(page).to have_button("Date décision SVA")
       expect(page).to have_link(new_unfollow_dossier.user.email)
     end
   end
@@ -46,7 +46,7 @@ describe "procedure filters" do
   scenario "should add be able to add created_at column", js: true do
     add_column("Date de création")
     within ".dossiers-table" do
-      expect(page).to have_link("Date de création")
+      expect(page).to have_button("Date de création")
       expect(page).to have_link(new_unfollow_dossier.created_at.strftime('%d/%m/%Y'))
     end
   end
@@ -54,20 +54,20 @@ describe "procedure filters" do
   scenario "should add be able to add and remove custom type_de_champ column", js: true do
     add_column(type_de_champ.libelle)
     within ".dossiers-table" do
-      expect(page).to have_link(type_de_champ.libelle)
+      expect(page).to have_button(type_de_champ.libelle)
       expect(page).to have_link(champ.value)
     end
 
     remove_column(type_de_champ.libelle)
     within ".dossiers-table" do
-      expect(page).not_to have_link(type_de_champ.libelle)
+      expect(page).not_to have_button(type_de_champ.libelle)
       expect(page).not_to have_link(champ.value)
     end
 
     # Test removal of all customizable fields
     remove_column("Demandeur")
     within ".dossiers-table" do
-      expect(page).not_to have_link("Demandeur")
+      expect(page).not_to have_button("Demandeur")
     end
   end
 

spec/system/instructeurs/procedure_sort_spec.rb

@@ -22,12 +22,12 @@ describe "procedure sort", js: true do
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s)
 
-    find("thead .number-col a").click # sort by id asc
+    click_on "Nº dossier" # sort by id asc
 
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s)
 
-    find("thead .number-col a").click # reverse order - sort by id desc
+    click_on "Nº dossier" # reverse order - sort by id desc
 
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier_2.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier.id.to_s)
@@ -44,12 +44,14 @@ describe "procedure sort", js: true do
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s)
 
-    find("thead .sva-col a").click # sort by sva date asc
+    click_on "Date décision SVA", exact: true # sort by sva date asc
+    # find("thead .sva-col a").click # sort by sva date asc
 
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s)
 
-    find("thead .sva-col a").click # reverse order - sort by sva date desc
+    click_on "Date décision SVA ↑", exact: true # reverse order - sort by sva date desc
+    # find("thead .sva-col a").click # reverse order - sort by sva date desc
 
     expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier_2.id.to_s)
     expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier.id.to_s)
@@ -74,7 +76,7 @@ describe "procedure sort", js: true do
   end
 
   scenario "should be able to sort back by notification filter after any other sort" do
-    find("thead .number-col a").click # sort by id asc
+    click_on "Nº dossier" # sort by id asc
 
     expect(page).not_to have_checked_field("Remonter les dossiers avec une notification")