FIX: Show dismiss all modal in user-notifications page (#16491)

Earlier on when https://github.com/discourse/discourse/pull/14935 was implemented, the "Dismiss all" button in /user-notifications was not catered for. Now, it is!

app/assets/javascripts/discourse/app/controllers/user-notifications.js

@@ -1,8 +1,9 @@
 import Controller, { inject as controller } from "@ember/controller";
+import getURL from "discourse-common/lib/get-url";
+import { iconHTML } from "discourse-common/lib/icon-library";
 import discourseComputed, { observes } from "discourse-common/utils/decorators";
 import { ajax } from "discourse/lib/ajax";
-import { iconHTML } from "discourse-common/lib/icon-library";
-import getURL from "discourse-common/lib/get-url";
+import showModal from "discourse/lib/show-modal";
 import I18n from "I18n";
 
 export default Controller.extend({
@@ -45,11 +46,26 @@ export default Controller.extend({
     }).htmlSafe();
   },
 
+  markRead() {
+    return ajax("/notifications/mark-read", { type: "PUT" }).then(() => {
+      this.model.forEach((n) => n.set("read", true));
+    });
+  },
+
   actions: {
-    resetNew() {
-      ajax("/notifications/mark-read", { type: "PUT" }).then(() => {
-        this.model.forEach((n) => n.set("read", true));
-      });
+    async resetNew() {
+      const unreadHighPriorityNotifications = this.currentUser.get(
+        "unread_high_priority_notifications"
+      );
+
+      if (unreadHighPriorityNotifications > 0) {
+        showModal("dismiss-notification-confirmation").setProperties({
+          count: unreadHighPriorityNotifications,
+          dismissNotifications: () => this.markRead(),
+        });
+      } else {
+        this.markRead();
+      }
     },
 
     loadMore() {

app/assets/javascripts/discourse/tests/unit/controllers/user-notifications-test.js

@@ -0,0 +1,89 @@
+import { discourseModule } from "discourse/tests/helpers/qunit-helpers";
+import { test } from "qunit";
+import * as showModal from "discourse/lib/show-modal";
+import sinon from "sinon";
+import EmberObject from "@ember/object";
+import User from "discourse/models/user";
+import pretender from "discourse/tests/helpers/create-pretender";
+
+discourseModule("Unit | Controller | user-notifications", function () {
+  test("Mark read marks all models read when response is 200", async function (assert) {
+    const model = [
+      EmberObject.create({ read: false }),
+      EmberObject.create({ read: false }),
+    ];
+    const controller = this.getController("user-notifications", {
+      model,
+    });
+    pretender.put("/notifications/mark-read", () => {
+      return [200];
+    });
+
+    await controller.markRead();
+
+    assert.strictEqual(
+      model.every(({ read }) => read === true),
+      true
+    );
+  });
+
+  test("Mark read does not mark models read when response is not successful", async function (assert) {
+    const model = [
+      EmberObject.create({ read: false }),
+      EmberObject.create({ read: true }),
+    ];
+    let markModelsRead = false;
+    const controller = this.getController("user-notifications", {
+      model,
+      markModelsRead: () => {
+        markModelsRead = true;
+      },
+    });
+    pretender.put("/notifications/mark-read", () => {
+      return [500];
+    });
+
+    assert.rejects(controller.markRead());
+    assert.strictEqual(markModelsRead, false);
+  });
+
+  test("Marks all notifications read when no high priority notifications", function (assert) {
+    let markRead = false;
+    const currentUser = User.create({ unread_high_priority_notifications: 0 });
+    const controller = this.getController("user-notifications", {
+      model: [],
+      currentUser,
+      markRead: () => {
+        markRead = true;
+      },
+    });
+
+    controller.send("resetNew");
+
+    assert.strictEqual(markRead, true);
+  });
+
+  test("Shows modal when has high priority notifications", function (assert) {
+    let capturedProperties;
+    const markReadStub = () => {};
+    sinon
+      .stub(showModal, "default")
+      .withArgs("dismiss-notification-confirmation")
+      .returns({
+        setProperties: (properties) => (capturedProperties = properties),
+      });
+    const currentUser = User.create({ unread_high_priority_notifications: 1 });
+    const controller = this.getController("user-notifications", {
+      currentUser,
+      markRead: markReadStub,
+    });
+
+    controller.send("resetNew");
+
+    assert.strictEqual(capturedProperties.count, 1);
+    assert.strictEqual(
+      capturedProperties.dismissNotifications(),
+      markReadStub()
+    );
+  });
+});