FIX: topic tracking state for tags (#15623)

TopicTrackingState should correctly set filterCategory and filterTag for all different configurations.

When filterTag exists and new_topic message arrives, it ensures that filterTag is included in payload tags

If filterTag is part of payload tags, message that new topics are available is displayed and after click, new topics are included in the list.

app/assets/javascripts/discourse/app/controllers/tag-show.js

@@ -127,6 +127,13 @@ export default Controller.extend(BulkTopicSelection, FilterModeMixin, {
       );
     },
 
+    showInserted() {
+      const tracker = this.topicTrackingState;
+      this.list.loadBefore(tracker.get("newIncoming"), true);
+      tracker.resetTracking();
+      return false;
+    },
+
     changeSort(order) {
       if (order === this.order) {
         this.toggleProperty("ascending");

app/assets/javascripts/discourse/app/models/topic-tracking-state.js

@@ -194,6 +194,7 @@ const TopicTrackingState = EmberObject.extend({
 
     const filter = this.filter;
     const filterCategory = this.filterCategory;
+    const filterTag = this.filterTag;
     const categoryId = data.payload && data.payload.category_id;
 
     // if we have a filter category currently and it is not the
@@ -209,6 +210,10 @@ const TopicTrackingState = EmberObject.extend({
       }
     }
 
+    if (filterTag && !data.payload.tags.includes(filterTag)) {
+      return;
+    }
+
     // always count a new_topic as incoming
     if (
       ["all", "latest", "new", "unseen"].includes(filter) &&
@@ -275,25 +280,34 @@ const TopicTrackingState = EmberObject.extend({
    * @method trackIncoming
    * @param {String} filter - Valid values are all, categories, and any topic list
    *                          filters e.g. latest, unread, new. As well as this
-   *                          specific category and tag URLs like /tag/test/l/latest
+   *                          specific category and tag URLs like tag/test/l/latest,
-   *                          or c/cat/subcat/6/l/latest.
+   *                          c/cat/subcat/6/l/latest or tags/c/cat/subcat/6/test/l/latest.
    */
   trackIncoming(filter) {
     this.newIncoming = [];
 
-    if (filter.startsWith("c/")) {
+    let category, tag;
-      const categoryId = filter.match(/\/(\d*)\//);
-      const category = Category.findById(parseInt(categoryId[1], 10));
-      this.set("filterCategory", category);
 
+    if (filter.startsWith("c/") || filter.startsWith("tags/c/")) {
+      const categoryId = filter.match(/\/(\d*)\//);
+      category = Category.findById(parseInt(categoryId[1], 10));
       const split = filter.split("/");
+
+      if (filter.startsWith("tags/c/")) {
+        tag = split[split.indexOf(categoryId[1]) + 1];
+      }
+
       if (split.length >= 4) {
         filter = split[split.length - 1];
       }
-    } else {
+    } else if (filter.startsWith("tag/")) {
-      this.set("filterCategory", null);
+      const split = filter.split("/");
+      filter = split[split.length - 1];
+      tag = split[1];
     }
 
+    this.set("filterCategory", category);
+    this.set("filterTag", tag);
     this.set("filter", filter);
     this.set("incomingCount", 0);
   },

app/assets/javascripts/discourse/app/templates/tags/show.hbs

@@ -62,6 +62,14 @@
                 <div class="top-lists">
                   {{period-chooser period=period action=(action "changePeriod") fullDay=false}}
                 </div>
+              {{else}}
+                {{#if topicTrackingState.hasIncoming}}
+                  <div class="show-more {{if hasTopics "has-topics"}}">
+                    <a tabindex="0" href {{action "showInserted"}} class="alert alert-info clickable">
+                      {{count-i18n key="topic_count_" suffix=topicTrackingState.filter count=topicTrackingState.incomingCount}}
+                    </a>
+                  </div>
+                {{/if}}
               {{/if}}
 
               {{#if list.topics}}

app/assets/javascripts/discourse/tests/unit/models/topic-tracking-state-test.js

@@ -519,6 +519,28 @@ discourseModule("Unit | Model | topic-tracking-state", function (hooks) {
         );
       });
 
+      test("correct tag and category filters for different lists", function (assert) {
+        trackingState.trackIncoming("unread");
+        assert.strictEqual(trackingState.filterCategory, undefined);
+        assert.strictEqual(trackingState.filterTag, undefined);
+        assert.strictEqual(trackingState.filter, "unread");
+
+        trackingState.trackIncoming("tag/test/l/latest");
+        assert.strictEqual(trackingState.filterCategory, undefined);
+        assert.strictEqual(trackingState.filterTag, "test");
+        assert.strictEqual(trackingState.filter, "latest");
+
+        trackingState.trackIncoming("c/cat/subcat/6/l/latest");
+        assert.strictEqual(trackingState.filterCategory.id, 6);
+        assert.strictEqual(trackingState.filterTag, undefined);
+        assert.strictEqual(trackingState.filter, "latest");
+
+        trackingState.trackIncoming("tags/c/cat/subcat/6/test/l/latest");
+        assert.strictEqual(trackingState.filterCategory.id, 6);
+        assert.strictEqual(trackingState.filterTag, "test");
+        assert.strictEqual(trackingState.filter, "latest");
+      });
+
       test("adds incoming in the categories latest topics list", function (assert) {
         trackingState.trackIncoming("categories");
         const unreadCategoriesLatestTopicsPayload = {