From b2a14eeb168331bdf294612a900a1ee38af3f54f Mon Sep 17 00:00:00 2001
From: Alan Guo Xiang Tan <gxtan1990@gmail.com>
Date: Mon, 10 Oct 2022 14:47:55 +0800
Subject: [PATCH] FIX: Ensure group inboxes in messages section is sorted by
 group name (#18508)

---
 .../sidebar/user/messages-section.js          | 24 ++++++++++---------
 .../sidebar-user-messages-section-test.js     | 23 +++++++++---------
 2 files changed, 24 insertions(+), 23 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/sidebar/user/messages-section.js b/app/assets/javascripts/discourse/app/components/sidebar/user/messages-section.js
index c96c60b961d..1dd19f44a58 100644
--- a/app/assets/javascripts/discourse/app/components/sidebar/user/messages-section.js
+++ b/app/assets/javascripts/discourse/app/components/sidebar/user/messages-section.js
@@ -122,18 +122,20 @@ export default class SidebarUserMessagesSection extends Component {
   get groupMessagesSectionLinks() {
     const links = [];
 
-    this.currentUser.groupsWithMessages.forEach((group) => {
-      GROUP_MESSAGES_INBOX_FILTERS.forEach((groupMessageLink) => {
-        links.push(
-          new GroupMessageSectionLink({
-            group,
-            type: groupMessageLink,
-            currentUser: this.currentUser,
-            pmTopicTrackingState: this.pmTopicTrackingState,
-          })
-        );
+    this.currentUser.groupsWithMessages
+      .sort((a, b) => a.name.localeCompare(b.name))
+      .forEach((group) => {
+        GROUP_MESSAGES_INBOX_FILTERS.forEach((groupMessageLink) => {
+          links.push(
+            new GroupMessageSectionLink({
+              group,
+              type: groupMessageLink,
+              currentUser: this.currentUser,
+              pmTopicTrackingState: this.pmTopicTrackingState,
+            })
+          );
+        });
       });
-    });
 
     return links;
   }
diff --git a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-messages-section-test.js b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-messages-section-test.js
index f3ac3f2f4b5..464d5422e8f 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-messages-section-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/sidebar-user-messages-section-test.js
@@ -7,6 +7,7 @@ import {
   exists,
   publishToMessageBus,
   query,
+  queryAll,
   updateCurrentUser,
 } from "discourse/tests/helpers/qunit-helpers";
 import { NotificationLevels } from "discourse/lib/notification-levels";
@@ -175,7 +176,7 @@ acceptance(
       updateCurrentUser({
         groups: [
           {
-            name: "group1",
+            name: "group3",
             has_messages: true,
           },
           {
@@ -183,7 +184,7 @@ acceptance(
             has_messages: false,
           },
           {
-            name: "group3",
+            name: "group1",
             has_messages: true,
           },
         ],
@@ -191,18 +192,16 @@ acceptance(
 
       await visit("/");
 
-      assert.ok(
-        exists(
-          ".sidebar-section-messages .sidebar-section-link-group-messages-inbox.group1"
-        ),
-        "displays group1 inbox link"
+      const groupSectionLinks = queryAll(
+        ".sidebar-section-messages .sidebar-section-link"
       );
 
-      assert.ok(
-        exists(
-          ".sidebar-section-messages .sidebar-section-link-group-messages-inbox.group3"
-        ),
-        "displays group3 inbox link"
+      assert.deepEqual(
+        groupSectionLinks
+          .toArray()
+          .map((sectionLink) => sectionLink.textContent.trim()),
+        ["Inbox", "group1", "group3"],
+        "displays group section links sorted by name"
       );
 
       await visit("/u/eviltrout/messages/group/GrOuP1");