DEV: Convert to native class syntax (#136)

Co-authored-by: Jarek Radosz <[email protected]>

Author: davidtaylorhq

assets/javascripts/discourse/components/follow-button.js

@@ -5,10 +5,11 @@ import { ajax } from "discourse/lib/ajax";
 import { popupAjaxError } from "discourse/lib/ajax-error";
 import discourseComputed from "discourse-common/utils/decorators";
 
-export default Component.extend({
-  loading: false,
-  isFollowed: alias("user.is_followed"),
-  canFollow: alias("user.can_follow"),
+export default class FollowButton extends Component {
+  loading = false;
+
+  @alias("user.is_followed") isFollowed;
+  @alias("user.can_follow") canFollow;
 
   @discourseComputed("user", "currentUser")
   showButton(user, currentUser) {
@@ -29,7 +30,7 @@ export default Component.extend({
       return false;
     }
     return true;
-  },
+  }
 
   @discourseComputed("isFollowed", "canFollow")
   labelKey(isFollowed, canFollow) {
@@ -38,7 +39,7 @@ export default Component.extend({
     } else {
       return "follow.follow_button_label";
     }
-  },
+  }
 
   @discourseComputed("isFollowed", "canFollow")
   icon(isFollowed, canFollow) {
@@ -47,7 +48,7 @@ export default Component.extend({
     } else {
       return "user-plus";
     }
-  },
+  }
 
   @action
   toggleFollow() {
@@ -61,5 +62,5 @@ export default Component.extend({
       .finally(() => {
         this.set("loading", false);
       });
-  },
-});
+  }
+}

assets/javascripts/discourse/components/follow-notification-preferences.js

@@ -1,5 +1,5 @@
 import Component from "@ember/component";
-import { observes } from "discourse-common/utils/decorators";
+import { observes } from "@ember-decorators/object";
 
 const preferences = [
   "notify_me_when_followed",
@@ -9,7 +9,7 @@ const preferences = [
   "allow_people_to_follow_me",
 ];
 
-export default Component.extend({
+export default class FollowNotificationPreferences extends Component {
   @observes(...preferences.map((p) => `user.${p}`))
   _updatePreferences() {
     if (!this.user.custom_fields) {
@@ -18,5 +18,5 @@ export default Component.extend({
     preferences.forEach((p) => {
       this.user.set(`custom_fields.${p}`, this.user[p]);
     });
-  },
-});
+  }
+}

assets/javascripts/discourse/components/follow-users-list.js

@@ -3,13 +3,13 @@ import { notEmpty } from "@ember/object/computed";
 import { propertyEqual } from "discourse/lib/computed";
 import discourseComputed from "discourse-common/utils/decorators";
 
-export default Component.extend({
-  hasUsers: notEmpty("users"),
-  viewingSelf: propertyEqual("user.username", "currentUser.username"),
+export default class FollowUsersList extends Component {
+  @notEmpty("users") hasUsers;
+  @propertyEqual("user.username", "currentUser.username") viewingSelf;
 
   @discourseComputed("type", "viewingSelf")
   noneMessage(type, viewingSelf) {
     let key = viewingSelf ? "none" : "none_other";
     return `user.${type}.${key}`;
-  },
-});
+  }
+}

assets/javascripts/discourse/controllers/feed.js

@@ -1,6 +1,6 @@
 import Controller from "@ember/controller";
 import { propertyEqual } from "discourse/lib/computed";
 
-export default Controller.extend({
-  viewingSelf: propertyEqual("model.user.id", "currentUser.id"),
-});
+export default class FeedController extends Controller {
+  @propertyEqual("model.user.id", "currentUser.id") viewingSelf;
+}

assets/javascripts/discourse/controllers/follow.js

@@ -1,3 +1,3 @@
 import Controller from "@ember/controller";
 
-export default Controller.extend({});
+export default class FollowController extends Controller {}

assets/javascripts/discourse/models/post-stream.js

@@ -1,31 +1,32 @@
 import EmberObject from "@ember/object";
 import { reads } from "@ember/object/computed";
+import { on } from "@ember-decorators/object";
 import { Promise } from "rsvp";
 import { ajax } from "discourse/lib/ajax";
 import Category from "discourse/models/category";
 import RestModel from "discourse/models/rest";
-import discourseComputed, { on } from "discourse-common/utils/decorators";
+import discourseComputed from "discourse-common/utils/decorators";
 
 // this class implements an interface similar to the `UserStream` class in core
 // (app/models/user-stream.js) so we can use it with the `{{user-stream}}`
 // component (in core as well) which expects a `UserStream` instance.
 
-export default RestModel.extend({
-  loading: false,
-  itemsLoaded: 0,
-  canLoadMore: true,
+export default class PostStream extends RestModel {
+  loading = false;
+  itemsLoaded = 0;
+  canLoadMore = true;
 
-  lastPostCreatedAt: reads("content.lastObject.created_at"),
+  @reads("content.lastObject.created_at") lastPostCreatedAt;
 
   @on("init")
   _initialize() {
     this.set("content", []);
-  },
+  }
 
   @discourseComputed("loading", "content.length")
   noContent(loading, length) {
     return !loading && length === 0;
-  },
+  }
 
   findItems() {
     if (!this.canLoadMore || this.loading) {
@@ -68,5 +69,5 @@ export default RestModel.extend({
       .finally(() => {
         this.set("loading", false);
       });
-  },
-});
+  }
+}

assets/javascripts/discourse/routes/feed.js

@@ -1,12 +1,12 @@
 import DiscourseRoute from "discourse/routes/discourse";
 import PostStream from "../models/post-stream";
 
-export default DiscourseRoute.extend({
+export default class Feed extends DiscourseRoute {
   model() {
     return PostStream.create({ user: this.modelFor("user") });
-  },
+  }
 
   afterModel(model) {
     return model.findItems();
-  },
-});
+  }
+}

assets/javascripts/discourse/routes/followers.js

@@ -1,15 +1,15 @@
 import { ajax } from "discourse/lib/ajax";
 import DiscourseRoute from "discourse/routes/discourse";
 
-export default DiscourseRoute.extend({
-  model(/*params*/) {
+export default class Followers extends DiscourseRoute {
+  model() {
     return ajax(`/u/${this.paramsFor("user").username}/follow/followers`);
-  },
+  }
 
   setupController(controller, model) {
     controller.setProperties({
       users: model,
       user: this.modelFor("user"),
     });
-  },
-});
+  }
+}

assets/javascripts/discourse/routes/following.js

@@ -1,13 +1,13 @@
 import { ajax } from "discourse/lib/ajax";
 import DiscourseRoute from "discourse/routes/discourse";
 
-export default DiscourseRoute.extend({
-  model(/* params */) {
+export default class Following extends DiscourseRoute {
+  model() {
     return ajax(`/u/${this.paramsFor("user").username}/follow/following`);
-  },
+  }
 
   setupController(controller, model) {
     const user = this.modelFor("user");
     controller.setProperties({ users: model, user });
-  },
-});
+  }
+}