Notifications are shown in backoffice dossier show, limit 5

app/assets/stylesheets/left_pannel.scss

@@ -64,17 +64,27 @@
       width: 200px;
       margin-top: 20px;
     }
-    .tips {
+    .notifications {
-      margin: 0 10px 0 5px;
+      margin: 20px 10px 0 5px;
       .fa {
-        color: #FFFFFF;
+        font-size: 25px;
-        font-size: 40px;
+        width: 100%;
-        width: inherit;
+        margin: 0 0 15px 0;
-        padding: 5px;
       }
-      .notice {
+      .notification {
-        font-size: 18px;
+        margin: 10px 0 10px 0;
-        display: initial;
+        .type {
+          margin-bottom: 20px;
+        }
+        .updated-at {
+          color: #CCCCCC;
+          font-size: 12px;
+          text-align: left;
+        }
+        .split-hr {
+          width: 40px;
+          margin: auto;
+        }
       }
     }
   }

app/services/notification_service.rb

@@ -39,4 +39,4 @@ class NotificationService
         'Notification par défaut'
     end
   end
-end
+end

app/services/sync_credentials_service.rb

@@ -35,4 +35,4 @@ class SyncCredentialsService
       end
     end
   end
-end
+end

app/views/layouts/left_panels/_left_panel_backoffice_dossierscontroller_show.html.haml

@@ -30,6 +30,10 @@
   %div.split-hr-left
   %div.dossier-state= @facade.dossier.display_state
   %div.split-hr-left
-  %div.tips.hidden
+  %div.notifications
-    %i.fa.fa-lightbulb-o
+    %i.fa.fa-bell-o
-    %div.notice= "Ceci est un bloc destiné à contenir des informations sur ce que vous êtes censé pouvoir faire à ce stade de traitement du dossier."
+    - @facade.dossier.notifications.limit(5).each do |notification|
+      .notification
+        .updated-at= notification.updated_at.strftime('%d/%m/%Y %H:%M')
+        .type= notification.liste.last
+        .split-hr