Show notification when there is raw data but no data (#17380)

* ajax calls to check raw data and nb_visits

* show notification if there is raw data only

* using piwikApi

* disable when segment selected and add do not fetch actions

* update segment check

* move the logic into reporting-page

* show on dashboard too

* limiting API requests

* using notification instead of alert

* check if period changed

* check only if today is in daterange

* use lang file for visitor log text

* add contains today method

* add UI test for the notification

* update ui test

* use range in ui test

5 files changed, 171 insertions, 10 deletions

diff --git a/plugins/CoreHome/angularjs/common/services/periods.js b/plugins/CoreHome/angularjs/common/services/periods.js
index 8033b33962..33c5e1abcd 100644
--- a/plugins/CoreHome/angularjs/common/services/periods.js
+++ b/plugins/CoreHome/angularjs/common/services/periods.js
@@ -26,6 +26,7 @@
  * - **getDateRange()**: returns an array w/ two elements, the first being the start
  *                       Date of the period, the second being the end Date. The dates
  *                       must be Date objects, not strings, and are inclusive.
+ * - **containsToday()**: returns true if the date period contains today. False if not.
  * - (_static_) **parse(strDate)**: creates a new instance of this period from the
  *                                  value of the 'date' query parameter.
  * - (_static_) **getDisplayText**: returns translated text for the period, eg, 'month',
@@ -64,6 +65,10 @@
 
         getDateRange: function () {
             return [new Date(this.dateInPeriod.getTime()), new Date(this.dateInPeriod.getTime())];
+        },
+
+        containsToday: function () {
+            return todayIsInRange(this.getDateRange());
         }
     };
 
@@ -99,6 +104,10 @@
             endWeek.setDate(startWeek.getDate() + 6);
 
             return [startWeek, endWeek];
+        },
+
+        containsToday: function () {
+            return todayIsInRange(this.getDateRange());
         }
     };
 
@@ -131,6 +140,10 @@
             endMonth.setDate(0);
 
             return [startMonth, endMonth];
+        },
+
+        containsToday: function () {
+            return todayIsInRange(this.getDateRange());
         }
     };
 
@@ -162,6 +175,10 @@
             endYear.setDate(0);
 
             return [startYear, endYear];
+        },
+
+        containsToday: function () {
+            return todayIsInRange(this.getDateRange());
         }
     };
 
@@ -261,6 +278,10 @@
 
         getDateRange: function () {
             return [this.startDate, this.endDate];
+        },
+
+        containsToday: function () {
+            return todayIsInRange(this.getDateRange());
         }
     };
 
@@ -275,7 +296,8 @@
             parse: parse,
             parseDate: parseDate,
             format: format,
-            RangePeriod: RangePeriod
+            RangePeriod: RangePeriod,
+            todayIsInRange: todayIsInRange
         };
 
         function getAllLabels() {
@@ -384,4 +406,16 @@
         date.setMilliseconds(0);
         return date;
     }
+
+    function todayIsInRange(dateRange) {
+        if (!dateRange.isArray && dateRange.length !== 2) {
+            return false;
+        }
+
+        if (getToday() >= dateRange[0] && getToday() <= dateRange[1]) {
+            return true;
+        }
+
+        return false;
+    }
 })();
diff --git a/plugins/CoreHome/angularjs/common/services/periods.spec.js b/plugins/CoreHome/angularjs/common/services/periods.spec.js
index 7fd0271b33..1ae3a52106 100644
--- a/plugins/CoreHome/angularjs/common/services/periods.spec.js
+++ b/plugins/CoreHome/angularjs/common/services/periods.spec.js
@@ -124,5 +124,36 @@
 
             Date.now = originalDateNow;
         });
+
+        it('should contains today for daterange if it contains', function() {
+            var day = '2021-03-10';
+
+            originalDateNow = Date.now;
+            Date.now = function() {
+                return clearDate(day).getTime();
+            };
+
+            var result = piwikPeriods.parse('week', day).containsToday();
+
+            expect(result).to.be.true;
+
+            Date.now = originalDateNow;
+        });
+
+        it('should not contains today for daterange if it not contains', function() {
+            var today = '2021-03-10';
+            var day = '2021-03-17';
+
+            originalDateNow = Date.now;
+            Date.now = function() {
+                return clearDate(today).getTime();
+            };
+
+            var result = piwikPeriods.parse('week', day).containsToday();
+
+            expect(result).to.be.false;
+
+            Date.now = originalDateNow;
+        });
     });
 })();
diff --git a/plugins/CoreHome/angularjs/reporting-menu/reportingmenu-model.js b/plugins/CoreHome/angularjs/reporting-menu/reportingmenu-model.js
index caf80e4caf..5b56090de8 100644
--- a/plugins/CoreHome/angularjs/reporting-menu/reportingmenu-model.js
+++ b/plugins/CoreHome/angularjs/reporting-menu/reportingmenu-model.js
@@ -162,4 +162,4 @@
             });
         }
     }
-})();
\ No newline at end of file
+})();
diff --git a/plugins/CoreHome/angularjs/reporting-page/reportingpage.controller.js b/plugins/CoreHome/angularjs/reporting-page/reportingpage.controller.js
index c3f3e6fb54..d23590babe 100644
--- a/plugins/CoreHome/angularjs/reporting-page/reportingpage.controller.js
+++ b/plugins/CoreHome/angularjs/reporting-page/reportingpage.controller.js
@@ -7,9 +7,9 @@
 (function () {
     angular.module('piwikApp').controller('ReportingPageController', ReportingPageController);
 
-    ReportingPageController.$inject = ['$scope', 'piwik', '$rootScope', '$location', 'reportingPageModel', 'reportingPagesModel', 'notifications', 'piwikUrl', 'piwikPeriods'];
+    ReportingPageController.$inject = ['$scope', 'piwik', '$rootScope', '$location', 'reportingPageModel', 'reportingPagesModel', 'notifications', 'piwikUrl', 'piwikPeriods', 'piwikApi'];
 
-    function ReportingPageController($scope, piwik, $rootScope, $location, pageModel, pagesModel, notifications, piwikUrl, $piwikPeriods) {
+    function ReportingPageController($scope, piwik, $rootScope, $location, pageModel, pagesModel, notifications, piwikUrl, $piwikPeriods, piwikApi) {
         pageModel.resetPage();
         $scope.pageModel = pageModel;
 
@@ -23,6 +23,13 @@
         var currentComparePeriods = null;
         var currentCompareSegments = null;
 
+        var hasRawData = false;
+        var hasNoVisits = false;
+        var dateLastChecked = null;
+
+        var UI = require('piwik/UI');
+        var notification = new UI.Notification();
+
         function renderInitialPage()
         {
             var $search = $location.search();
@@ -35,6 +42,87 @@
             $scope.renderPage($search.category, $search.subcategory);
         }
 
+        function showOnlyRawDataNotification() {
+            var attributes = {};
+            attributes.id = 'onlyRawData';
+            attributes.animate = false;
+            attributes.context = 'info';
+            var url = broadcast.buildReportingUrl('category=General_Visitors&subcategory=Live_VisitorLog')
+            var message = _pk_translate('CoreHome_PeriodHasOnlyRawData', ['<a href="' + url + '">', '</a>']);
+            notification.show(message, attributes);
+        }
+
+        function hideOnlyRawDataNoticifation() {
+            notification.remove('onlyRawData');
+        }
+
+        function showOnlyRawDataMessageIfRequired() {
+            if (hasRawData && hasNoVisits) {
+                showOnlyRawDataNotification();
+            }
+
+            var $search = $location.search();
+
+            if ($search.segment !== '') {
+                hideOnlyRawDataNoticifation();
+                return;
+            }
+
+            var subcategoryExceptions = [
+                'Live_VisitorLog',
+                'General_RealTime',
+                'UserCountryMap_RealTimeMap',
+                'MediaAnalytics_TypeAudienceLog',
+                'MediaAnalytics_TypeRealTime',
+                'FormAnalytics_TypeRealTime',
+                'Goals_AddNewGoal',
+            ];
+
+            var categoryExceptions = [
+                'HeatmapSessionRecording_Heatmaps',
+                'HeatmapSessionRecording_SessionRecordings',
+                'Marketplace_Marketplace',
+            ];
+
+            if (subcategoryExceptions.indexOf($search.subcategory) !== -1 || categoryExceptions.indexOf($search.category) !== -1 || $search.subcategory.toLowerCase().indexOf('manage') !== -1) {
+                hideOnlyRawDataNoticifation();
+                return;
+            }
+
+            var minuteInMilliseconds = 60000;
+            if (dateLastChecked && (new Date().getTime() - dateLastChecked) < minuteInMilliseconds) {
+                return;
+            }
+
+            piwikApi.fetch({ method: 'VisitsSummary.getVisits' }).then(function (json) {
+                dateLastChecked = new Date().getTime();
+
+                if (json.value > 0) {
+                    hasNoVisits = false;
+                    hideOnlyRawDataNoticifation();
+                    return;
+                }
+
+                hasNoVisits = true;
+
+                if (hasRawData) {
+                    showOnlyRawDataNotification();
+                    return;
+                }
+
+                piwikApi.fetch({ method: 'Live.getLastVisitsDetails', filter_limit: 1, doNotFetchActions: 1 }).then(function (json)  {
+                    if (json.length == 0) {
+                        hasRawData = false;
+                        hideOnlyRawDataNoticifation();
+                        return;
+                    }
+
+                    hasRawData = true;
+                    showOnlyRawDataNotification();
+                });
+            });
+        }
+
         $scope.renderPage = function (category, subcategory) {
             if (!category || !subcategory) {
                 pageModel.resetPage();
@@ -42,12 +130,9 @@
                 return;
             }
 
-            var UI = require('piwik/UI');
-
             try {
                 $piwikPeriods.parse(currentPeriod, currentDate);
             } catch (e) {
-                var notification   = new UI.Notification();
                 var attributes = {};
                 attributes.id = 'invalidDate';
                 attributes.animate = false;
@@ -59,7 +144,7 @@
                 return;
             }
 
-            (new UI.Notification()).remove('invalidDate');
+            notification.remove('invalidDate');
 
             $rootScope.$emit('piwikPageChange', {});
 
@@ -68,6 +153,10 @@
 
             notifications.clearTransientNotifications();
 
+            if ($piwikPeriods.parse(currentPeriod, currentDate).containsToday()) {
+                showOnlyRawDataMessageIfRequired();
+            }
+
             if (category === 'Dashboard_Dashboard' && $.isNumeric(subcategory) && $('[piwik-dashboard]').length) {
                 // hack to make loading of dashboards faster since all the information is already there in the
                 // piwik-dashboard widget, we can let the piwik-dashboard widget render the page. We need to find
@@ -101,7 +190,7 @@
         };
 
         $scope.loading = true; // we only set loading on initial load
-        
+
         renderInitialPage();
 
         $rootScope.$on('$locationChangeSuccess', function () {
@@ -132,6 +221,13 @@
                 return;
             }
 
+            if (date !== currentDate || period !== currentPeriod) {
+                hideOnlyRawDataNoticifation();
+                dateLastChecked = null;
+                hasRawData = false;
+                hasNoVisits = false;
+            }
+
             currentPeriod = period;
             currentDate = date;
             currentSegment = segment;
diff --git a/plugins/CoreHome/angularjs/reporting-page/reportingpage.directive.html b/plugins/CoreHome/angularjs/reporting-page/reportingpage.directive.html
index fe379e3d8c..4abf3a27e2 100644
--- a/plugins/CoreHome/angularjs/reporting-page/reportingpage.directive.html
+++ b/plugins/CoreHome/angularjs/reporting-page/reportingpage.directive.html
@@ -14,4 +14,4 @@
             <div ng-repeat="widgetInGroup in widget.right" piwik-widget="widgetInGroup"></div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>