FIX: prevents debouncing and query to override each other (#11704)

Before this change we were setting the input after the query has been done, resulting in us overwriting the input if the user types during the query.
We don't need to update it after the query, we just need to ensure it's set when we load the page and then it should stay in sync.

app/assets/javascripts/discourse/app/controllers/users.js

@@ -1,4 +1,5 @@
 import Controller, { inject as controller } from "@ember/controller";
+import { action } from "@ember/object";
 import discourseDebounce from "discourse-common/lib/debounce";
 import { equal } from "@ember/object/computed";
 import { longDate } from "discourse/lib/formatter";
@@ -12,6 +13,7 @@ export default Controller.extend({
   asc: null,
   name: "",
   group: null,
+  nameInput: null,
   exclude_usernames: null,
   isLoading: false,
 
@@ -20,6 +22,8 @@ export default Controller.extend({
   loadUsers(params) {
     this.set("isLoading", true);
 
+    this.set("nameInput", params.name);
+
     this.store
       .find("directoryItem", params)
       .then((model) => {
@@ -28,7 +32,6 @@ export default Controller.extend({
           model,
           lastUpdatedAt: lastUpdatedAt ? longDate(lastUpdatedAt) : null,
           period: params.period,
-          nameInput: params.name,
         });
       })
       .finally(() => {
@@ -36,25 +39,22 @@ export default Controller.extend({
       });
   },
 
-  @observes("nameInput")
-  _setName() {
-    discourseDebounce(
-      this,
-      function () {
-        this.set("name", this.nameInput);
-      },
-      500
-    );
+  @action
+  onFilterChanged(filter) {
+    discourseDebounce(this, this._setName, filter, 500);
+  },
+
+  _setName(name) {
+    this.set("name", name);
   },
 
   @observes("model.canLoadMore")
-  _showFooter: function () {
+  _showFooter() {
     this.set("application.showFooter", !this.get("model.canLoadMore"));
   },
 
-  actions: {
-    loadMore() {
-      this.model.loadMore();
-    },
+  @action
+  loadMore() {
+    this.model.loadMore();
   },
 });

app/assets/javascripts/discourse/app/templates/mobile/users.hbs

@@ -11,7 +11,12 @@
             {{lastUpdatedAt}}
           </div>
         {{/if}}
-        {{text-field value=nameInput placeholderKey="directory.filter_name" class="filter-name no-blur"}}
+        {{input
+          value=(readonly nameInput)
+          input=(action "onFilterChanged" value="target.value")
+          placeholderKey="directory.filter_name"
+          class="filter-name no-blur"
+        }}
       </div>
 
       {{#conditional-loading-spinner condition=model.loading}}

app/assets/javascripts/discourse/app/templates/users.hbs

@@ -19,7 +19,12 @@
                 {{i18n "directory.total_rows" count=model.totalRows}}
               {{/if}}
             </span>
-            {{text-field value=nameInput placeholderKey="directory.filter_name" class="filter-name no-blur"}}
+            {{input
+              value=(readonly nameInput)
+              input=(action "onFilterChanged" value="target.value")
+              placeholderKey="directory.filter_name"
+              class="filter-name no-blur"
+            }}
           </div>
         </div>