1 files changed, 9 insertions, 12 deletions
diff --git a/app/assets/javascripts/pages/groups/new/group_path_validator.js b/app/assets/javascripts/pages/groups/new/group_path_validator.js
index a0ff98645fb..c58be202043 100644
--- a/app/assets/javascripts/pages/groups/new/group_path_validator.js
+++ b/app/assets/javascripts/pages/groups/new/group_path_validator.js
@@ -1,6 +1,6 @@
 import { debounce } from 'lodash';
 
-import { deprecatedCreateFlash as flash } from '~/flash';
+import createFlash from '~/flash';
 import { __ } from '~/locale';
 import InputValidator from '~/validators/input_validator';
 import fetchGroupPathAvailability from './fetch_group_path_availability';
@@ -12,7 +12,6 @@ const parentIdSelector = 'group_parent_id';
 const successMessageSelector = '.validation-success';
 const pendingMessageSelector = '.validation-pending';
 const unavailableMessageSelector = '.validation-error';
-const suggestionsMessageSelector = '.gl-path-suggestions';
 const inputGroupSelector = '.input-group';
 
 export default class GroupPathValidator extends InputValidator {
@@ -57,21 +56,19 @@ export default class GroupPathValidator extends InputValidator {
           );
 
           if (data.exists) {
-            GroupPathValidator.showSuggestions(inputDomElement, data.suggests);
+            const [suggestedSlug] = data.suggests;
+            const targetDomElement = document.querySelector('.js-autofill-group-path');
+            targetDomElement.value = suggestedSlug;
           }
         })
-        .catch(() => flash(__('An error occurred while validating group path')));
+        .catch(() =>
+          createFlash({
+            message: __('An error occurred while validating group path'),
+          }),
+        );
     }
   }
 
-  static showSuggestions(inputDomElement, suggestions) {
-    const messageElement = inputDomElement.parentElement.parentElement.querySelector(
-      suggestionsMessageSelector,
-    );
-    const textSuggestions = suggestions && suggestions.length > 0 ? suggestions.join(', ') : 'none';
-    messageElement.textContent = textSuggestions;
-  }
-
   static setMessageVisibility(inputDomElement, messageSelector, isVisible = true) {
     const messageElement = inputDomElement
       .closest(inputGroupSelector)