DEV: Always pass ancestors to category-link (#26638)

We want to remove uses of Category.findById. This change pushes the fetching up the chain of responsibility.

app/assets/javascripts/discourse/app/components/choose-topic.hbs

@@ -36,7 +36,7 @@
             <span class="topic-categories">
               {{bound-category-link
                 t.category
-                recursive=true
+                ancestors=t.category.predecessors
                 hideParent=true
                 link=false
               }}

app/assets/javascripts/discourse/app/components/topic-category.hbs

@@ -1,5 +1,9 @@
 {{#unless this.topic.isPrivateMessage}}
-  {{bound-category-link this.topic.category recursive=true hideParent=true}}
+  {{bound-category-link
+    this.topic.category
+    ancestors=this.topic.category.predecessors
+    hideParent=true
+  }}
 {{/unless}}
 <div class="topic-header-extra">
   {{#if this.siteSettings.tagging_enabled}}

app/assets/javascripts/discourse/app/helpers/category-link.js

@@ -32,6 +32,7 @@ export function addExtraIconRenderer(renderer) {
     @param {Boolean} [opts.recursive] If true, the function will be called recursively for all parent categories
     @param {Number}  [opts.depth] Current category depth, used for limiting recursive calls
     @param {Boolean} [opts.previewColor] If true, category color will be set as an inline style.
+    @param {Array}   [opts.ancestors] The ancestors of the category to generate the badge for.
 **/
 export function categoryBadgeHTML(category, opts) {
   const { site, siteSettings } = helperContext();
@@ -47,7 +48,13 @@ export function categoryBadgeHTML(category, opts) {
   }
 
   const depth = (opts.depth || 1) + 1;
-  if (opts.recursive && depth <= siteSettings.max_category_nesting) {
+  if (opts.ancestors) {
+    const { ancestors, ...otherOpts } = opts;
+    return [category, ...ancestors]
+      .reverse()
+      .map((c) => categoryBadgeHTML(c, otherOpts))
+      .join("");
+  } else if (opts.recursive && depth <= siteSettings.max_category_nesting) {
     const parentCategory = Category.findById(category.parent_category_id);
     const lastSubcategory = !opts.depth;
     opts.depth = depth;
@@ -87,6 +94,9 @@ export function categoryLinkHTML(category, options) {
     if (options.recursive) {
       categoryOptions.recursive = true;
     }
+    if (options.ancestors) {
+      categoryOptions.ancestors = options.ancestors;
+    }
   }
   return htmlSafe(categoryBadgeHTML(category, categoryOptions));
 }

app/assets/javascripts/discourse/app/models/category.js

@@ -492,6 +492,15 @@ export default class Category extends RestModel {
     return [...(parentAncestors || []), this];
   }
 
+  @discourseComputed("parentCategory", "parentCategory.predecessors")
+  predecessors(parentCategory, parentPredecessors) {
+    if (parentCategory) {
+      return [parentCategory, ...parentPredecessors];
+    } else {
+      return [];
+    }
+  }
+
   @discourseComputed("subcategories")
   descendants() {
     const descendants = [this];

app/assets/javascripts/select-kit/addon/components/topic-row.hbs

@@ -3,7 +3,7 @@
 <div class="topic-categories">
   {{bound-category-link
     this.item.category
-    recursive=true
+    ancestors=this.item.category.predecessors
     hideParent=true
     link=false
   }}