Fix clear button

app/assets/javascripts/droplab/droplab.js

@@ -51,26 +51,28 @@ Object.assign(DropDown.prototype, {
     return this.items;
   },
 
+  clickEvent: function(e) {
+    // climb up the tree to find the LI
+    var selected = utils.closest(e.target, 'LI');
+
+    if(selected) {
+      e.preventDefault();
+      this.hide();
+      var listEvent = new CustomEvent('click.dl', {
+        detail: {
+          list: this,
+          selected: selected,
+          data: e.target.dataset,
+        },
+      });
+      this.list.dispatchEvent(listEvent);
+    }
+  },
+
   addEvents: function() {
-    var self = this;
+    this.clickWrapper = this.clickEvent.bind(this);
     // event delegation.
-    this.list.addEventListener('click', function(e) {
-      // climb up the tree to find the LI
-      var selected = utils.closest(e.target, 'LI');
-
-      if(selected) {
-        e.preventDefault();
-        self.hide();
-        var listEvent = new CustomEvent('click.dl', {
-          detail: {
-            list: self,
-            selected: selected,
-            data: e.target.dataset,
-          },
-        });
-        self.list.dispatchEvent(listEvent);
-      }
-    });
+    this.list.addEventListener('click', this.clickWrapper);
   },
 
   toggle: function() {
@@ -93,6 +95,7 @@ Object.assign(DropDown.prototype, {
 
   // call render manually on data;
   render: function(data){
+    // debugger
     // empty the list first
     var sampleItem;
     var newChildren = [];
@@ -134,17 +137,23 @@ Object.assign(DropDown.prototype, {
   },
 
   show: function() {
+    // debugger
     this.list.style.display = 'block';
     this.hidden = false;
   },
 
   hide: function() {
+    // debugger
     this.list.style.display = 'none';
     this.hidden = true;
   },
 
   destroy: function() {
-    this.hide();
+    if (!this.hidden) {
+      this.hide();
+    }
+
+    this.list.removeEventListener('click', this.clickWrapper);
   }
 });
 
@@ -257,10 +266,6 @@ require('./window')(function(w){
         // list = document.querySelector(list);
         this.hooks.every(function(hook, i) {
           if(hook.trigger === trigger) {
-            // Restore initial State
-            hook.list.list.innerHTML = hook.list.initialState;
-            hook.list.hide();
-
             hook.destroy();
             this.hooks.splice(i, 1);
             this.addHook(trigger, list, plugins, config);

app/assets/javascripts/filtered_search/dropdown_assignee.js.es6

@@ -32,9 +32,9 @@
       this.dismissDropdown(!dataValueSet);
     }
 
-    renderContent() {
-      // TODO: Pass elements instead of querySelectors
+    renderContent(forceShowList = false) {
       this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
+      super.renderContent(forceShowList);
     }
 
     getSearchInput() {

app/assets/javascripts/filtered_search/dropdown_author.js.es6

@@ -28,9 +28,9 @@
       this.dismissDropdown();
     }
 
-    renderContent() {
-      // TODO: Pass elements instead of querySelectors
+    renderContent(forceShowList) {
       this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
+      super.renderContent(forceShowList);
     }
 
     getSearchInput() {

app/assets/javascripts/filtered_search/dropdown_label.js.es6

@@ -30,8 +30,9 @@
       this.dismissDropdown(!dataValueSet);
     }
 
-    renderContent() {
+    renderContent(forceShowList) {
       this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
+      super.renderContent(forceShowList);
     }
 
     configure() {

app/assets/javascripts/filtered_search/dropdown_milestone.js.es6

@@ -29,8 +29,9 @@
       this.dismissDropdown(!dataValueSet);
     }
 
-    renderContent() {
+    renderContent(forceShowList = false) {
       this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
+      super.renderContent(forceShowList);
     }
 
     configure() {

app/assets/javascripts/filtered_search/filtered_search_dropdown.js.es6

@@ -4,6 +4,7 @@
 
   class FilteredSearchDropdown {
     constructor(droplab, dropdown, input) {
+      console.log('constructor');
       this.droplab = droplab;
       this.hookId = 'filtered-search';
       this.input = input;
@@ -54,8 +55,10 @@
       // Overridden by dropdown sub class
     }
 
-    renderContent() {
-      // Overriden by dropdown sub class
+    renderContent(forceShowList = false) {
+      if (forceShowList && this.getCurrentHook().list.hidden) {
+        this.getCurrentHook().list.show();
+      }
     }
 
     setAsDropdown() {
@@ -77,7 +80,6 @@
     }
 
     dismissDropdown() {
-      this.getCurrentHook().list.hide();
       this.input.focus();
     }
 
@@ -87,31 +89,16 @@
       this.input.dispatchEvent(new Event('input'));
     }
 
-    render(forceRenderContent) {
+    render(forceRenderContent = false, forceShowList = false) {
       this.setAsDropdown();
 
-      const firstTimeInitialized = this.getCurrentHook() === undefined;
-
-      if (firstTimeInitialized || forceRenderContent) {
-        this.renderContent();
-      } else if(this.getCurrentHook().list.list.id !== this.listId) {
-        this.renderContent();
-      }
-    }
-
-    resetFilters() {
       const currentHook = this.getCurrentHook();
+      const firstTimeInitialized = currentHook === undefined;
 
-      if (currentHook) {
-        const list = currentHook.list;
-
-        if (list.data) {
-          const data = list.data.map((item) => {
-            item.droplab_hidden = false;
-          });
-
-          list.render(data);
-        }
+      if (firstTimeInitialized || forceRenderContent) {
+        this.renderContent(forceShowList);
+      } else if(currentHook.list.list.id !== this.listId) {
+        this.renderContent(forceShowList);
       }
     }
 

app/assets/javascripts/filtered_search/filtered_search_manager.js.es6

@@ -150,6 +150,7 @@
       const element = this.mapping[key].element;
       const filterIconPadding = 27;
       const dropdownOffset = gl.text.getTextWidth(this.filteredSearchInput.value, this.font) + filterIconPadding;
+      let forceShowList = false;
 
       if (!this.mapping[key].reference) {
         this.mapping[key].reference = new gl[glClass](this.droplab, element, this.filteredSearchInput);
@@ -159,8 +160,13 @@
         this.mapping[key].reference.configure();
       }
 
+      if (this.currentDropdown === 'hint') {
+        // Clicked from hint dropdown
+        forceShowList = true;
+      }
+
       this.mapping[key].reference.setOffset(dropdownOffset);
-      this.mapping[key].reference.render(firstLoad);
+      this.mapping[key].reference.render(firstLoad, forceShowList);
 
       this.currentDropdown = key;
     }
@@ -207,6 +213,12 @@
       }
     }
 
+    // dismissCurrentDropdown() {
+    //   if (this.currentDropdown === 'hint') {
+    //     this.mapping['hint'].hide();
+    //   }
+    // }
+
     bindEvents() {
       this.filteredSearchInput.addEventListener('input', this.setDropdown.bind(this));
       this.filteredSearchInput.addEventListener('input', toggleClearSearchButton);
@@ -220,8 +232,7 @@
 
       this.filteredSearchInput.value = '';
       this.clearSearchButton.classList.add('hidden');
-      dropdownHint.resetFilters();
-      this.loadDropdown('hint');
+      this.setDropdown();
     }
 
     checkForEnter(e) {

app/assets/javascripts/filtered_search/filtered_search_tokenizer.es6

@@ -3,11 +3,11 @@
   class FilteredSearchTokenizer {
     // TODO: Remove when going to pro
     static printTokens(tokens, searchToken, lastToken) {
-      // console.log('tokens:');
-      // tokens.forEach(token => console.log(token));
-      // console.log(`search: ${searchToken}`);
-      // console.log('last token:');
-      // console.log(lastToken);
+      console.log('tokens:');
+      tokens.forEach(token => console.log(token));
+      console.log(`search: ${searchToken}`);
+      console.log('last token:');
+      console.log(lastToken);
     }
 
     static parseToken(input) {