From 487fb1da22b16b481524e05dad3a6f2a99b6e664 Mon Sep 17 00:00:00 2001
From: Bianca Nenciu <nbianca@users.noreply.github.com>
Date: Fri, 5 Jul 2024 14:44:35 +0300
Subject: [PATCH] FIX: Show featured topics for categories on mobile (#27715)

The featured topics have not been rendered correctly since 2190c9b and
it has been fixed for desktop recently in commit d2a52c3. This commit
implements similar changes that initialize Category and Topic object
instances from the serialized data.
---
 .../mobile/components/parent-category-row.hbs |  2 +-
 .../subcategories-with-featured-topics.hbs    |  2 +-
 .../tests/acceptance/categories-test.js       | 29 ++++++++++++++++++-
 3 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row.hbs b/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row.hbs
index 638f803edac..4f5c3762216 100644
--- a/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row.hbs
+++ b/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row.hbs
@@ -25,7 +25,7 @@
         {{/if}}
         {{#unless this.isMuted}}
           {{#if this.showTopics}}
-            {{#each this.category.topics as |t|}}
+            {{#each this.category.featuredTopics as |t|}}
               <MobileCategoryTopic @topic={{t}} />
             {{/each}}
           {{/if}}
diff --git a/app/assets/javascripts/discourse/app/templates/mobile/components/subcategories-with-featured-topics.hbs b/app/assets/javascripts/discourse/app/templates/mobile/components/subcategories-with-featured-topics.hbs
index 7d185267fab..dbd77d2a9bf 100644
--- a/app/assets/javascripts/discourse/app/templates/mobile/components/subcategories-with-featured-topics.hbs
+++ b/app/assets/javascripts/discourse/app/templates/mobile/components/subcategories-with-featured-topics.hbs
@@ -7,7 +7,7 @@
         }}</span>
     </div>
     <div class="subcategories">
-      {{#each category.subcategories as |subCategory|}}
+      {{#each category.serializedSubcategories as |subCategory|}}
         <ParentCategoryRow @category={{subCategory}} @showTopics={{true}} />
       {{else}}
         {{! No subcategories... so just show the parent to avoid confusion }}
diff --git a/app/assets/javascripts/discourse/tests/acceptance/categories-test.js b/app/assets/javascripts/discourse/tests/acceptance/categories-test.js
index fef0161809e..a8cde12abdc 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/categories-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/categories-test.js
@@ -78,7 +78,7 @@ acceptance("Categories - 'categories_with_featured_topics'", function (needs) {
 });
 
 acceptance(
-  "Categories - 'subcategories_with_featured_topics'",
+  "Categories - 'subcategories_with_featured_topics' (desktop)",
   function (needs) {
     needs.settings({
       desktop_category_page_style: "subcategories_with_featured_topics",
@@ -103,6 +103,33 @@ acceptance(
   }
 );
 
+acceptance(
+  "Categories - 'subcategories_with_featured_topics' (mobile)",
+  function (needs) {
+    needs.mobileView();
+    needs.settings({
+      desktop_category_page_style: "subcategories_with_featured_topics",
+    });
+    test("basic functionality", async function (assert) {
+      await visit("/categories");
+      assert.ok(
+        exists("div.subcategory-list.with-topics h3 .category-name"),
+        "shows heading for top-level category"
+      );
+      assert.ok(
+        exists(
+          "div.subcategory-list.with-topics div[data-category-id=26] h3 .category-name"
+        ),
+        "shows element for subcategories"
+      );
+      assert.ok(
+        exists("div.category-list.with-topics a[data-topic-id=11994]"),
+        "shows a featured topic"
+      );
+    });
+  }
+);
+
 acceptance("Categories - preloadStore handling", function () {
   const styles = [
     "categories_only",