From 7323c65d535dcff92290c83127b622c91e3029e9 Mon Sep 17 00:00:00 2001
From: Osama Sayegh <asooomaasoooma90@gmail.com>
Date: Fri, 16 Jul 2021 05:51:13 +0300
Subject: [PATCH] FIX: Debounce group name validation correctly (#13757)

---
 .../components/groups-form-profile-fields.js  | 76 +++++++++----------
 1 file changed, 37 insertions(+), 39 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/groups-form-profile-fields.js b/app/assets/javascripts/discourse/app/components/groups-form-profile-fields.js
index d2a439ed543..43fb8c4d700 100644
--- a/app/assets/javascripts/discourse/app/components/groups-form-profile-fields.js
+++ b/app/assets/javascripts/discourse/app/components/groups-form-profile-fields.js
@@ -57,52 +57,50 @@ export default Component.extend({
       );
     }
 
-    this.checkGroupName();
+    this.checkGroupNameDebounced();
 
     return this._failedInputValidation(
       I18n.t("admin.groups.new.name.checking")
     );
   },
 
-  checkGroupName() {
-    discourseDebounce(
-      this,
-      function () {
-        if (isEmpty(this.nameInput)) {
-          return;
+  checkGroupNameDebounced() {
+    discourseDebounce(this, this._checkGroupName, 500);
+  },
+
+  _checkGroupName() {
+    if (isEmpty(this.nameInput)) {
+      return;
+    }
+
+    Group.checkName(this.nameInput)
+      .then((response) => {
+        const validationName = "uniqueNameValidation";
+
+        if (response.available) {
+          this.set(
+            validationName,
+            EmberObject.create({
+              ok: true,
+              reason: I18n.t("admin.groups.new.name.available"),
+            })
+          );
+
+          this.set("disableSave", false);
+          this.set("model.name", this.nameInput);
+        } else {
+          let reason;
+
+          if (response.errors) {
+            reason = response.errors.join(" ");
+          } else {
+            reason = I18n.t("admin.groups.new.name.not_available");
+          }
+
+          this.set(validationName, this._failedInputValidation(reason));
         }
-
-        Group.checkName(this.nameInput)
-          .then((response) => {
-            const validationName = "uniqueNameValidation";
-
-            if (response.available) {
-              this.set(
-                validationName,
-                EmberObject.create({
-                  ok: true,
-                  reason: I18n.t("admin.groups.new.name.available"),
-                })
-              );
-
-              this.set("disableSave", false);
-              this.set("model.name", this.nameInput);
-            } else {
-              let reason;
-
-              if (response.errors) {
-                reason = response.errors.join(" ");
-              } else {
-                reason = I18n.t("admin.groups.new.name.not_available");
-              }
-
-              this.set(validationName, this._failedInputValidation(reason));
-            }
-          })
-          .catch(popupAjaxError);
-      },
-      500
-    );
+      })
+      .catch(popupAjaxError);
   },
 
   _failedInputValidation(reason) {