From eaa45ae4d0d9fad7e1b881650a6ddb97a174e590 Mon Sep 17 00:00:00 2001
From: David Taylor <david@taylorhq.com>
Date: Fri, 6 Dec 2024 10:08:10 +0000
Subject: [PATCH] DEV: Update transformers in topic-list/item (#30105)

These will enable https://github.com/discourse/discourse-topic-thumbnails/pull/60
---
 .../app/components/topic-list/item.gjs        | 38 +++++++++++--------
 .../app/components/topic-list/list.gjs        |  3 +-
 .../discourse/app/lib/transformer/registry.js |  2 +
 3 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/topic-list/item.gjs b/app/assets/javascripts/discourse/app/components/topic-list/item.gjs
index a5251c4594c..ae3b44cb6b5 100644
--- a/app/assets/javascripts/discourse/app/components/topic-list/item.gjs
+++ b/app/assets/javascripts/discourse/app/components/topic-list/item.gjs
@@ -185,6 +185,14 @@ export default class Item extends Component {
     }
   }
 
+  get useMobileLayout() {
+    return applyValueTransformer(
+      "topic-list-item-mobile-layout",
+      this.site.mobileView,
+      { topic: this.args.topic }
+    );
+  }
+
   <template>
     <tr
       {{! template-lint-disable no-invalid-interactive }}
@@ -210,7 +218,7 @@ export default class Item extends Component {
         (if @topic.closed "closed")
         this.tagClassNames
         (applyValueTransformer
-          "topic-list-item-class" (array) (hash topic=@topic)
+          "topic-list-item-class" (array) (hash topic=@topic index=@index)
         )
       }}
     >
@@ -218,20 +226,7 @@ export default class Item extends Component {
         @name="above-topic-list-item"
         @outletArgs={{hash topic=@topic}}
       />
-      {{#if this.site.desktopView}}
-        {{#each @columns as |entry|}}
-          <entry.value.item
-            @topic={{@topic}}
-            @bulkSelectEnabled={{@bulkSelectEnabled}}
-            @onBulkSelectToggle={{this.onBulkSelectToggle}}
-            @isSelected={{this.isSelected}}
-            @showTopicPostBadges={{@showTopicPostBadges}}
-            @hideCategory={{@hideCategory}}
-            @tagsForUser={{@tagsForUser}}
-            @expandPinned={{this.expandPinned}}
-          />
-        {{/each}}
-      {{else}}
+      {{#if this.useMobileLayout}}
         <td class="topic-list-data">
           <div class="pull-left">
             {{#if @bulkSelectEnabled}}
@@ -337,6 +332,19 @@ export default class Item extends Component {
             </div>
           </div>
         </td>
+      {{else}}
+        {{#each @columns as |entry|}}
+          <entry.value.item
+            @topic={{@topic}}
+            @bulkSelectEnabled={{@bulkSelectEnabled}}
+            @onBulkSelectToggle={{this.onBulkSelectToggle}}
+            @isSelected={{this.isSelected}}
+            @showTopicPostBadges={{@showTopicPostBadges}}
+            @hideCategory={{@hideCategory}}
+            @tagsForUser={{@tagsForUser}}
+            @expandPinned={{this.expandPinned}}
+          />
+        {{/each}}
       {{/if}}
     </tr>
   </template>
diff --git a/app/assets/javascripts/discourse/app/components/topic-list/list.gjs b/app/assets/javascripts/discourse/app/components/topic-list/list.gjs
index 71af1e73ad8..549a18c4af2 100644
--- a/app/assets/javascripts/discourse/app/components/topic-list/list.gjs
+++ b/app/assets/javascripts/discourse/app/components/topic-list/list.gjs
@@ -1,6 +1,6 @@
 import Component from "@glimmer/component";
 import { cached } from "@glimmer/tracking";
-import { hash } from "@ember/helper";
+import { array, hash } from "@ember/helper";
 import { service } from "@ember/service";
 import { eq, or } from "truth-helpers";
 import PluginOutlet from "discourse/components/plugin-outlet";
@@ -172,6 +172,7 @@ export default class TopicList extends Component {
       class={{concatClass
         "topic-list"
         (if this.bulkSelectEnabled "sticky-header")
+        (applyValueTransformer "topic-list-class" (array) (hash topics=@topics))
       }}
     >
       <caption class="sr-only">{{i18n "sr_topic_list_caption"}}</caption>
diff --git a/app/assets/javascripts/discourse/app/lib/transformer/registry.js b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
index 376638004b4..0fca6486ffe 100644
--- a/app/assets/javascripts/discourse/app/lib/transformer/registry.js
+++ b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
@@ -21,5 +21,7 @@ export const VALUE_TRANSFORMERS = Object.freeze([
   "small-user-attrs",
   "topic-list-columns",
   "topic-list-header-sortable-column",
+  "topic-list-class",
   "topic-list-item-class",
+  "topic-list-item-mobile-layout",
 ]);