diff --git a/app/assets/javascripts/discourse/app/components/input-tip.gjs b/app/assets/javascripts/discourse/app/components/input-tip.gjs
new file mode 100644
index 00000000000..b663ce0f02d
--- /dev/null
+++ b/app/assets/javascripts/discourse/app/components/input-tip.gjs
@@ -0,0 +1,16 @@
+import icon from "discourse-common/helpers/d-icon";
+
+const InputTip = <template>
+  <div
+    class="tip {{if @validation.failed 'bad' 'good'}}"
+    id={{@id}}
+    ...attributes
+  >
+    {{#if @validation.reason}}
+      {{icon (if @validation.failed "times" "check")}}
+      {{@validation.reason}}
+    {{/if}}
+  </div>
+</template>;
+
+export default InputTip;
diff --git a/app/assets/javascripts/discourse/app/components/input-tip.hbs b/app/assets/javascripts/discourse/app/components/input-tip.hbs
deleted file mode 100644
index af02c408564..00000000000
--- a/app/assets/javascripts/discourse/app/components/input-tip.hbs
+++ /dev/null
@@ -1,4 +0,0 @@
-{{#if this.tipReason}}
-  {{this.tipIcon}}
-  {{this.tipReason}}
-{{/if}}
\ No newline at end of file
diff --git a/app/assets/javascripts/discourse/app/components/input-tip.js b/app/assets/javascripts/discourse/app/components/input-tip.js
deleted file mode 100644
index 406fff61ffb..00000000000
--- a/app/assets/javascripts/discourse/app/components/input-tip.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import Component from "@ember/component";
-import { alias, not } from "@ember/object/computed";
-import { htmlSafe } from "@ember/template";
-import { iconHTML } from "discourse-common/lib/icon-library";
-
-export default Component.extend({
-  classNameBindings: [":tip", "good", "bad"],
-  tipIcon: null,
-  tipReason: null,
-
-  bad: alias("validation.failed"),
-  good: not("bad"),
-
-  tipIconHTML() {
-    let icon = iconHTML(this.good ? "check" : "times");
-    return htmlSafe(`${icon}`);
-  },
-
-  didReceiveAttrs() {
-    this._super(...arguments);
-    let reason = this.get("validation.reason");
-    if (reason) {
-      this.set("tipIcon", this.tipIconHTML());
-      this.set("tipReason", reason);
-    } else {
-      this.set("tipIcon", null);
-      this.set("tipReason", null);
-    }
-  },
-});
diff --git a/app/assets/javascripts/discourse/app/components/modal/create-account.hbs b/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
index f99c90b10e4..e7fe6850b05 100644
--- a/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
+++ b/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
@@ -58,7 +58,7 @@
             </label>
             <InputTip
               @validation={{this.emailValidation}}
-              @id="account-email-validation"
+              id="account-email-validation"
             />
             <span class="more-info">{{i18n "user.email.instructions"}}</span>
           </div>
@@ -84,7 +84,7 @@
 
             <InputTip
               @validation={{this.usernameValidation}}
-              @id="username-validation"
+              id="username-validation"
             />
             <span class="more-info">
               {{i18n "user.username.instructions"}}
@@ -112,7 +112,7 @@
 
               <InputTip
                 @validation={{this.nameValidation}}
-                @id="fullname-validation"
+                id="fullname-validation"
               />
               <span class="more-info">{{this.nameInstructions}}</span>
             {{/if}}
@@ -152,7 +152,7 @@
                 <div class="create-account__password-tip-validation">
                   <InputTip
                     @validation={{this.passwordValidation}}
-                    @id="password-validation"
+                    id="password-validation"
                   />
                   <span class="more-info">{{this.passwordInstructions}}</span>
                   <div
diff --git a/app/assets/javascripts/discourse/app/components/user-fields/text.hbs b/app/assets/javascripts/discourse/app/components/user-fields/text.hbs
index 7f25661e6fa..64b5bb1d289 100644
--- a/app/assets/javascripts/discourse/app/components/user-fields/text.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-fields/text.hbs
@@ -13,7 +13,7 @@
   </label>
   <InputTip
     @validation={{this.validation}}
-    class={{unless this.validation " hidden"}}
+    class={{unless this.validation "hidden"}}
   />
   <div class="instructions">{{html-safe this.field.description}}</div>
 </div>
\ No newline at end of file
diff --git a/app/assets/javascripts/discourse/app/templates/invites/show.hbs b/app/assets/javascripts/discourse/app/templates/invites/show.hbs
index 1b21fcae7e7..9e3e36054c9 100644
--- a/app/assets/javascripts/discourse/app/templates/invites/show.hbs
+++ b/app/assets/javascripts/discourse/app/templates/invites/show.hbs
@@ -46,7 +46,7 @@
                 {{#unless this.isInviteLink}}
                   <InputTip
                     @validation={{this.emailValidation}}
-                    @id="account-email-validation"
+                    id="account-email-validation"
                   />
                 {{/unless}}
               {{else}}
@@ -85,7 +85,7 @@
                     </label>
                     <InputTip
                       @validation={{this.emailValidation}}
-                      @id="account-email-validation"
+                      id="account-email-validation"
                     />
                     <div class="instructions">{{i18n
                         "user.email.instructions"
@@ -108,7 +108,7 @@
                   </label>
                   <InputTip
                     @validation={{this.usernameValidation}}
-                    @id="username-validation"
+                    id="username-validation"
                   />
                   <div class="instructions">{{i18n
                       "user.username.instructions"
@@ -150,7 +150,7 @@
                       <div class="create-account__password-tip-validation">
                         <InputTip
                           @validation={{this.passwordValidation}}
-                          @id="password-validation"
+                          id="password-validation"
                         />
                         <span
                           class="more-info"