Got last message showed upon messages, adding condition to toggle out this last message on lick

app/assets/javascripts/default_data_block.js

@@ -12,6 +12,9 @@ function init_default_data_block() {
 
     function toggle_default_data_bloc(element, duration){
         var block = $(element).parents('.show-block');
+        if (block.attr("id") == "messages") {
+          block.children(".last-message").toggle();
+        }
 
         block.children(".body").slideToggle(duration);
 

app/assets/stylesheets/default_data_block.scss

@@ -57,4 +57,4 @@
     height: 100px;
     display: none;
   }
-}
+}

app/assets/stylesheets/dossier_show.scss

@@ -1,6 +1,33 @@
 #backoffice_dossier_show {
 
-  #message {
+  #messages {
+    .last-message {
+      display: block;
+      background-color: #FFFFFF;
+      padding: 20px;
+      .comment-header {
+        font-family: Arial;
+        font-size: 14px;
+        font-weight: bold;
+        line-height: 16px;
+        color: #000000;
+        margin-bottom: 10px;
+      }
+      .content {
+        margin-bottom: 20px;
+      }
+      .new-action {
+        background-color: #E45B51;
+        text-align: center;
+        color: #FFFFFF;
+        width: 253px;
+        height: 40px;
+        line-height: 40px;
+        font-family: Arial;
+        font-size: 16px;
+        font-weight: bold;
+      }
+    }
   }
   #infos {
   }

app/models/commentaire.rb

@@ -3,4 +3,8 @@ class Commentaire < ActiveRecord::Base
   belongs_to :champ
 
   belongs_to :piece_justificative
+
+  def header
+    "#{email}, " + created_at.localtime.strftime('%d %b %Y %H:%M')
+  end
 end

app/views/backoffice/dossiers/show.html.haml

@@ -11,6 +11,18 @@
           - message_count = @facade.commentaires.count
           = (message_count == 1) ? "1 message" : "#{message_count} messages"
       %div.body
+      - if last_comment = @facade.commentaires.first
+        %div.last-message
+          %div.row
+            %div.col-lg-12.col-md-12.comment-header
+              = "DERNIER MESSAGE (#{last_comment.header})"
+          %div.row
+            %div.col-lg-12.col-md-12.content
+              = last_comment.body.html_safe
+          %div.row
+            %div.col-lg-12.col-md-12
+              %div.new-action
+                ENVOYER UN MESSAGE
 
   .default_data_block
     %div.row.show-block#infos
@@ -32,6 +44,7 @@
           EDITER
       %div.body
 
+- if false
   %h1#dossier_id.text-info{ :style => 'text-align:right'}
     = t('dynamics.dossiers.numéro') + @facade.dossier.id.to_s