style(piece_justificative): input ux & list accepted formats

app/components/attachment/edit_component.rb

@@ -4,6 +4,8 @@ class Attachment::EditComponent < ApplicationComponent
 
   delegate :persisted?, to: :attachment, allow_nil: true
 
+  EXTENSIONS_ORDER = ['jpeg', 'png', 'pdf', 'zip'].freeze
+
   def initialize(form:, attached_file:, user_can_destroy: false, direct_upload: true, id: nil, index: 0, **kwargs)
     @form = form
     @attached_file = attached_file
@@ -49,7 +51,7 @@ class Attachment::EditComponent < ApplicationComponent
   def file_field_options
     track_issue_with_missing_validators if missing_validators?
     {
-      class: "attachment-input #{attachment_input_class} #{'hidden' if persisted?}",
+      class: "fr-text--sm attachment-input #{attachment_input_class} #{'hidden' if persisted?}",
       direct_upload: @direct_upload,
       id: input_id(@id),
       aria: { describedby: champ&.describedby_id },
@@ -115,6 +117,16 @@ class Attachment::EditComponent < ApplicationComponent
     list.join(', ')
   end
 
+  def allowed_formats
+    return nil unless champ&.titre_identite?
+
+    @allowed_formats ||= begin
+                           content_type_validator.options[:in].filter_map do |content_type|
+                             MiniMime.lookup_by_content_type(content_type)&.extension
+                           end.uniq.sort_by { EXTENSIONS_ORDER.index(_1) || 999 }
+                         end
+  end
+
   def has_content_type_validator?
     !content_type_validator.nil?
   end

app/components/attachment/edit_component/edit_component.html.haml

@@ -18,8 +18,11 @@
       Ré-essayer
 
   - if !persisted?
-    %label.text-sm.font-weight-normal{ for: file_field_options[:id] }
+    %p.fr-text--sm.fr-text-mention--grey
       = t('.max_file_size', max_file_size: number_to_human_size(max_file_size))
+      - if allowed_formats
+        Formats supportés :
+        = allowed_formats.join(', ')
 
   %p= form.file_field(file_field_name, **file_field_options)
 

app/components/editable_champ/editable_champ_component/editable_champ_component.html.haml

@@ -7,7 +7,7 @@
   - elsif has_label?(@champ)
     = render EditableChamp::ChampLabelComponent.new form: @form, champ: @champ, seen_at: @seen_at
   - if @champ.type_champ == "titre_identite"
-    %p.notice  Carte nationale d’identité (uniquement le recto), passeport, titre de séjour ou autre justificatif d’identité. Formats acceptés : jpg/png
+    %p.notice  Carte nationale d’identité (uniquement le recto), passeport, titre de séjour ou autre justificatif d’identité.
 
   = @form.hidden_field :id, value: @champ.id, data: @champ.block? ? { id: true } : {}
   = render component_class.new(form: @form, champ: @champ, seen_at: @seen_at)