diff --git a/app/assets/javascripts/discourse/app/components/add-topic-status-classes.gjs b/app/assets/javascripts/discourse/app/components/add-topic-status-classes.gjs
new file mode 100644
index 00000000000..328bbfaafca
--- /dev/null
+++ b/app/assets/javascripts/discourse/app/components/add-topic-status-classes.gjs
@@ -0,0 +1,15 @@
+import bodyClass from "discourse/helpers/body-class";
+
+const AddTopicStatusClasses = <template>
+  {{#if @topic.invisible}}
+    {{bodyClass "topic-status-unlisted"}}
+  {{/if}}
+  {{#if @topic.pinned}}
+    {{bodyClass "topic-status-pinned"}}
+  {{/if}}
+  {{#if @topic.unpinned}}
+    {{bodyClass "topic-status-unpinned"}}
+  {{/if}}
+</template>;
+
+export default AddTopicStatusClasses;
diff --git a/app/assets/javascripts/discourse/app/components/add-topic-status-classes.js b/app/assets/javascripts/discourse/app/components/add-topic-status-classes.js
deleted file mode 100644
index e445eae1acb..00000000000
--- a/app/assets/javascripts/discourse/app/components/add-topic-status-classes.js
+++ /dev/null
@@ -1,50 +0,0 @@
-import Component from "@ember/component";
-import { scheduleOnce } from "@ember/runloop";
-
-export default Component.extend({
-  tagName: "",
-
-  didInsertElement() {
-    this._super(...arguments);
-    this.refreshClass();
-  },
-
-  _updateClass() {
-    if (this.isDestroying || this.isDestroyed) {
-      return;
-    }
-    const body = document.getElementsByTagName("body")[0];
-
-    this._removeClass();
-
-    if (this.topic.invisible) {
-      body.classList.add("topic-status-unlisted");
-    }
-    if (this.topic.pinned) {
-      body.classList.add("topic-status-pinned");
-    }
-    if (this.topic.unpinned) {
-      body.classList.add("topic-status-unpinned");
-    }
-  },
-
-  didReceiveAttrs() {
-    this._super(...arguments);
-    this.refreshClass();
-  },
-
-  refreshClass() {
-    scheduleOnce("afterRender", this, this._updateClass);
-  },
-
-  _removeClass() {
-    const regx = new RegExp(/\btopic-status-\S+/, "g");
-    const body = document.getElementsByTagName("body")[0];
-    body.className = body.className.replace(regx, "");
-  },
-
-  willDestroyElement() {
-    this._super(...arguments);
-    this._removeClass();
-  },
-});