refactor(admin): fix exports invitation list, also use dsfr toggle

app/assets/stylesheets/table.scss

@@ -46,17 +46,3 @@
     }
   }
 }
-
-.force-table-100 {
-  width: calc(100vw);
-}
-
-.fr-table--bordered {
-  .table {
-    &.hoverable {
-      tbody tr:hover {
-        background-color: var(--hover);
-      }
-    }
-  }
-}

app/components/dsfr/toggle_component.rb

@@ -1,6 +1,14 @@
 # frozen_string_literal: true
 
 class Dsfr::ToggleComponent < ApplicationComponent
+  attr_reader :target
+  attr_reader :title
+  attr_reader :hint
+  attr_reader :toggle_labels
+  attr_reader :disabled
+  attr_reader :data
+  attr_reader :extra_class_names
+
   def initialize(form:, target:, title:, disabled: nil, hint: nil, toggle_labels: { checked: 'Activé', unchecked: 'Désactivé' }, opt: nil, extra_class_names: nil)
     @form = form
     @target = target
@@ -8,9 +16,13 @@ class Dsfr::ToggleComponent < ApplicationComponent
     @hint = hint
     @disabled = disabled
     @toggle_labels = toggle_labels
-    @opt = opt
+    @data = opt
     @extra_class_names = extra_class_names
   end
 
-  attr_reader :toggle_labels, :extra_class_names
+  private
+
+  def input_id
+    dom_id(@form.object, target)
+  end
 end

app/components/dsfr/toggle_component/toggle_component.html.haml

@@ -1,9 +1,10 @@
 %div{ class: "fr-toggle fr-toggle--label-left #{extra_class_names}" }
-  = @form.check_box @target, class: 'fr-toggle__input', disabled: @disabled,
-    data: @opt
-  = @form.label @target,
-    @title,
+  = @form.check_box target, class: 'fr-toggle__input', disabled:, data:, id: input_id
+  = @form.label target,
+    title,
+    for: input_id,
     data: { 'fr-checked-label': toggle_labels[:checked], 'fr-unchecked-label': toggle_labels[:unchecked] },
     class: 'fr-toggle__label'
-  - if @hint
-    %p.fr-hint-text= @hint
+
+  - if hint
+    %p.fr-hint-text= hint

app/views/administrateurs/experts_procedures/index.html.haml

@@ -4,8 +4,7 @@
                     ['Avis externes']] }
 
 .fr-container
-  %h1.fr-h2
-    Avis externes
+  %h1 Avis externes
 
   = render Dsfr::CalloutComponent.new(title: nil) do |c|
     - c.with_body do
@@ -15,6 +14,8 @@
           title: t('.experts_doc.title'),
           **external_link_attributes)
 
+  %fieldset.fr-fieldset
+    .fr-fieldset__element
       %ul.fr-toggle__list
         %li
           = form_for @procedure,
@@ -92,22 +93,20 @@
               %td
                 = dsfr_icon('fr-icon-user-fill')
                 = expert_procedure.expert.email
-                %td.text-center
+              %td.fr-cell--center
                 = expert_procedure.avis.count
               - if @procedure.experts_require_administrateur_invitation
-                  %td.text-center
+                %td.fr-cell--center
                   = form_for expert_procedure,
                     url: admin_procedure_expert_path(id: expert_procedure),
                     method: :put,
-                      data: { turbo: true },
-                      html: { class: 'form procedure-form__column--form no-background' } do |f|
-                      %label.toggle-switch{ data: { controller: 'autosubmit' } }
-                        = f.check_box :allow_decision_access, class: 'toggle-switch-checkbox'
-                        %span.toggle-switch-control.round
-                        %span.toggle-switch-label.on
-                        %span.toggle-switch-label.off
+                    data: { controller: 'autosubmit', turbo: 'true' } do |f|
+                    = render Dsfr::ToggleComponent.new(form: f,
+                      title: "Notifier",
+                      target: :allow_decision_access,
+                    )
               - if @procedure.experts_require_administrateur_invitation
-                  %td.actions= button_to 'retirer',
+                %td.actions= button_to 'Retirer',
                   admin_procedure_expert_path(id: expert_procedure, procedure: @procedure),
                   method: :delete,
                   data: { confirm: "Êtes-vous sûr de vouloir révoquer l'expert « #{expert_procedure.expert.email} » de la démarche #{expert_procedure.procedure.libelle} ? Les instructeurs ne pourront plus lui demander d’avis" },