diff --git a/app/assets/javascripts/discourse/app/components/private-message-glyph.gjs b/app/assets/javascripts/discourse/app/components/private-message-glyph.gjs
new file mode 100644
index 00000000000..a065dc1dd1c
--- /dev/null
+++ b/app/assets/javascripts/discourse/app/components/private-message-glyph.gjs
@@ -0,0 +1,20 @@
+import icon from "discourse-common/helpers/d-icon";
+import i18n from "discourse-common/helpers/i18n";
+
+const PrivateMessageGlyph = <template>
+  {{#if @shouldShow}}
+    {{#if @href}}
+      <a href={{@href}} title={{i18n @title}} aria-label={{i18n @ariaLabel}}>
+        <span class="private-message-glyph-wrapper">
+          {{icon "envelope" class="private-message-glyph"}}
+        </span>
+      </a>
+    {{~else}}
+      <span class="private-message-glyph-wrapper">
+        {{icon "envelope" class="private-message-glyph"}}
+      </span>
+    {{~/if}}
+  {{/if}}
+</template>;
+
+export default PrivateMessageGlyph;
diff --git a/app/assets/javascripts/discourse/app/components/private-message-glyph.hbs b/app/assets/javascripts/discourse/app/components/private-message-glyph.hbs
deleted file mode 100644
index 12f20500d3a..00000000000
--- a/app/assets/javascripts/discourse/app/components/private-message-glyph.hbs
+++ /dev/null
@@ -1,17 +0,0 @@
-{{#if this.shouldShow}}
-  {{#if this.href}}
-    <a
-      href={{this.href}}
-      title={{i18n this.title}}
-      aria-label={{i18n this.ariaLabel}}
-    >
-      <span class="private-message-glyph-wrapper">
-        {{d-icon "envelope" class="private-message-glyph"}}
-      </span>
-    </a>
-  {{~else}}
-    <span class="private-message-glyph-wrapper">
-      {{d-icon "envelope" class="private-message-glyph"}}
-    </span>
-  {{~/if}}
-{{/if}}
\ No newline at end of file
diff --git a/app/assets/javascripts/discourse/app/components/private-message-glyph.js b/app/assets/javascripts/discourse/app/components/private-message-glyph.js
deleted file mode 100644
index d1d40424515..00000000000
--- a/app/assets/javascripts/discourse/app/components/private-message-glyph.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import Component from "@ember/component";
-
-export default Component.extend({
-  tagName: null,
-  href: null,
-  title: null,
-  ariaLabel: null,
-  shouldShow: null,
-});
diff --git a/app/assets/javascripts/discourse/app/templates/topic.hbs b/app/assets/javascripts/discourse/app/templates/topic.hbs
index f08a8170429..d27e4bdcc3c 100644
--- a/app/assets/javascripts/discourse/app/templates/topic.hbs
+++ b/app/assets/javascripts/discourse/app/templates/topic.hbs
@@ -50,10 +50,7 @@
       >
         {{#if this.editingTopic}}
           <div class="edit-topic-title">
-            <PrivateMessageGlyph
-              @shouldShow={{this.model.isPrivateMessage}}
-              @tagName=""
-            />
+            <PrivateMessageGlyph @shouldShow={{this.model.isPrivateMessage}} />
 
             <TextField
               @id="edit-title"
@@ -129,12 +126,10 @@
                   @href={{this.pmPath}}
                   @title="topic_statuses.personal_message.title"
                   @ariaLabel="user.messages.inbox"
-                  @tagName=""
                 />
               {{else}}
                 <PrivateMessageGlyph
                   @shouldShow={{this.model.isPrivateMessage}}
-                  @tagName=""
                 />
               {{/if}}
             {{/unless}}