DEV: refactor components to use discourse-computed decorator without reference to `this` (#16011)

Most computed properties are already implemented this way. These changes make the missing ones also use it.

app/assets/javascripts/discourse/app/components/category-permission-row.js

@@ -63,8 +63,8 @@ export default Component.extend({
   },
 
   @discourseComputed("replyDisabled")
-  replyTooltip() {
-    return this.replyDisabled
+  replyTooltip(replyDisabled) {
+    return replyDisabled
       ? I18n.t("category.permissions.inherited")
       : I18n.t("category.permissions.toggle_reply");
   },
@@ -82,8 +82,8 @@ export default Component.extend({
   },
 
   @discourseComputed("createDisabled")
-  createTooltip() {
-    return this.createDisabled
+  createTooltip(createDisabled) {
+    return createDisabled
       ? I18n.t("category.permissions.inherited")
       : I18n.t("category.permissions.toggle_full");
   },

app/assets/javascripts/discourse/app/components/composer-title.js

@@ -62,10 +62,10 @@ export default Component.extend({
   },
 
   @discourseComputed("watchForLink")
-  titleMaxLength() {
+  titleMaxLength(watchForLink) {
     // maxLength gets in the way of pasting long links, so don't use it if featured links are allowed.
     // Validation will display a message if titles are too long.
-    return this.watchForLink ? null : this.siteSettings.max_topic_title_length;
+    return watchForLink ? null : this.siteSettings.max_topic_title_length;
   },
 
   @observes("composer.titleLength", "watchForLink")

app/assets/javascripts/discourse/app/components/create-topics-notice.js

@@ -54,12 +54,12 @@ export default Component.extend({
     "publicTopicCount",
     "publicPostCount"
   )
-  hidden() {
+  hidden(enabled, shouldSee, publicTopicCount, publicPostCount) {
     return (
-      !this.enabled ||
-      !this.shouldSee ||
-      this.publicTopicCount == null ||
-      this.publicPostCount == null
+      !enabled ||
+      !shouldSee ||
+      publicTopicCount == null ||
+      publicPostCount == null
     );
   },
 
@@ -68,15 +68,15 @@ export default Component.extend({
     "publicPostCount",
     "topicTrackingState.incomingCount"
   )
-  message() {
+  message(publicTopicCount, publicPostCount) {
     let msg = null;
 
     if (
-      this.publicTopicCount < this.requiredTopics &&
-      this.publicPostCount < this.requiredPosts
+      publicTopicCount < this.requiredTopics &&
+      publicPostCount < this.requiredPosts
     ) {
       msg = "too_few_topics_and_posts_notice_MF";
-    } else if (this.publicTopicCount < this.requiredTopics) {
+    } else if (publicTopicCount < this.requiredTopics) {
       msg = "too_few_topics_notice_MF";
     } else {
       msg = "too_few_posts_notice_MF";
@@ -86,8 +86,8 @@ export default Component.extend({
       I18n.messageFormat(msg, {
         requiredTopics: this.requiredTopics,
         requiredPosts: this.requiredPosts,
-        currentTopics: this.publicTopicCount,
-        currentPosts: this.publicPostCount,
+        currentTopics: publicTopicCount,
+        currentPosts: publicPostCount,
       })
     );
   },

app/assets/javascripts/discourse/app/components/d-button.js

@@ -71,7 +71,7 @@ export default Component.extend({
 
   @discourseComputed("title", "translatedTitle")
   computedTitle(title, translatedTitle) {
-    if (this.title) {
+    if (title) {
       return I18n.t(title);
     }
     return translatedTitle;
@@ -79,7 +79,7 @@ export default Component.extend({
 
   @discourseComputed("label", "translatedLabel")
   computedLabel(label, translatedLabel) {
-    if (this.label) {
+    if (label) {
       return I18n.t(label);
     }
     return translatedLabel;

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

@@ -22,17 +22,17 @@ export default Component.extend({
   ),
 
   @discourseComputed("post.user")
-  name() {
-    if (prioritizeNameInUx(this.post.user.name)) {
-      return this.post.user.name;
+  name(postUser) {
+    if (prioritizeNameInUx(postUser.name)) {
+      return postUser.name;
     }
-    return this.post.user.username;
+    return postUser.username;
   },
 
   @discourseComputed("post.user")
-  primaryGroup() {
-    if (this.post.user.primary_group_name) {
-      return `group-${this.post.user.primary_group_name}`;
+  primaryGroup(postUser) {
+    if (postUser.primary_group_name) {
+      return `group-${postUser.primary_group_name}`;
     }
   },
 });

app/assets/javascripts/discourse/app/components/invite-panel.js

@@ -144,7 +144,7 @@ export default Component.extend({
 
   @discourseComputed("inviteModel", "inviteModel.details.can_invite_via_email")
   canInviteViaEmail(inviteModel, canInviteViaEmail) {
-    return this.inviteModel === this.currentUser ? true : canInviteViaEmail;
+    return inviteModel === this.currentUser ? true : canInviteViaEmail;
   },
 
   @discourseComputed("isPM", "canInviteViaEmail")

app/assets/javascripts/discourse/app/components/pwa-install-banner.js

@@ -36,17 +36,17 @@ export default Component.extend({
   },
 
   @discourseComputed("deferredInstallPromptEvent", "bannerDismissed")
-  showPWAInstallBanner() {
+  showPWAInstallBanner(deferredInstallPromptEvent, bannerDismissed) {
     const launchedFromDiscourseHub =
       window.location.search.indexOf("discourse_app=1") !== -1;
 
     return (
       this.capabilities.isAndroid &&
       this.get("currentUser.trust_level") > 0 &&
-      this.deferredInstallPromptEvent && // Pass the browser engagement checks
+      deferredInstallPromptEvent && // Pass the browser engagement checks
       !window.matchMedia("(display-mode: standalone)").matches && // Not be in the installed PWA already
       !launchedFromDiscourseHub && // not launched via official app
-      !this.bannerDismissed // Have not a previously dismissed install banner
+      !bannerDismissed // Have not a previously dismissed install banner
     );
   },