chore: support for custom filter for in app notifications and tests

Author: abose

src/assets/notifications/dev/root/toast.json

@@ -35,6 +35,9 @@ define(function (require, exports, module) {
 
     ExtensionUtils.loadStyleSheet(module, "styles/styles.css");
 
+    let latestBannerJSON;
+    let customFilterCallback;
+
     // duration of one day in milliseconds
     const ONE_DAY = 1000 * 60 * 60 * 24;
     const IN_APP_NOTIFICATIONS_BANNER_SHOWN_STATE = "InAppNotificationsBannerShown";
@@ -64,6 +67,14 @@ define(function (require, exports, module) {
         return false;
     }
 
+    /**
+     * Registers a custom filter callback function for notifications
+     * @param {Function} cfbn - async function that filters notifications
+     */
+    function registerCustomFilter(cfbn) {
+        customFilterCallback = cfbn;
+    }
+
     /**
      * If there are multiple notifications, thew will be shown one after the other and not all at once.
      * A sample notifications is as follows:
@@ -112,6 +123,9 @@ define(function (require, exports, module) {
                 if(!_isValidForThisPlatform(notification.PLATFORM)){
                     continue;
                 }
+                if(customFilterCallback && !(await customFilterCallback(notification, notificationID))){
+                    continue;
+                }
                 if(!notification.DANGER_SHOW_ON_EVERY_BOOT){
                     // One time notification. mark as shown and never show again
                     // all notifications are one time, we track metrics for each notification separately
@@ -136,6 +150,12 @@ define(function (require, exports, module) {
                     return null;
                 }
                 return response.json();
+            })
+            .then(json => {
+                if (json !== null) {
+                    latestBannerJSON = json;
+                }
+                return json;
             });
     }
 
@@ -167,6 +187,15 @@ define(function (require, exports, module) {
             });
     }
 
+    /**
+     * Re-renders notifications using the latest cached banner JSON
+     */
+    function reRenderNotifications() {
+        if(latestBannerJSON) {
+            _renderNotifications(latestBannerJSON);
+        }
+    }
+
 
     /**
      * Removes and cleans up the notification bar from DOM
@@ -232,8 +261,14 @@ define(function (require, exports, module) {
         setInterval(_fetchAndRenderNotifications, ONE_DAY);
     });
 
+    exports.registerCustomFilter = registerCustomFilter;
+    exports.reRenderNotifications = reRenderNotifications;
+
     if(Phoenix.isTestWindow){
         exports.cleanNotificationBanner = cleanNotificationBanner;
         exports._renderNotifications = _renderNotifications;
+        exports._setBannerCache = function(notifications) {
+            latestBannerJSON = notifications;
+        };
     }
 });

src/extensionsIntegrated/InAppNotifications/banner.js

@@ -19,7 +19,7 @@
  *
  */
 
-/*global describe, it, expect, beforeAll, afterAll, awaits, Phoenix */
+/*global describe, it, expect, beforeAll, afterAll, awaits, awaitsFor */
 
 define(function (require, exports, module) {
     // Recommended to avoid reloading the integration test window Phoenix instance for each test.
@@ -40,6 +40,12 @@ define(function (require, exports, module) {
             await SpecRunnerUtils.loadProjectInTestWindow(testPath);
         }, 30000);
 
+        async function _waitForBannerShown() {
+            await awaitsFor(function () {
+                return testWindow.$('#notification-bar').is(":visible");
+            }, "banner to be shown");
+        }
+
         afterAll(async function () {
             testWindow = null;
             // comment out below line if you want to debug the test window post running tests
@@ -182,5 +188,86 @@ define(function (require, exports, module) {
             banner._renderNotifications(notification);
             expect(testWindow.$(id).length).toEqual(0);
         });
+
+        it("Should apply custom filter to block notification", async function () {
+            banner.cleanNotificationBanner();
+            banner.registerCustomFilter(async () => false);
+
+            const {notification, id} = getRandomNotification("all", true);
+            banner._renderNotifications(notification);
+            await awaits(50);
+
+            expect(testWindow.$('#notification-bar').is(":visible")).toBe(false);
+            expect(testWindow.$(id).length).toEqual(0);
+
+            // Cleanup: remove custom filter
+            banner.registerCustomFilter(null);
+        });
+
+        it("Should apply custom filter to allow notification", async function () {
+            banner.cleanNotificationBanner();
+            banner.registerCustomFilter(async () => true);
+
+            const {notification, id} = getRandomNotification("all", true);
+            banner._renderNotifications(notification);
+            await _waitForBannerShown();
+
+            expect(testWindow.$(id).length).toEqual(1);
+
+            // Cleanup
+            banner.registerCustomFilter(null);
+            banner.cleanNotificationBanner();
+        });
+
+        it("Should pass correct parameters to custom filter", async function () {
+            banner.cleanNotificationBanner();
+            let receivedNotification, receivedID;
+
+            const {notification} = getRandomNotification("all", true);
+            const expectedID = Object.keys(notification)[0];
+
+            banner.registerCustomFilter(async (notif, notifID) => {
+                receivedNotification = notif;
+                receivedID = notifID;
+                return true;
+            });
+
+            banner._renderNotifications(notification);
+            await _waitForBannerShown();
+
+            expect(receivedID).toEqual(expectedID);
+            expect(receivedNotification).toEqual(notification[expectedID]);
+
+            // Cleanup
+            banner.registerCustomFilter(null);
+            banner.cleanNotificationBanner();
+        });
+
+        it("Should apply custom filter on reRenderNotifications", async function () {
+            banner.cleanNotificationBanner();
+
+            const {notification, id} = getRandomNotification("all", true);
+
+            // Set cache and render
+            banner._setBannerCache(notification);
+            banner._renderNotifications(notification);
+            await _waitForBannerShown();
+            expect(testWindow.$(id).length).toEqual(1);
+
+            banner.cleanNotificationBanner();
+
+            // Set filter to block
+            banner.registerCustomFilter(async () => false);
+
+            // Re-render should not show notification due to filter
+            banner.reRenderNotifications();
+            await awaits(50);
+            expect(testWindow.$('#notification-bar').is(":visible")).toBe(false);
+            expect(testWindow.$(id).length).toEqual(0);
+
+            // Cleanup
+            banner.registerCustomFilter(null);
+            banner.cleanNotificationBanner();
+        });
     });
 });