DEV: Use all unread notifications count for the count in document title (#18120)

When you receive a new notification, Discourse prepends a small count `(n)` to the tab title (i.e. `document.title`) if the tab is in the background to alert the user that they have a new notification. The count that's shown in the tab title should reflect the numbers shown on the notification bubbles above the user's avatar. Prior to the experimental user menu, there were 2 bubbles: a blue one which was removed once the user opened the menu and a green one that indicated high priority notifications and it was only removed when the user read all of their high priority notifications.

In the new experimental user menu, we no longer have the green bubble; everything is now combined (including flags/reviewables) into the blue one with no change to its behavior (i.e. it's removed once the user opens the menu). However, the logic that is responsible for updating the tab title hasn't been updated and still updates the tab title to include the count of the old green bubble. This commit updates the logic for the tab title count so that it only reflects the number on the blue bubble when the experimental user menu is enabled.

app/assets/javascripts/discourse/app/components/d-document.js

@@ -44,16 +44,23 @@ export default Component.extend({
     );
   },
 
-  _updateNotifications() {
+  _updateNotifications(opts) {
     if (!this.currentUser) {
       return;
     }
 
-    const count =
-      pluginCounterFunctions.reduce((sum, fn) => sum + fn(), 0) +
-      this.currentUser.unread_notifications +
-      this.currentUser.unread_high_priority_notifications;
-    this.documentTitle.updateNotificationCount(count);
+    let count = pluginCounterFunctions.reduce((sum, fn) => sum + fn(), 0);
+    if (this.currentUser.redesigned_user_menu_enabled) {
+      count += this.currentUser.all_unread_notifications_count;
+      if (this.currentUser.unseen_reviewable_count) {
+        count += this.currentUser.unseen_reviewable_count;
+      }
+    } else {
+      count +=
+        this.currentUser.unread_notifications +
+        this.currentUser.unread_high_priority_notifications;
+    }
+    this.documentTitle.updateNotificationCount(count, { forced: opts?.forced });
   },
 
   @bind

app/assets/javascripts/discourse/app/services/document-title.js

@@ -4,6 +4,7 @@ import updateTabCount from "discourse/lib/update-tab-count";
 
 export default Service.extend({
   appEvents: service(),
+  currentUser: service(),
   contextCount: null,
   notificationCount: null,
   _title: null,
@@ -53,8 +54,8 @@ export default Service.extend({
     this._renderTitle();
   },
 
-  updateNotificationCount(count) {
-    if (!this.session.hasFocus) {
+  updateNotificationCount(count, { forced = false } = {}) {
+    if (!this.session.hasFocus || forced) {
       this.notificationCount = count;
       this._renderFavicon();
       this._renderTitle();

app/assets/javascripts/discourse/tests/integration/components/d-document-test.js

@@ -0,0 +1,77 @@
+import { module, test } from "qunit";
+import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+
+function getTitleCount() {
+  const match = document.title.match(/^\((\d+)\)\s/);
+  if (match) {
+    return parseInt(match[1], 10);
+  } else {
+    return null;
+  }
+}
+
+function triggerTitleUpdate(appEvents) {
+  appEvents.trigger("notifications:changed", { forced: true });
+}
+
+module("Integration | Component | d-document", function (hooks) {
+  setupRenderingTest(hooks);
+
+  test("when experimental user menu is enabled", async function (assert) {
+    const titleBefore = document.title;
+    try {
+      this.currentUser.redesigned_user_menu_enabled = true;
+      this.currentUser.title_count_mode = "notifications";
+      await render(hbs`<DDocument />`);
+      assert.strictEqual(
+        getTitleCount(),
+        null,
+        "title doesn't have a count initially"
+      );
+
+      this.currentUser.unread_high_priority_notifications = 1;
+      this.currentUser.unread_notifications = 2;
+      this.currentUser.all_unread_notifications_count = 4;
+      this.currentUser.unseen_reviewable_count = 8;
+      triggerTitleUpdate(this.currentUser.appEvents);
+
+      assert.strictEqual(
+        getTitleCount(),
+        12,
+        "count in the title is the sum of all_unread_notifications_count and unseen_reviewable_count"
+      );
+    } finally {
+      document.title = titleBefore;
+    }
+  });
+
+  test("when experimental user menu is disabled", async function (assert) {
+    const titleBefore = document.title;
+    try {
+      this.currentUser.redesigned_user_menu_enabled = false;
+      this.currentUser.title_count_mode = "notifications";
+      await render(hbs`<DDocument />`);
+      assert.strictEqual(
+        getTitleCount(),
+        null,
+        "title doesn't have a count initially"
+      );
+
+      this.currentUser.unread_high_priority_notifications = 1;
+      this.currentUser.unread_notifications = 2;
+      this.currentUser.all_unread_notifications_count = 4;
+      this.currentUser.unseen_reviewable_count = 8;
+      triggerTitleUpdate(this.currentUser.appEvents);
+
+      assert.strictEqual(
+        getTitleCount(),
+        3,
+        "count in the title is the sum of unread_notifications and unread_high_priority_notifications"
+      );
+    } finally {
+      document.title = titleBefore;
+    }
+  });
+});