From 894eb66a0d19be45afaf8ef471792bd5ae1c30fa Mon Sep 17 00:00:00 2001
From: Mark VanLandingham <mark.vanlandingham@discourse.org>
Date: Fri, 2 Jul 2021 09:51:14 -0500
Subject: [PATCH] FIX: Do not reload whole directory table on username input
 change (#13616)

---
 .../discourse/app/controllers/users.js        | 43 ++++++++++++-------
 .../javascripts/discourse/app/routes/users.js |  2 +-
 2 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/controllers/users.js b/app/assets/javascripts/discourse/app/controllers/users.js
index ebdca0a9931..ce9d403182e 100644
--- a/app/assets/javascripts/discourse/app/controllers/users.js
+++ b/app/assets/javascripts/discourse/app/controllers/users.js
@@ -20,27 +20,34 @@ export default Controller.extend({
   isLoading: false,
   columns: null,
   groupsOptions: null,
+  params: null,
 
   showTimeRead: equal("period", "all"),
 
-  loadUsers(params) {
-    this.set("isLoading", true);
+  loadUsers(params = null) {
+    if (params) {
+      this.set("params", params);
+    }
 
-    this.set("nameInput", params.name);
-    this.set("order", params.order);
+    this.setProperties({
+      isLoading: true,
+      nameInput: this.params.name,
+      order: this.params.order,
+    });
 
-    const userFieldColumns = this.columns.filter(
-      (c) => c.type === "user_field"
-    );
-    const userFieldIds = userFieldColumns.map((c) => c.user_field_id).join("|");
-
-    const pluginColumns = this.columns.filter((c) => c.type === "plugin");
-    const pluginColumnIds = pluginColumns.map((c) => c.id).join("|");
+    const userFieldIds = this.columns
+      .filter((c) => c.type === "user_field")
+      .map((c) => c.user_field_id)
+      .join("|");
+    const pluginColumnIds = this.columns
+      .filter((c) => c.type === "plugin")
+      .map((c) => c.id)
+      .join("|");
 
     return this.store
       .find(
         "directoryItem",
-        Object.assign(params, {
+        Object.assign(this.params, {
           user_field_ids: userFieldIds,
           plugin_column_ids: pluginColumnIds,
         })
@@ -50,7 +57,7 @@ export default Controller.extend({
         this.setProperties({
           model,
           lastUpdatedAt: lastUpdatedAt ? longDate(lastUpdatedAt) : null,
-          period: params.period,
+          period: this.params.period,
         });
       })
       .finally(() => {
@@ -83,11 +90,15 @@ export default Controller.extend({
 
   @action
   onUsernameFilterChanged(filter) {
-    discourseDebounce(this, this._setName, filter, 500);
+    discourseDebounce(this, this._setUsernameFilter, filter, 500);
   },
 
-  _setName(name) {
-    this.set("name", name);
+  _setUsernameFilter(username) {
+    this.setProperties({
+      name: username,
+      "params.name": username,
+    });
+    this.loadUsers();
   },
 
   @observes("model.canLoadMore")
diff --git a/app/assets/javascripts/discourse/app/routes/users.js b/app/assets/javascripts/discourse/app/routes/users.js
index 52db423ac86..5af0399c0fa 100644
--- a/app/assets/javascripts/discourse/app/routes/users.js
+++ b/app/assets/javascripts/discourse/app/routes/users.js
@@ -9,7 +9,7 @@ export default DiscourseRoute.extend({
     period: { refreshModel: true },
     order: { refreshModel: true },
     asc: { refreshModel: true },
-    name: { refreshModel: true, replace: true },
+    name: { refreshModel: false, replace: true },
     group: { refreshModel: true },
     exclude_usernames: { refreshModel: true },
   },