activity screen - do not show blank slate when search is active AGPUSH-1500

admin-ui/app/components/app-detail/include/activity.html

@@ -1,4 +1,4 @@
-<div ng-if="activity.totalCount > 0">
+<div ng-if="activity.totalCount > 0 || activity.isSearchActive()">
   <h3>Notification activity</h3>
 
   <p>Explore push messages that you have sent to the registered devices.</p>
@@ -29,6 +29,11 @@ <h3>Notification activity</h3>
     </tr>
     </thead>
     <tbody>
+    <tr class="odd" ng-if="activity.totalCount === 0">
+      <td valign="top" align="center" colspan="8" class="dataTables_empty">
+        <p>No message matches the given search criteria.</p>
+      </td>
+    </tr>
     <tr ng-repeat-start="metric in activity.metrics">
       <td>
         <a href ng-click="metric.$toggled = !metric.$toggled">
@@ -93,7 +98,7 @@ <h3>Notification activity</h3>
   </div>
 </div><!-- ng-if -->
 
-<div class="blank-slate-pf" ng-if="activity.totalCount == 0">
+<div class="blank-slate-pf" ng-if="activity.totalCount == 0 && !activity.isSearchActive()">
   <div class="blank-slate-pf-icon">
     <i class="fa fa-table"></i>
   </div>
@@ -103,12 +108,7 @@ <h1 ng-if="appDetail.app.$deviceCount != 0">You haven't send push notifications
 
   <div ng-if="appDetail.app.$deviceCount == 0">
     <p>There are no registered device for this application.</p>
-    <div class="blank-slate-pf-main-action">
-      <a href class="btn btn-primary btn-lg" ng-link="appDetail({app: appDetail.app.pushApplicationID, tab: 'variants'})" ng-disabled="!appDetail.app.variants.length">
-        <i class="fa fa-paper-plane"></i>
-        Register a device
-      </a>
-    </div>
+    <p>Check out the documentation on how to get started to <a ups-doc="docs-push-getting-started">register a device</a>.</p>
   </div>
 
   <div ng-if="appDetail.app.$deviceCount != 0">

admin-ui/app/components/app-detail/include/activity.js

@@ -11,12 +11,17 @@ angular.module('upsConsole')
     this.currentEnd = 0;
     this.perPage = 10;
     this.searchString = '';
+    this.activeSearch = '';
 
     var refreshInterval;
 
+    /**
+     * Fetches new data, reflecting provided page and searchString
+     */
     function fetchMetrics( page, searchString ) {
       return metricsEndpoint.fetchApplicationMetrics(self.app.pushApplicationID, searchString, page, self.perPage)
         .then(function( data ) {
+          self.activeSearch = searchString;
           self.metrics.forEach(function( originalMetric ) {
             data.pushMetrics.some(function ( newMetric ) {
               if (originalMetric.id === newMetric.id && originalMetric.$toggled) {
@@ -43,6 +48,18 @@ angular.module('upsConsole')
         });
     }
 
+    /**
+     * Determines whether search is active - either the user typed search string or the data doesn't reflect the search string yet.
+     *
+     * @return false if searchString if false and data reflects that searchString; true otherwise
+     */
+    this.isSearchActive = function() {
+      return self.searchString || self.activeSearch;
+    };
+
+    /**
+     * Fetches new data on page change
+     */
     this.onPageChange = function ( page ) {
       fetchMetrics( page, self.searchString );
     };

admin-ui/app/components/app-detail/include/analytics.html

@@ -94,7 +94,7 @@ <h1 ng-if="appDetail.app.$messageCount != 0">No Charts yet</h1>
 
   <div ng-if="appDetail.app.$deviceCount == 0">
     <p>There are no registered device for this application.</p>
-    Check out the documentation on how to get started to <a ups-doc="docs-push-getting-started">register a device</a>.
+    <p>Check out the documentation on how to get started to <a ups-doc="docs-push-getting-started">register a device</a>.</p>
   </div>
 
   <div ng-if="appDetail.app.$deviceCount != 0">