From bae00091201fd4233c17f4437dd57291d2ae117c Mon Sep 17 00:00:00 2001 From: Colin Darie Date: Wed, 13 Nov 2024 19:05:05 +0100 Subject: [PATCH] refactor(admin): fix exports invitation list, also use dsfr toggle --- app/assets/stylesheets/table.scss | 14 -- app/components/dsfr/toggle_component.rb | 16 +- .../toggle_component.html.haml | 13 +- .../experts_procedures/index.html.haml | 179 +++++++++--------- 4 files changed, 110 insertions(+), 112 deletions(-) diff --git a/app/assets/stylesheets/table.scss b/app/assets/stylesheets/table.scss index 7043823a4..d4589b306 100644 --- a/app/assets/stylesheets/table.scss +++ b/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); - } - } - } -} diff --git a/app/components/dsfr/toggle_component.rb b/app/components/dsfr/toggle_component.rb index 7e7f3ca40..43084c6f0 100644 --- a/app/components/dsfr/toggle_component.rb +++ b/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 diff --git a/app/components/dsfr/toggle_component/toggle_component.html.haml b/app/components/dsfr/toggle_component/toggle_component.html.haml index 18bde573d..90fa24433 100644 --- a/app/components/dsfr/toggle_component/toggle_component.html.haml +++ b/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 diff --git a/app/views/administrateurs/experts_procedures/index.html.haml b/app/views/administrateurs/experts_procedures/index.html.haml index 865d1cb67..f021fcb58 100644 --- a/app/views/administrateurs/experts_procedures/index.html.haml +++ b/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,106 +14,106 @@ title: t('.experts_doc.title'), **external_link_attributes) - %ul.fr-toggle__list - %li - = form_for @procedure, - method: :put, - url: allow_expert_review_admin_procedure_path(@procedure), - data: { controller: 'autosubmit', turbo: 'true' } do |f| + %fieldset.fr-fieldset + .fr-fieldset__element + %ul.fr-toggle__list + %li + = form_for @procedure, + method: :put, + url: allow_expert_review_admin_procedure_path(@procedure), + data: { controller: 'autosubmit', turbo: 'true' } do |f| - = render Dsfr::ToggleComponent.new(form: f, - target: :allow_expert_review, - title: t('.titles.allow_invite_experts'), - hint: t('.descriptions.allow_invite_experts'), - disabled: false, - extra_class_names: 'fr-toggle--border-bottom') + = render Dsfr::ToggleComponent.new(form: f, + target: :allow_expert_review, + title: t('.titles.allow_invite_experts'), + hint: t('.descriptions.allow_invite_experts'), + disabled: false, + extra_class_names: 'fr-toggle--border-bottom') - - if @procedure.allow_expert_review? - %li - = form_for @procedure, - method: :put, - url: allow_expert_messaging_admin_procedure_path(@procedure), - data: { controller: 'autosubmit', turbo: 'true' } do |f| + - if @procedure.allow_expert_review? + %li + = form_for @procedure, + method: :put, + url: allow_expert_messaging_admin_procedure_path(@procedure), + data: { controller: 'autosubmit', turbo: 'true' } do |f| - = render Dsfr::ToggleComponent.new(form: f, - target: :allow_expert_messaging, - title: t('.titles.allow_expert_messaging'), - hint: t('.descriptions.allow_expert_messaging'), - disabled: false, - extra_class_names: 'fr-toggle--border-bottom') + = render Dsfr::ToggleComponent.new(form: f, + target: :allow_expert_messaging, + title: t('.titles.allow_expert_messaging'), + hint: t('.descriptions.allow_expert_messaging'), + disabled: false, + extra_class_names: 'fr-toggle--border-bottom') - %li - = form_for @procedure, - method: :put, - url: experts_require_administrateur_invitation_admin_procedure_path(@procedure), - data: { controller: 'autosubmit', turbo: 'true' } do |f| + %li + = form_for @procedure, + method: :put, + url: experts_require_administrateur_invitation_admin_procedure_path(@procedure), + data: { controller: 'autosubmit', turbo: 'true' } do |f| - = render Dsfr::ToggleComponent.new(form: f, - target: :experts_require_administrateur_invitation, - title: t('.titles.manage_procedure_experts'), - hint: t('.descriptions.manage_procedure_experts'), - disabled: false) + = render Dsfr::ToggleComponent.new(form: f, + target: :experts_require_administrateur_invitation, + title: t('.titles.manage_procedure_experts'), + hint: t('.descriptions.manage_procedure_experts'), + disabled: false) - - if @procedure.experts_require_administrateur_invitation? - .card - = render Procedure::InvitationWithTypoComponent.new(maybe_typos: @maybe_typos, url: admin_procedure_experts_path(@procedure), title: "Avant d'ajouter l'email à la liste d'expert prédéfinie, veuillez confirmer" ) - = form_for :experts_procedure, - url: admin_procedure_experts_path(@procedure), - html: { class: 'form' } do |f| + - if @procedure.experts_require_administrateur_invitation? + .card + = render Procedure::InvitationWithTypoComponent.new(maybe_typos: @maybe_typos, url: admin_procedure_experts_path(@procedure), title: "Avant d'ajouter l'email à la liste d'expert prédéfinie, veuillez confirmer" ) + = form_for :experts_procedure, + url: admin_procedure_experts_path(@procedure), + html: { class: 'form' } do |f| - .instructeur-wrapper - %p#experts-emails Entrez les adresses emails des experts que vous souhaitez ajouter à la liste prédéfinie - %react-fragment - = render ReactComponent.new "ComboBox/MultiComboBox", - id: 'emails', - name: 'emails[]', - allows_custom_value: true, - 'aria-label': 'Emails', - 'aria-describedby': 'experts-emails' + .instructeur-wrapper + %p#experts-emails Entrez les adresses emails des experts que vous souhaitez ajouter à la liste prédéfinie + %react-fragment + = render ReactComponent.new "ComboBox/MultiComboBox", + id: 'emails', + name: 'emails[]', + allows_custom_value: true, + 'aria-label': 'Emails', + 'aria-describedby': 'experts-emails' - = f.submit 'Ajouter à la liste', class: 'fr-btn' + = f.submit 'Ajouter à la liste', class: 'fr-btn' - - if @experts_procedure.present? - .fr-table.fr-table--no-caption.fr-table--layout-fixed.fr-mt-3w - %table - %thead + - if @experts_procedure.present? + .fr-table.fr-table--no-caption.fr-table--layout-fixed.fr-mt-3w + %table + %thead + %tr + %th Liste des experts + %th Nombre d’avis + - if @procedure.experts_require_administrateur_invitation + %th Notifier des décisions sur les dossiers + - if @procedure.experts_require_administrateur_invitation + %th Action + %tbody + - @experts_procedure.each do |expert_procedure| %tr - %th Liste des experts - %th Nombre d’avis + %td + = dsfr_icon('fr-icon-user-fill') + = expert_procedure.expert.email + %td.fr-cell--center + = expert_procedure.avis.count - if @procedure.experts_require_administrateur_invitation - %th Notifier des décisions sur les dossiers + %td.fr-cell--center + = form_for expert_procedure, + url: admin_procedure_expert_path(id: expert_procedure), + method: :put, + 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 - %th Action - %tbody - - @experts_procedure.each do |expert_procedure| - %tr - %td - = dsfr_icon('fr-icon-user-fill') - = expert_procedure.expert.email - %td.text-center - = expert_procedure.avis.count - - if @procedure.experts_require_administrateur_invitation - %td.text-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 - - if @procedure.experts_require_administrateur_invitation - %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" }, - class: 'fr-btn fr-btn--secondary' - - else - .blank-tab - %h2.empty-text Aucun expert invité pour le moment. - %p.empty-text-details Les instructeurs de cette démarche n’ont pas encore fait appel aux experts. + %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" }, + class: 'fr-btn fr-btn--secondary' + - else + .blank-tab + %h2.empty-text Aucun expert invité pour le moment. + %p.empty-text-details Les instructeurs de cette démarche n’ont pas encore fait appel aux experts. = render Procedure::FixedFooterComponent.new(procedure: @procedure)