DEV: Convert expand-post to glimmer/gjs/dbutton (#28339)

app/assets/javascripts/discourse/app/components/expand-post.gjs

@@ -0,0 +1,50 @@
+import Component from "@glimmer/component";
+import { tracked } from "@glimmer/tracking";
+import { action } from "@ember/object";
+import DButton from "discourse/components/d-button";
+import concatClass from "discourse/helpers/concat-class";
+import { ajax } from "discourse/lib/ajax";
+
+export default class ExpandPost extends Component {
+  @tracked expanded = false;
+  loading = false;
+
+  @action
+  async toggleItem() {
+    if (this.loading) {
+      return;
+    }
+
+    if (this.expanded) {
+      this.expanded = false;
+      this.args.item.set("expandedExcerpt", null);
+      return;
+    }
+
+    this.loading = true;
+    try {
+      const result = await ajax(
+        `/posts/by_number/${this.args.item.topic_id}/${this.args.item.post_number}.json`
+      );
+
+      this.expanded = true;
+      this.args.item.set("expandedExcerpt", result.cooked);
+    } finally {
+      this.loading = false;
+    }
+  }
+
+  <template>
+    {{#if @item.truncated}}
+      <DButton
+        @action={{this.toggleItem}}
+        @icon={{if this.expanded "chevron-up" "chevron-down"}}
+        @title="post.expand_collapse"
+        class={{concatClass
+          "btn-transparent"
+          (if this.expanded "collapse-item" "expand-item")
+        }}
+      />
+    {{/if}}
+  </template>
+}

app/assets/javascripts/discourse/app/components/expand-post.hbs

@@ -1,14 +0,0 @@
-{{#if this.item.truncated}}
-  <a
-    href
-    class={{if this.expanded "collapse-item" "expand-item"}}
-    onclick={{action "toggleItem"}}
-    title={{i18n "post.expand_collapse"}}
-  >
-    {{#if this.expanded}}
-      {{d-icon "chevron-up"}}
-    {{else}}
-      {{d-icon "chevron-down"}}
-    {{/if}}
-  </a>
-{{/if}}

app/assets/javascripts/discourse/app/components/expand-post.js

@@ -1,36 +0,0 @@
-import Component from "@ember/component";
-import { ajax } from "discourse/lib/ajax";
-
-export default Component.extend({
-  tagName: "",
-  expanded: null,
-  _loading: false,
-
-  actions: {
-    toggleItem() {
-      if (this._loading) {
-        return false;
-      }
-      const item = this.item;
-
-      if (this.expanded) {
-        this.set("expanded", false);
-        item.set("expandedExcerpt", null);
-        return false;
-      }
-
-      const topicId = item.get("topic_id");
-      const postNumber = item.get("post_number");
-
-      this._loading = true;
-      ajax(`/posts/by_number/${topicId}/${postNumber}.json`)
-        .then((result) => {
-          this.set("expanded", true);
-          item.set("expandedExcerpt", result.cooked);
-        })
-        .finally(() => (this._loading = false));
-
-      return false;
-    },
-  },
-});