feat(message): replace message partial with MessageComponent

app/components/dossiers/message_component/message_component.en.yml

@@ -0,0 +1,9 @@
+---
+en:
+  reply: Reply
+  guest: Guest
+  delete_button: Delete this message
+  confirm: Are you sure you want to delete this message ?
+  automatic_email: Automatic email
+  you: You
+  deleted_body: Message deleted

app/components/dossiers/message_component/message_component.fr.yml

@@ -0,0 +1,9 @@
+---
+fr:
+  reply: Répondre
+  guest: Invité
+  delete_button: Supprimer le message
+  confirm: Êtes-vous sûr de vouloir supprimer ce message ?
+  automatic_email: Email automatique
+  you: Vous
+  deleted_body: Message supprimé

app/components/dossiers/message_component/message_component.html.haml

@@ -0,0 +1,26 @@
+= image_tag(icon_path, class: 'person-icon', alt: '')
+
+.width-100
+  %h2
+    %span.mail
+      = commentaire_issuer
+    - if commentaire_from_guest?
+      %span.guest= t('.guest')
+    %span.date{ class: highlight_if_unseen_class }
+      = commentaire_date
+  .rich-text= commentaire_body
+
+  .message-extras.flex.justify-start
+    - if commentaire.soft_deletable?(connected_user)
+      = button_to instructeur_commentaire_path(commentaire.dossier.procedure, commentaire.dossier, commentaire), method: :delete,  class: 'button danger', form: { data: { turbo: true, turbo_confirm: t('.confirm') } } do
+        %span.icon.delete
+        = t('.delete_button')
+
+    - if commentaire.piece_jointe.attached?
+      .attachment-link
+        = render partial: "shared/attachment/show", locals: { attachment: commentaire.piece_jointe.attachment }
+
+    - if show_reply_button?
+      = button_tag type: 'button', class: 'button small message-answer-button', onclick: 'document.querySelector("#commentaire_body").focus()' do
+        %span.icon.reply
+        = t('.reply')