1 files changed, 22 insertions, 18 deletions

diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js
index b2add862051..c64553a1b92 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js
@@ -1,13 +1,20 @@
 import _ from 'underscore';
 import DropLab from '~/droplab/drop_lab';
 import FilteredSearchContainer from './container';
-
-class FilteredSearchDropdownManager {
+import FilteredSearchTokenKeys from './filtered_search_token_keys';
+import DropdownUtils from './dropdown_utils';
+import DropdownHint from './dropdown_hint';
+import DropdownEmoji from './dropdown_emoji';
+import DropdownNonUser from './dropdown_non_user';
+import DropdownUser from './dropdown_user';
+import FilteredSearchVisualTokens from './filtered_search_visual_tokens';
+
+export default class FilteredSearchDropdownManager {
   constructor(baseEndpoint = '', tokenizer, page, isGroup, filteredSearchTokenKeys) {
     this.container = FilteredSearchContainer.container;
     this.baseEndpoint = baseEndpoint.replace(/\/$/, '');
     this.tokenizer = tokenizer;
-    this.filteredSearchTokenKeys = filteredSearchTokenKeys;
+    this.filteredSearchTokenKeys = filteredSearchTokenKeys || FilteredSearchTokenKeys;
     this.filteredSearchInput = this.container.querySelector('.filtered-search');
     this.page = page;
 
@@ -33,24 +40,24 @@ class FilteredSearchDropdownManager {
     const allowedMappings = {
       hint: {
         reference: null,
-        gl: 'DropdownHint',
+        gl: DropdownHint,
         element: this.container.querySelector('#js-dropdown-hint'),
       },
     };
     const availableMappings = {
       author: {
         reference: null,
-        gl: 'DropdownUser',
+        gl: DropdownUser,
         element: this.container.querySelector('#js-dropdown-author'),
       },
       assignee: {
         reference: null,
-        gl: 'DropdownUser',
+        gl: DropdownUser,
         element: this.container.querySelector('#js-dropdown-assignee'),
       },
       milestone: {
         reference: null,
-        gl: 'DropdownNonUser',
+        gl: DropdownNonUser,
         extraArguments: {
           endpoint: `${this.baseEndpoint}/milestones.json`,
           symbol: '%',
@@ -59,17 +66,17 @@ class FilteredSearchDropdownManager {
       },
       label: {
         reference: null,
-        gl: 'DropdownNonUser',
+        gl: DropdownNonUser,
         extraArguments: {
           endpoint: `${this.baseEndpoint}/labels.json`,
           symbol: '~',
-          preprocessing: gl.DropdownUtils.duplicateLabelPreprocessing,
+          preprocessing: DropdownUtils.duplicateLabelPreprocessing,
         },
         element: this.container.querySelector('#js-dropdown-label'),
       },
       'my-reaction': {
         reference: null,
-        gl: 'DropdownEmoji',
+        gl: DropdownEmoji,
         element: this.container.querySelector('#js-dropdown-my-reaction'),
       },
     };
@@ -86,11 +93,11 @@ class FilteredSearchDropdownManager {
   static addWordToInput(tokenName, tokenValue = '', clicked = false) {
     const input = FilteredSearchContainer.container.querySelector('.filtered-search');
 
-    gl.FilteredSearchVisualTokens.addFilterVisualToken(tokenName, tokenValue);
+    FilteredSearchVisualTokens.addFilterVisualToken(tokenName, tokenValue);
     input.value = '';
 
     if (clicked) {
-      gl.FilteredSearchVisualTokens.moveInputToTheRight();
+      FilteredSearchVisualTokens.moveInputToTheRight();
     }
   }
 
@@ -131,9 +138,9 @@ class FilteredSearchDropdownManager {
       const extraArguments = mappingKey.extraArguments || {};
       const glArguments = Object.assign({}, defaultArguments, extraArguments);
 
-      // Passing glArguments to `new gl[glClass](<arguments>)`
+      // Passing glArguments to `new glClass(<arguments>)`
       mappingKey.reference =
-        new (Function.prototype.bind.apply(gl[glClass], [null, glArguments]))();
+        new (Function.prototype.bind.apply(glClass, [null, glArguments]))();
     }
 
     if (firstLoad) {
@@ -171,7 +178,7 @@ class FilteredSearchDropdownManager {
   }
 
   setDropdown() {
-    const query = gl.DropdownUtils.getSearchQuery(true);
+    const query = DropdownUtils.getSearchQuery(true);
     const { lastToken, searchToken } =
       this.tokenizer.processTokens(query, this.filteredSearchTokenKeys.getKeys());
 
@@ -216,6 +223,3 @@ class FilteredSearchDropdownManager {
     this.droplab.destroy();
   }
 }
-
-window.gl = window.gl || {};
-gl.FilteredSearchDropdownManager = FilteredSearchDropdownManager;