Merge pull request #7917 from tchak/fix-changes-list-style

fix(revision): fix changes list style

app/assets/stylesheets/procedure_show.scss

@@ -108,15 +108,3 @@
     margin-top: -7px;
   }
 }
-
-ul.revision-changes {
-  list-style: none;
-
-  ul {
-    list-style: none;
-
-    li {
-      padding-top: 0.25 * $default-padding;
-    }
-  }
-}

app/components/dsfr/list_component.rb

@@ -0,0 +1,4 @@
+class Dsfr::ListComponent < ApplicationComponent
+  renders_many :items
+  renders_one :empty
+end

app/components/dsfr/list_component/list_component.html.haml

@@ -0,0 +1,6 @@
+%ul
+  - if items?
+    - items.each do |item|
+      %li.fr-py-1v= item
+  - elsif empty?
+    %li.fr-py-1v= empty

app/views/administrateurs/procedures/_publication_form.html.haml

@@ -8,14 +8,15 @@
         - publication_errors.each do |_attribute, full_messages|
           %p= full_messages.to_sentence
 
-    - if !procedure.close? && procedure.draft_changed?
+    - if procedure.draft_changed?
-      %p.mb-4 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
+      - if procedure.close?
-      = render partial: 'revision_changes', locals: { changes: procedure.revision_changes }
+        %p.mb-2 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
+        = render partial: 'revision_changes', locals: { changes: procedure.revision_changes }
+        = render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
 
-    - elsif procedure.close? && procedure.draft_changed?
+      - else
-      %p.mb-4 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
+        %p.mb-2 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
-      = render partial: 'revision_changes', locals: { changes: procedure.revision_changes }
+        = render partial: 'revision_changes', locals: { changes: procedure.revision_changes }
-      = render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
 
     - else
       = render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }

app/views/administrateurs/procedures/_revision_change_attestation_template.html.haml

@@ -1,15 +1,21 @@
 - case change[:op]
 - when :add
-  %li.mb-1= t(:add, scope: [:administrateurs, :revision_changes, :attestation_template])
+  - list.with_item do
+    = t(:add, scope: [:administrateurs, :revision_changes, :attestation_template])
 - when :update
   - case change[:attribute]
   - when :title
-    %li.mb-1= t(:update_title, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])
+    - list.with_item do
+      = t(:update_title, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])
   - when :body
-    %li.mb-1= t(:update_body, scope: [:administrateurs, :revision_changes, :attestation_template])
+    - list.with_item do
+      = t(:update_body, scope: [:administrateurs, :revision_changes, :attestation_template])
   - when :footer
-    %li.mb-1= t(:update_footer, scope: [:administrateurs, :revision_changes, :attestation_template])
+    - list.with_item do
+      = t(:update_footer, scope: [:administrateurs, :revision_changes, :attestation_template])
   - when :logo
-    %li.mb-1= t(:update_logo, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])
+    - list.with_item do
+      = t(:update_logo, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])
   - when :signature
-    %li.mb-1= t(:update_signature, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])
+    - list.with_item do
+      = t(:update_signature, scope: [:administrateurs, :revision_changes, :attestation_template], to: change[:to])

app/views/administrateurs/procedures/_revision_change_type_de_champ.html.haml

@@ -1,63 +1,82 @@
 - postfix = change[:private] ? '_private' : ''
 - case change[:op]
 - when :add
-  %li.mb-1= t("add#{postfix}", label: change[:label], scope: [:administrateurs, :revision_changes])
+  - list.with_item do
+    = t("add#{postfix}", label: change[:label], scope: [:administrateurs, :revision_changes])
 - when :remove
-  %li.mb-1= t("remove#{postfix}", label: change[:label], scope: [:administrateurs, :revision_changes])
+  - list.with_item do
+    = t("remove#{postfix}", label: change[:label], scope: [:administrateurs, :revision_changes])
 - when :update
   - case change[:attribute]
   - when :libelle
-    %li.mb-1= t("update_libelle#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
+    - list.with_item do
+      = t("update_libelle#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
   - when :type_champ
-    %li.mb-1= t("update_type_champ#{postfix}", label: change[:label], to: t("activerecord.attributes.type_de_champ.type_champs.#{change[:to]}"), scope: [:administrateurs, :revision_changes])
+    - list.with_item do
+      = t("update_type_champ#{postfix}", label: change[:label], to: t("activerecord.attributes.type_de_champ.type_champs.#{change[:to]}"), scope: [:administrateurs, :revision_changes])
   - when :description
-    %li.mb-1= t("update_description#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
+    - list.with_item do
+      = t("update_description#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
   - when :drop_down_secondary_libelle
-    %li.mb-1= t("update_drop_down_secondary_libelle#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
+    - list.with_item do
+      = t("update_drop_down_secondary_libelle#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
   - when :drop_down_secondary_description
-    %li.mb-1= t("update_drop_down_secondary_description#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
+    - list.with_item do
+      = t("update_drop_down_secondary_description#{postfix}", label: change[:label], to: change[:to], scope: [:administrateurs, :revision_changes])
   - when :mandatory
     - if change[:from] == false
       -# i18n-tasks-use t('administrateurs.revision_changes.update_mandatory.enabled')
       -# i18n-tasks-use t('administrateurs.revision_changes.update_mandatory_private.enabled')
-      %li.mb-1= t("administrateurs.revision_changes.update_mandatory#{postfix}.enabled", label: change[:label])
+      - list.with_item do
+        = t("administrateurs.revision_changes.update_mandatory#{postfix}.enabled", label: change[:label])
     - else
       -# i18n-tasks-use t('administrateurs.revision_changes.update_mandatory.disabled')
       -# i18n-tasks-use t('administrateurs.revision_changes.update_mandatory_private.disabled')
-      %li.mb-1= t("administrateurs.revision_changes.update_mandatory#{postfix}.disabled", label: change[:label])
+      - list.with_item do
+        = t("administrateurs.revision_changes.update_mandatory#{postfix}.disabled", label: change[:label])
   - when :piece_justificative_template
     -# i18n-tasks-use t('administrateurs.revision_changes.update_piece_justificative_template')
     -# i18n-tasks-use t('administrateurs.revision_changes.update_piece_justificative_template_private')
-    %li.mb-1= t("administrateurs.revision_changes.update_piece_justificative_template#{postfix}", label: change[:label])
+    - list.with_item do
+      = t("administrateurs.revision_changes.update_piece_justificative_template#{postfix}", label: change[:label])
   - when :drop_down_options
     - added = change[:to].sort - change[:from].sort
     - removed = change[:from].sort - change[:to].sort
-    %li.mb-1
+    - list.with_item do
       = t("update_drop_down_options#{postfix}", scope: [:administrateurs, :revision_changes], label: change[:label])
-      %ul
+      = render Dsfr::ListComponent.new do |list|
         - if added.present?
-          %li= t(:add_option, scope: [:administrateurs, :revision_changes], items: added.map{ |term| "« #{term.strip} »" }.join(", "))
+          - list.with_item do
+            = t(:add_option, scope: [:administrateurs, :revision_changes], items: added.map{ |term| "« #{term.strip} »" }.join(", "))
         - if removed.present?
-          %li= t(:remove_option, scope: [:administrateurs, :revision_changes], items: removed.map{ |term| "« #{term.strip} »" }.join(", "))
+          - list.with_item do
+            = t(:remove_option, scope: [:administrateurs, :revision_changes], items: removed.map{ |term| "« #{term.strip} »" }.join(", "))
   - when :drop_down_other
     - if change[:from] == false
-      %li.mb-1= t("administrateurs.revision_changes.update_drop_down_other#{postfix}.enabled", label: change[:label])
+      - list.with_item do
+        = t("administrateurs.revision_changes.update_drop_down_other#{postfix}.enabled", label: change[:label])
     - else
-      %li.mb-1= t("administrateurs.revision_changes.update_drop_down_other#{postfix}.disabled", label: change[:label])
+      - list.with_item do
+        = t("administrateurs.revision_changes.update_drop_down_other#{postfix}.disabled", label: change[:label])
   - when :carte_layers
     - added = change[:to].sort - change[:from].sort
     - removed = change[:from].sort - change[:to].sort
-    %li.mb-1
+    - list.with_item do
       = t("update_carte_layers#{postfix}", scope: [:administrateurs, :revision_changes], label: change[:label])
-      %ul
+      = render Dsfr::ListComponent.new do |list|
         - if added.present?
-          %li= t(:add_option, scope: [:administrateurs, :revision_changes], items: added.map{ |term| "« #{t(term, scope: [:administrateurs, :carte_layers])} »" }.join(", "))
+          - list.with_item do
+            = t(:add_option, scope: [:administrateurs, :revision_changes], items: added.map{ |term| "« #{t(term, scope: [:administrateurs, :carte_layers])} »" }.join(", "))
         - if removed.present?
-          %li= t(:remove_option, scope: [:administrateurs, :revision_changes], items: removed.map{ |term| "« #{t(term, scope: [:administrateurs, :carte_layers])} »" }.join(", "))
+          - list.with_item do
+            = t(:remove_option, scope: [:administrateurs, :revision_changes], items: removed.map{ |term| "« #{t(term, scope: [:administrateurs, :carte_layers])} »" }.join(", "))
   - when :condition
     - if change[:from].nil?
-      %li= t(:add_condition, scope: [:administrateurs, :revision_changes], label: change[:label], to: change[:to])
+      - list.with_item do
+        = t(:add_condition, scope: [:administrateurs, :revision_changes], label: change[:label], to: change[:to])
     - elsif change[:to].nil?
-      %li= t(:remove_condition, scope: [:administrateurs, :revision_changes], label: change[:label])
+      - list.with_item do
+        = t(:remove_condition, scope: [:administrateurs, :revision_changes], label: change[:label])
     - else
-      %li= t(:update_condition, scope: [:administrateurs, :revision_changes], label: change[:label], to: change[:to])
+      - list.with_item do
+        = t(:update_condition, scope: [:administrateurs, :revision_changes], label: change[:label], to: change[:to])

app/views/administrateurs/procedures/_revision_changes.html.haml

@@ -1,14 +1,13 @@
-%ul.revision-changes
+= render Dsfr::ListComponent.new do |list|
-  - if changes.empty?
+  - list.with_empty do
-    %li.mb-1= t(:no_changes, scope: [:administrateurs, :revision_changes])
+    = t(:no_changes, scope: [:administrateurs, :revision_changes])
-  - else
+
-    - changes.filter { |change| change[:model] == :attestation_template }.each do |change|
+  = render partial: 'administrateurs/procedures/revision_change_attestation_template', collection: changes.filter { |change| change[:model] == :attestation_template }, as: :change, locals: { list: list }
-      = render partial: 'administrateurs/procedures/revision_change_attestation_template', locals: { change: change }
+  = render partial: "administrateurs/procedures/revision_change_type_de_champ", collection: changes.filter { |change| change[:model] == :type_de_champ }, as: :change, locals: { list: list }
-    = render partial: "administrateurs/procedures/revision_change_type_de_champ",
+  - move_changes, move_private_changes = changes.filter { |change| change[:op] == :move }.partition { |change| !change[:private] }
-        collection: changes.filter { |change| change[:model] == :type_de_champ },
+  - if move_changes.present?
-        as: :change
+    - list.with_item do
-    - move_changes, move_private_changes = changes.filter { |change| change[:op] == :move }.partition { |change| !change[:private] }
+      = t(:move, scope: [:administrateurs, :revision_changes], count: move_changes.size)
-    - if move_changes.present?
+  - if move_private_changes.present?
-      %li.mb-1= t(:move, scope: [:administrateurs, :revision_changes], count: move_changes.size)
+    - list.with_item do
-    - if move_private_changes.present?
+      = t(:move_private, scope: [:administrateurs, :revision_changes], count: move_private_changes.size)
-      %li.mb-1= t(:move_private, scope: [:administrateurs, :revision_changes], count: move_private_changes.size)