Allowing custom templates inside notification note

Packages/ohif-core/client/components/bootstrap/notification/notificationArea.styl

@@ -25,7 +25,7 @@
       position: relative
 
       &:not(.hide-dismiss)
-        padding-right: 40px
+        padding-right: 50px
 
         .note-dismiss
           display: block
@@ -46,9 +46,17 @@
         position: absolute
         text-align: center
         top: 50%
-        transform(translateY(-50%))
+        transform(translateY(-50%) rotate(0deg))
+        transform-origin(50% 50%)
+        transition(transform 0.3s ease)
         width: 100%
 
+      &:hover
+        background: rgba(0, 0, 0, 0.1)
+
+        i
+          transform(translateY(-50%) rotate(180deg))
+
   &.in
     max-height: auto
     opacity: 1

Packages/ohif-core/client/components/bootstrap/notification/notificationNote.html

@@ -2,7 +2,13 @@
     <div class="notification-note {{this.class}}">
         <div class="note-container">
             <div class="note-body alert alert-{{choose this.style 'info'}} {{#if hideDismiss}}hide-dismiss{{/if}}">
-                <div class="note-text">{{this.text}}</div>
+                <div class="note-content">
+                    {{#if this.template}}
+                        {{>Template.dynamic template=this.template data=(choose this.templateData this)}}
+                    {{else}}
+                        {{this.text}}
+                    {{/if}}
+                </div>
                 <div class="note-dismiss">
                     <i class="fa fa-times"></i>
                 </div>

Packages/ohif-core/client/ui/notifications/notifications.js

@@ -37,7 +37,7 @@ Notifications.dismiss = id => {
 Notifications.clear = () => Array.from(Notifications.views.keys()).forEach(Notifications.dismiss);
 
 // Display a notification note
-Notifications.show = ({ template, promise, text, style, timeout=5000 }) => {
+Notifications.show = ({ template, data, text, style, timeout=5000, promise }) => {
     // Check if the given template exists
     const templateObject = Template[template];
     if (template && !templateObject) {
@@ -52,6 +52,8 @@ Notifications.show = ({ template, promise, text, style, timeout=5000 }) => {
 
     let notificationPromise;
     let templateData = {
+        template,
+        data,
         text,
         style,
         timeout,