UX: Move group mentions notifications into the reply tab (#22562)

Why this change?

Group mention notifications are currently placed in the "Others" tab
of the user menu which is odd considering that mentioned notifications
are in the reply tab. This commit changes it such that group mention
notifications are displayed in the reply tab as well.

app/assets/javascripts/discourse/app/components/user-menu/menu.js

@@ -37,11 +37,18 @@ const CORE_TOP_TABS = [
     id = "replies";
     icon = "reply";
     panelComponent = UserMenuRepliesNotificationsList;
-    notificationTypes = ["mentioned", "posted", "quoted", "replied"];
+    notificationTypes = [
+      "mentioned",
+      "group_mentioned",
+      "posted",
+      "quoted",
+      "replied",
+    ];
 
     get count() {
       return (
         this.getUnreadCountForType("mentioned") +
+        this.getUnreadCountForType("group_mentioned") +
         this.getUnreadCountForType("posted") +
         this.getUnreadCountForType("quoted") +
         this.getUnreadCountForType("replied")

app/assets/javascripts/discourse/tests/integration/components/user-menu/menu-test.js

@@ -222,7 +222,8 @@ module("Integration | Component | user-menu", function (hooks) {
           },
         ];
       } else if (
-        queryParams.filter_by_types === "mentioned,posted,quoted,replied"
+        queryParams.filter_by_types ===
+        "mentioned,group_mentioned,posted,quoted,replied"
       ) {
         data = [
           {
@@ -280,7 +281,7 @@ module("Integration | Component | user-menu", function (hooks) {
     assert.ok(exists("#quick-access-replies.quick-access-panel"));
     assert.strictEqual(
       queryParams.filter_by_types,
-      "mentioned,posted,quoted,replied",
+      "mentioned,group_mentioned,posted,quoted,replied",
       "request params has filter_by_types set to `mentioned`, `posted`, `quoted` and `replied`"
     );
     assert.strictEqual(queryParams.silent, "true");

spec/system/page_objects/components/user_menu.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module PageObjects
+  module Components
+    class UserMenu < PageObjects::Components::Base
+      def open
+        find(".header-dropdown-toggle.current-user").click
+        has_css?(".user-menu")
+        self
+      end
+
+      def click_replies_notifications_tab
+        click_link("user-menu-button-replies")
+        has_css?("#quick-access-replies")
+        self
+      end
+
+      def has_group_mentioned_notification?(topic, user_that_mentioned_group, group_mentioned)
+        expect(find("#quick-access-replies .group-mentioned").text).to eq(
+          "#{user_that_mentioned_group.username} @#{group_mentioned.name} #{topic.title}",
+        )
+      end
+
+      def has_right_replies_button_count?(count)
+        expect(find("#user-menu-button-replies").text).to eq(count.to_s)
+      end
+    end
+  end
+end

spec/system/viewing_user_menu_spec.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+RSpec.describe "Viewing User Menu", system: true do
+  fab!(:user) { Fabricate(:user) }
+
+  let(:user_menu) { PageObjects::Components::UserMenu.new }
+
+  describe "when viewing replies notifications tab" do
+    fab!(:topic) { Fabricate(:topic) }
+
+    it "should display group mentioned notifications in the tab" do
+      Jobs.run_immediately!
+
+      mentionable_group = Fabricate(:group, mentionable_level: Group::ALIAS_LEVELS[:everyone])
+      user_in_mentionable_group = Fabricate(:user).tap { |user| mentionable_group.add(user) }
+
+      _post_with_group_mention =
+        PostCreator.create!(user, topic_id: topic.id, raw: "Hello @#{mentionable_group.name}")
+
+      sign_in(user_in_mentionable_group)
+
+      visit("/latest")
+
+      user_menu.open
+
+      expect(user_menu).to have_right_replies_button_count(1)
+
+      user_menu.click_replies_notifications_tab
+
+      expect(user_menu).to have_group_mentioned_notification(topic, user, mentionable_group)
+    end
+  end
+end