Fixing the notification listing ui

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.notification.listing/listing.hbs

@@ -15,8 +15,9 @@
   specific language governing permissions and limitations
   under the License.
 }}
-<span id="permission" data-permission="{{permissions}}"></span>
-<div class="row">
+{{#zone "content"}}
+    <span id="permission" data-permission="{{permissions}}"></span>
+    <div class="row">
         <div class="col-md-12">
             <!-- content -->
             <div id="config-save-form" class="container col-centered wr-content">
@@ -27,8 +28,7 @@
                 <div class="wr-advance-operations">
                     <div class="row no-gutter">
                         <div class="wr-hidden-operations-nav col-lg-4">
-                        <a id="unReadNotifications" href="javascript:void(0)"
-                           onclick="showAdvanceOperation('unread', this)" class="selected">
+                            <a id="unReadNotifications" href="javascript:void(0)" onclick="showAdvanceOperation('unread', this)" class="selected">
                                 <span class="wr-hidden-operations-icon fw-stack">
                                     <i class="fw fw-mail fw-stack-2x"></i>
                                 </span>
@@ -52,10 +52,11 @@
             </div>
             <!-- /content -->
         </div>
-</div>
+    </div>
+{{/zone}}
 {{#zone "bottomJs"}}
     <script id="notification-listing" data-current-user="{{currentUser.username}}"
-            data-image-resource="{{self.publicURL}}/images/" src="{{self.publicURL}}/templates/notification-listing.hbs"
+            data-image-resource="{{@unit.publicUri}}/images/" src="{{@unit.publicUri}}/templates/notification-listing.hbs"
             type="text/x-handlebars-template"></script>
     {{js "js/notification-listing.js"}}
 {{/zone}}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.notification.listing/listing.js

@@ -16,15 +16,16 @@
  * under the License.
  */
 
-function onRequest(context){
+function onRequest(context) {
     var userModule = require("/app/modules/business-controllers/user.js")["userModule"];
     var constants = require("/app/modules/constants.js");
+    var viewModel = {};
     var permissions = [];
-    if(userModule.isAuthorized("/permission/admin/device-mgt/emm-admin/notifications/list")){
+    if (userModule.isAuthorized("/permission/admin/device-mgt/emm-admin/notifications/list")) {
         permissions.push("LIST_NOTIFICATIONS");
     }
     var currentUser = session.get(constants.USER_SESSION_KEY);
-    context.permissions = stringify(permissions);
-    context.currentUser = currentUser;
-    return context;
+    viewModel.permissions = stringify(permissions);
+    viewModel.currentUser = currentUser;
+    return viewModel;
 }

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.notification.listing/public/js/notification-listing.js

@@ -91,8 +91,8 @@ function loadNotifications(){
         var successCallback = function (data) {
             var viewModel = {};
             data = JSON.parse(data);
-            viewModel.notifications = data;
-            if(data.length > 0){
+            viewModel.notifications = data.notifications;
+            if(data.count > 0){
                 var content = template(viewModel);
                 $("#ast-container").html(content);
                 $('#unread-notifications').datatables_extended();

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.notification.listing/public/templates/notification-listing.hbs

@@ -16,10 +16,10 @@
                 <tbody>
                 {{#each notifications}}
                     {{#equal "NEW" status }}
-                        <tr data-type="selectable" data-id="{{notificationId}}">
+                        <tr data-type="selectable" data-id="{{id}}">
                             <td data-display="{{description}}" data-grid-label="Description">{{description}}</td>
                             <td style="text-align: center;">
-                                <a href="#" data-id="{{notificationId}}" data-url="device/{{deviceIdentifier.type}}/{{deviceIdentifier.id}}" class="new-notification" data-click-event="remove-form">
+                                <a href="device?type={{deviceIdentifier.type}}&id={{deviceIdentifier.id}}" data-id="{{id}}" data-url="device?type={{deviceIdentifier.type}}&id={{deviceIdentifier.id}}" class="new-notification" data-click-event="remove-form">
                                      <span class="fw-stack">
                                         <i class="fw fw-ring fw-stack-2x"></i>
                                         <i class="fw fw-view fw-stack-1x"></i>
@@ -54,10 +54,10 @@
                 </thead>
                 <tbody>
                 {{#each notifications}}
-                    <tr data-type="selectable" data-id="{{notificationId}}">
+                    <tr data-type="selectable" data-id="{{id}}">
                         <td  data-display="{{description}}" data-grid-label="Description">{{description}}</td>
                         <td style="text-align: center;">
-                            <a href="device/{{deviceIdentifier.type}}/{{deviceIdentifier.id}}" data-click-event="remove-form">
+                            <a href="device?type={{deviceIdentifier.type}}&id={{deviceIdentifier.id}}" data-click-event="remove-form">
                                  <span class="fw-stack">
                                     <i class="fw fw-ring fw-stack-2x"></i>
                                     <i class="fw fw-view fw-stack-1x"></i>