Fixed bug with hint not showing when in middle of text

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

@@ -9,7 +9,7 @@
       this.config = {
         droplabFilter: {
           template: 'hint',
-          filterFunction: gl.DropdownUtils.filterHint,
+          filterFunction: gl.DropdownUtils.filterHint.bind(null, input),
         },
       };
     }

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

@@ -37,7 +37,7 @@
     }
     getSearchInput() {
-      const query = gl.DropdownUtils.getSearchInput(this.input).trim();
+      const query = gl.DropdownUtils.getSearchInput(this.input);
       const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
       return lastToken.value || '';

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

@@ -22,7 +22,7 @@
     static filterWithSymbol(filterSymbol, input, item) {
       const updatedItem = item;
-      const query = gl.DropdownUtils.getSearchInput(input).trim();
+      const query = gl.DropdownUtils.getSearchInput(input);
       const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(query);
       if (lastToken !== searchToken) {
@@ -45,8 +45,9 @@
       return updatedItem;
     }
-    static filterHint(item, query) {
+    static filterHint(input, item) {
       const updatedItem = item;
+      const query = gl.DropdownUtils.getSearchInput(input);
       let { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
       lastToken = lastToken.key || lastToken || '';
@@ -79,32 +80,34 @@
       const inputValue = filteredSearchInput.value;
       const { right } = gl.DropdownUtils.getInputSelectionPosition(filteredSearchInput);
-      if (right < 0) {
-        return inputValue;
-      }
-
-      return inputValue.slice(0, right + 1).trim();
+      return inputValue.slice(0, right);
     }
     static getInputSelectionPosition(input) {
+      const selectionStart = input.selectionStart;
       let inputValue = input.value;
       // Replace all spaces inside quote marks with underscores
       // This helps with matching the beginning & end of a token:key
       inputValue = inputValue.replace(/"(.*?)"/g, str => str.replace(/\s/g, '_') );
-      const selectionStart = input.selectionStart;
+      // Get the right position for the word selected
       let right = inputValue.slice(selectionStart).search(/\s/);
       if (right >= 0) {
         right += selectionStart;
+      } else if (right < 0) {
+        right = inputValue.length;
       }
-      let left = inputValue.slice(0, selectionStart + 1).search(/\S+$/);
+      // Get the left position for the word selected
+      let left = inputValue.slice(0, right).search(/\S+$/);
       if (selectionStart === 0) {
         left = 0;
       } else if (selectionStart === inputValue.length && left < 0) {
         left = inputValue.length;
+      } else if (left < 0) {
+        left = selectionStart;
       }
       return {

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

@@ -62,12 +62,7 @@
       // Get the string to replace
       const selectionStart = input.selectionStart;
-      const { left } = gl.DropdownUtils.getInputSelectionPosition(input);
-      let { right } = gl.DropdownUtils.getInputSelectionPosition(input);
-
-      if (right < 0) {
-        right = inputValue.length;
-      }
+      const { left, right } = gl.DropdownUtils.getInputSelectionPosition(input);
       input.value = `${inputValue.substr(0, left)}${word}${inputValue.substr(right)}`;
       gl.FilteredSearchDropdownManager.updateInputCaretPosition(selectionStart, input);
@@ -79,11 +74,7 @@
       input.setSelectionRange(selectionStart, selectionStart);
       const inputValue = input.value;
-      let { right } = gl.DropdownUtils.getInputSelectionPosition(input);
-
-      if (right < 0) {
-        right = inputValue.length;
-      }
+      const { right } = gl.DropdownUtils.getInputSelectionPosition(input);
       input.setSelectionRange(right, right);
     }