From 9a18c8032ab96dc24e480b339efc1ee282947d6c Mon Sep 17 00:00:00 2001
From: Alan Guo Xiang Tan <gxtan1990@gmail.com>
Date: Wed, 7 Jun 2023 13:37:05 +0900
Subject: [PATCH] UX: Don't block render of user messages secondary nav for
 tracking state (#21965)

Why is this change required?

Right now, we're awaiting on the promise returned by
`this.pmTopicTrackingState.startTracking()` which blocks the rendering
of the template until the promise resolves. However, this blocking of
the rendering ends up introducing yet another intermediate loading state
in the UI which we find unsightly. Instead of blocking the rendering, we
allow the promise to resolve in the background and display the
new/unread counts when the promise resolves.
---
 .../app/controllers/user-private-messages-group.js          | 6 ++++--
 .../discourse/app/controllers/user-private-messages-user.js | 6 ++++--
 .../discourse/app/routes/user-private-messages.js           | 6 +-----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/controllers/user-private-messages-group.js b/app/assets/javascripts/discourse/app/controllers/user-private-messages-group.js
index 2a6aa3f5ae4..edbcc89ecce 100644
--- a/app/assets/javascripts/discourse/app/controllers/user-private-messages-group.js
+++ b/app/assets/javascripts/discourse/app/controllers/user-private-messages-group.js
@@ -11,7 +11,8 @@ export default class extends Controller {
 
   @computed(
     "pmTopicTrackingState.newIncoming.[]",
-    "pmTopicTrackingState.statesModificationCounter"
+    "pmTopicTrackingState.statesModificationCounter",
+    "pmTopicTrackingState.isTracking"
   )
   get newLinkText() {
     return this.#linkText("new");
@@ -19,7 +20,8 @@ export default class extends Controller {
 
   @computed(
     "pmTopicTrackingState.newIncoming.[]",
-    "pmTopicTrackingState.statesModificationCounter"
+    "pmTopicTrackingState.statesModificationCounter",
+    "pmTopicTrackingState.isTracking"
   )
   get unreadLinkText() {
     return this.#linkText("unread");
diff --git a/app/assets/javascripts/discourse/app/controllers/user-private-messages-user.js b/app/assets/javascripts/discourse/app/controllers/user-private-messages-user.js
index 7669910017b..470cd0036b6 100644
--- a/app/assets/javascripts/discourse/app/controllers/user-private-messages-user.js
+++ b/app/assets/javascripts/discourse/app/controllers/user-private-messages-user.js
@@ -22,7 +22,8 @@ export default class extends Controller {
 
   @computed(
     "pmTopicTrackingState.newIncoming.[]",
-    "pmTopicTrackingState.statesModificationCounter"
+    "pmTopicTrackingState.statesModificationCounter",
+    "pmTopicTrackingState.isTracking"
   )
   get newLinkText() {
     return this.#linkText("new");
@@ -30,7 +31,8 @@ export default class extends Controller {
 
   @computed(
     "pmTopicTrackingState.newIncoming.[]",
-    "pmTopicTrackingState.statesModificationCounter"
+    "pmTopicTrackingState.statesModificationCounter",
+    "pmTopicTrackingState.isTracking"
   )
   get unreadLinkText() {
     return this.#linkText("unread");
diff --git a/app/assets/javascripts/discourse/app/routes/user-private-messages.js b/app/assets/javascripts/discourse/app/routes/user-private-messages.js
index 23d9c01b605..b0518dfcba1 100644
--- a/app/assets/javascripts/discourse/app/routes/user-private-messages.js
+++ b/app/assets/javascripts/discourse/app/routes/user-private-messages.js
@@ -8,12 +8,8 @@ export default DiscourseRoute.extend({
   templateName: "user/messages",
   composer: service(),
 
-  model() {
-    return this.modelFor("user");
-  },
-
   afterModel() {
-    return this.pmTopicTrackingState.startTracking();
+    this.pmTopicTrackingState.startTracking();
   },
 
   setupController() {