views: refactor the attachment/edit view

Make it more reusable, by:

- Renaming `attachment/update` to `attachment/edit`
- Refactoring the CSS styles into their own stylesheet
- Allow to specify the 'accept' option

app/views/attachments/destroy.js.erb

@@ -1,3 +1,3 @@
 <%= render_flash(timeout: 5000, sticky: true) %>
-<%= remove_element("#piece_justificative_#{@attachment_id}") %>
-<%= show_element("#piece_justificative_file_#{@attachment_id}") %>
+<%= remove_element("#attachment_#{@attachment_id}") %>
+<%= show_element("#attachment_file_#{@attachment_id}") %>

app/views/attachments/show.js.erb

@@ -1,4 +1,4 @@
-<%= render_to_element(".pj-link[data-attachment-id=\"#{@attachment.id}\"]",
+<%= render_to_element(".attachment-link[data-attachment-id=\"#{@attachment.id}\"]",
   partial: 'shared/attachment/show',
   outer: true,
   locals: { attachment: @attachment, user_can_upload: @user_can_upload }) %>

app/views/instructeurs/avis/instruction.html.haml

@@ -13,7 +13,10 @@
 
     = form_for @avis, url: instructeur_avis_path(@avis), html: { class: 'form' } do |f|
       = f.text_area :answer, rows: 3, placeholder: 'Votre avis', required: true
-      = render partial: "shared/attachment/update", locals: { attachment: @avis.piece_justificative_file.attachment, user_can_destroy: true, form: f }
+      = render 'shared/attachment/edit',
+        { form: f,
+          attached_file: @avis.piece_justificative_file,
+          user_can_destroy: true }
 
       .flex.justify-between.align-baseline
         %p.confidentiel.flex

app/views/shared/attachment/_edit.html.haml

@@ -0,0 +1,29 @@
+-# Display a widget for uploading, editing and deleting a file attachment
+
+- attachment = attached_file.attachment
+- attachment_id = attachment ? attachment.id : SecureRandom.uuid
+- persisted = attachment && attachment.persisted?
+- accept = defined?(accept) ? accept : nil
+- user_can_destroy = defined?(user_can_destroy) ? user_can_destroy : false
+
+.attachment
+  - if defined?(template) && template.attached?
+    %p.mb-1
+      Veuillez télécharger, remplir et joindre
+      = link_to('le modèle suivant', url_for(template), target: '_blank', rel: 'noopener')
+
+  - if persisted
+    .attachment-actions{ id: "attachment_#{attachment_id}" }
+      .attachment-action
+        = render partial: "shared/attachment/show", locals: { attachment: attachment, user_can_upload: true }
+      - if user_can_destroy
+        .attachment-action
+          = link_to 'Supprimer', attachment_url(attachment.id, { signed_id: attachment.blob.signed_id }), remote: true, method: :delete, class: 'button small danger'
+      .attachment-action
+        = button_tag 'Remplacer', type: 'button', class: 'button small', data: { 'toggle-target': "#attachment_file_#{attachment_id}" }
+
+  = form.file_field attached_file.name,
+    id: "attachment_file_#{attachment_id}",
+    class: "attachment-input #{'hidden' if persisted}",
+    accept: accept,
+    direct_upload: true

app/views/shared/attachment/_show.html.haml

@@ -5,7 +5,7 @@
 - else
   - attachment_check_url = attachment_url(attachment.id, { signed_id: attachment.blob.signed_id, user_can_upload: user_can_upload })
 
-.pj-link{ 'data-attachment-id': attachment.id, 'data-attachment-check-url': attachment_check_url }
+.attachment-link{ 'data-attachment-id': attachment.id, 'data-attachment-check-url': attachment_check_url }
   - if should_display_link
     = link_to url_for(attachment.blob), target: '_blank', rel: 'noopener',  title: "Télécharger la pièce jointe" do
       %span.icon.attachment

app/views/shared/attachment/_update.html.haml

@@ -1,24 +0,0 @@
-.piece-justificative
-  - if defined?(template) && template.attached?
-    %p.edit-pj-template.mb-1
-      Veuillez télécharger, remplir et joindre
-      = link_to('le modèle suivant', url_for(template), target: '_blank', rel: 'noopener')
-
-  - attachment_id = attachment ? attachment.id : SecureRandom.uuid
-  - persisted = attachment && attachment.persisted?
-  - user_can_destroy = defined?(user_can_destroy) ? user_can_destroy : false
-
-  - if persisted
-    .piece-justificative-actions{ id: "piece_justificative_#{attachment_id}" }
-      .piece-justificative-action
-        = render partial: "shared/attachment/show", locals: { attachment: attachment, user_can_upload: true }
-      - if user_can_destroy
-        .piece-justificative-action
-          = link_to 'Supprimer', attachment_url(attachment.id, { signed_id: attachment.blob.signed_id }), remote: true, method: :delete, class: 'button small danger'
-      .piece-justificative-action
-        = button_tag 'Remplacer', type: 'button', class: 'button small', data: { 'toggle-target': "#piece_justificative_file_#{attachment_id}" }
-
-  = form.file_field :piece_justificative_file,
-    id: "piece_justificative_file_#{attachment_id}",
-    class: "piece-justificative-input #{'hidden' if persisted}",
-    direct_upload: true

app/views/shared/dossiers/editable_champs/_piece_justificative.html.haml

@@ -1 +1,4 @@
-= render partial: "shared/attachment/update", locals: { attachment: champ.piece_justificative_file.attachment, template: champ.type_de_champ.piece_justificative_template, user_can_destroy: true, form: form }
+= render 'shared/attachment/edit',
+  { form: form,
+    attached_file: champ.piece_justificative_file,
+    template: champ.type_de_champ.piece_justificative_template, user_can_destroy: true }