From 841b353d38091c18410e1adda61cf3bbf2e2e107 Mon Sep 17 00:00:00 2001
From: Isaac Janzen <50783505+janzenisaac@users.noreply.github.com>
Date: Thu, 29 Feb 2024 11:52:51 -0700
Subject: [PATCH] DEV: Close user menu after clicking view-all notifications
 (#25966)

We needed to call closeUserMenu after navigating to the show all notifications url.
---
 .../discourse/app/components/user-menu/items-list.hbs | 11 ++++++-----
 .../discourse/app/components/user-menu/items-list.js  |  7 +++++++
 .../components/user-menu/bookmarks-list-test.js       |  8 ++------
 .../components/user-menu/messages-list-test.js        |  8 ++------
 .../components/user-menu/notifications-list-test.js   | 10 +++-------
 .../components/user-menu/reviewables-list-test.js     |  7 +++----
 6 files changed, 23 insertions(+), 28 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/user-menu/items-list.hbs b/app/assets/javascripts/discourse/app/components/user-menu/items-list.hbs
index f0af1b0b1f2..4e7a4c2b81d 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/items-list.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-menu/items-list.hbs
@@ -10,13 +10,14 @@
   </ul>
   <div class="panel-body-bottom">
     {{#if this.showAllHref}}
-      <a
-        class="btn btn-default btn-icon no-text show-all"
-        href={{this.showAllHref}}
-        title={{this.showAllTitle}}
+      <DButton
+        class="show-all"
+        @action={{this.showAll}}
+        @translatedAriaLabel={{this.showAllTitle}}
+        @translatedTitle={{this.showAllTitle}}
       >
         {{d-icon "chevron-down" aria-label=this.showAllTitle}}
-      </a>
+      </DButton>
     {{/if}}
     {{#if this.showDismiss}}
       <button
diff --git a/app/assets/javascripts/discourse/app/components/user-menu/items-list.js b/app/assets/javascripts/discourse/app/components/user-menu/items-list.js
index 4d1201b8dce..9a9fc6b3841 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/items-list.js
+++ b/app/assets/javascripts/discourse/app/components/user-menu/items-list.js
@@ -2,6 +2,7 @@ import Component from "@glimmer/component";
 import { tracked } from "@glimmer/tracking";
 import { action } from "@ember/object";
 import { inject as service } from "@ember/service";
+import DiscourseURL from "discourse/lib/url";
 
 export default class UserMenuItemsList extends Component {
   @service session;
@@ -86,4 +87,10 @@ export default class UserMenuItemsList extends Component {
       `dismissButtonClick must be implemented in ${this.constructor.name}.`
     );
   }
+
+  @action
+  showAll() {
+    DiscourseURL.routeTo(this.showAllHref);
+    this.args.closeUserMenu();
+  }
 }
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/bookmarks-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/bookmarks-list-test.js
index 416923390cd..d73d9d62b44 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/user-menu/bookmarks-list-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/bookmarks-list-test.js
@@ -27,17 +27,13 @@ module(
       assert.ok(items[1].classList.contains("bookmark"));
     });
 
-    test("show all link", async function (assert) {
+    test("show all button for bookmark notifications", async function (assert) {
       await render(template);
       const link = query(".panel-body-bottom .show-all");
-      assert.ok(
-        link.href.endsWith("/u/eviltrout/activity/bookmarks"),
-        "links to the bookmarks page"
-      );
       assert.strictEqual(
         link.title,
         I18n.t("user_menu.view_all_bookmarks"),
-        "has a title"
+        "has the correct title"
       );
     });
 
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/messages-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/messages-list-test.js
index 546da3c5323..8b999980633 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/user-menu/messages-list-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/messages-list-test.js
@@ -253,17 +253,13 @@ module("Integration | Component | user-menu | messages-list", function (hooks) {
     );
   });
 
-  test("show all link", async function (assert) {
+  test("show all button for message notifications", async function (assert) {
     await render(template);
     const link = query(".panel-body-bottom .show-all");
-    assert.ok(
-      link.href.endsWith("/u/eviltrout/messages"),
-      "links to the user's messages page"
-    );
     assert.strictEqual(
       link.title,
       I18n.t("user_menu.view_all_messages"),
-      "has a title"
+      "has the correct title"
     );
   });
 
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/notifications-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/notifications-list-test.js
index dcf3352acd0..8f265ff904d 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/user-menu/notifications-list-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/notifications-list-test.js
@@ -65,17 +65,13 @@ module(
       assert.strictEqual(queryParams.silent, undefined);
     });
 
-    test("displays a show all button that takes to the notifications page of the current user", async function (assert) {
+    test("show all button for all notifications page", async function (assert) {
       await render(template);
       const showAllBtn = query(".panel-body-bottom .btn.show-all");
-      assert.ok(
-        showAllBtn.href.endsWith("/u/eviltrout/notifications"),
-        "it takes you to the notifications page"
-      );
       assert.strictEqual(
-        showAllBtn.getAttribute("title"),
+        showAllBtn.title,
         I18n.t("user_menu.view_all_notifications"),
-        "title attribute is present"
+        "has the correct title"
       );
     });
 
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-menu/reviewables-list-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-menu/reviewables-list-test.js
index 6db27da8f63..66c60e69e8e 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/user-menu/reviewables-list-test.js
+++ b/app/assets/javascripts/discourse/tests/integration/components/user-menu/reviewables-list-test.js
@@ -12,14 +12,13 @@ module(
 
     const template = hbs`<UserMenu::ReviewablesList/>`;
 
-    test("has a 'show all' link", async function (assert) {
+    test("show all button for reviewable notifications", async function (assert) {
       await render(template);
-      const showAll = query(".panel-body-bottom a.show-all");
-      assert.ok(showAll.href.endsWith("/review"), "links to the /review page");
+      const showAll = query(".panel-body-bottom .show-all");
       assert.strictEqual(
         showAll.title,
         I18n.t("user_menu.reviewable.view_all"),
-        "the 'show all' link has a title"
+        "has the correct title"
       );
     });