DEV: Refactors following code review (#100)

assets/javascripts/discourse-assign/controllers/group-assigned.js.es6

@@ -1,8 +1,10 @@
 import { inject as service } from "@ember/service";
 import Controller, { inject as controller } from "@ember/controller";
+import { action } from "@ember/object";
+import { debounce } from "@ember/runloop";
 import { ajax } from "discourse/lib/ajax";
-import discourseComputed, { observes } from "discourse-common/utils/decorators";
-import discourseDebounce from "discourse/lib/debounce";
+import discourseComputed from "discourse-common/utils/decorators";
+import { INPUT_DELAY } from "discourse-common/config/environment";
 
 export default Controller.extend({
   router: service(),
@@ -17,30 +19,25 @@ export default Controller.extend({
     return !mobileView;
   },
 
-  @observes("filterName")
-  _setFilter: discourseDebounce(function() {
-    this.set("filter", this.filterName);
-  }, 500),
-
-  @observes("filter")
-  _filterModel() {
+  _setFilter(filter) {
     this.set("loading", true);
     this.set("offset", 0);
-    ajax(`/assign/members/${this.group.name}`, {
+    this.set("filter", filter);
+
+    const groupName = this.group.name;
+    ajax(`/assign/members/${groupName}`, {
       type: "GET",
       data: { filter: this.filter, offset: this.offset }
-    }).then(result => {
-      if (this.router.currentRoute.params.filter !== "everyone") {
-        this.transitionToRoute("group.assigned.show", "everyone");
-      }
-      this.set("members", result.members);
-      this.set("loading", false);
-    });
-  },
-
-  @observes("model.assignment_count")
-  assignmentCountChanged() {
-    this.set("group.assignment_count", this.model.assignment_count);
+    })
+      .then(result => {
+        if (this.router.currentRoute.params.filter !== "everyone") {
+          this.transitionToRoute("group.assigned.show", groupName, "everyone");
+        }
+        this.set("members", result.members);
+      })
+      .finally(() => {
+        this.set("loading", false);
+      });
   },
 
   findMembers(refresh) {
@@ -59,16 +56,21 @@ export default Controller.extend({
       ajax(`/assign/members/${this.group.name}`, {
         type: "GET",
         data: { filter: this.filter, offset: this.offset }
-      }).then(result => {
-        this.members.pushObjects(result.members);
-        this.set("loading", false);
-      });
+      })
+        .then(result => {
+          this.members.pushObjects(result.members);
+        })
+        .finally(() => this.set("loading", false));
     }
   },
 
-  actions: {
-    loadMore: function() {
-      this.findMembers();
-    }
+  @action
+  loadMore() {
+    this.findMembers();
+  },
+
+  @action
+  onChangeFilterName(value) {
+    debounce(this, this._setFilter, value, INPUT_DELAY * 2);
   }
 });

assets/javascripts/discourse-assign/routes/group-assigned.js.es6

@@ -12,6 +12,7 @@ export default DiscourseRoute.extend({
       members: [],
       group: this.modelFor("group")
     });
+    controller.group.set("assignment_count", model.assignment_count);
 
     controller.findMembers(true);
   },

assets/javascripts/discourse/templates/components/group-assigned-filter.hbs

@@ -1,7 +1,7 @@
 {{#if show-avatar}}
   {{#link-to "group.assigned.show" filter.username_lower}}
     <div class="assign-image">
-      <a href={{filter.userPath}} data-user-card={{filter.username}}>{{avatar filter imageSize="large"}}</a>      
+      <a href={{filter.userPath}} data-user-card={{filter.username}}>{{avatar filter imageSize="large"}}</a>
     </div>
 
     <div class="assign-names">
@@ -19,7 +19,7 @@
       {{i18n 'discourse_assign.group_everyone'}}
     </div>
     <div class="assign-count">
-      {{assignment_count}}
+      {{assignmentCount}}
     </div>
   {{/link-to}}
 {{/if}}

assets/javascripts/discourse/templates/group/assigned.hbs

@@ -2,11 +2,17 @@
   {{#mobile-nav class="activity-nav" desktopClass="action-list activity-list nav-stacked" currentPath=router._router.currentPath}}
     {{#if isDesktop}}
       <div class="search-div">
-        {{input type="text" placeholder=(i18n "discourse_assign.sidebar_name_filter_placeholder") value=filterName class="search"}}
+        {{input
+          type="text"
+          placeholder=(i18n "discourse_assign.sidebar_name_filter_placeholder")
+          value=filterName
+          class="search"
+          input=(action "onChangeFilterName" value="target.value")
+        }}
       </div>
     {{/if}}
     {{#load-more selector=".activity-nav li" action=(action "loadMore")}}
-      {{group-assigned-filter show-avatar=false filter="everyone" routeType=route_type assignment_count=group.assignment_count}}
+      {{group-assigned-filter show-avatar=false filter="everyone" routeType=route_type assignmentCount=group.assignment_count}}
       {{#each members as |member|}}
         {{group-assigned-filter show-avatar=true filter=member routeType=route_type}}
       {{/each}}