diff options
Diffstat (limited to 'app')
6 files changed, 33 insertions, 33 deletions
diff --git a/app/assets/javascripts/filtered_search/dropdown_hint.js.es6 b/app/assets/javascripts/filtered_search/dropdown_hint.js.es6 index c5ab9c52d76..f1e317d91cc 100644 --- a/app/assets/javascripts/filtered_search/dropdown_hint.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_hint.js.es6 @@ -4,8 +4,8 @@ (() => { class DropdownHint extends gl.FilteredSearchDropdown { - constructor(droplab, dropdown, input) { - super(droplab, dropdown, input); + constructor(droplab, dropdown, input, filter) { + super(droplab, dropdown, input, filter); this.config = { droplabFilter: { template: 'hint', @@ -25,7 +25,7 @@ const tag = selected.querySelector('.js-filter-tag').innerText.trim(); if (tag.length) { - gl.FilteredSearchDropdownManager.addWordToInput(token); + gl.FilteredSearchDropdownManager.addWordToInput(token.replace(':', '')); } this.dismissDropdown(); this.dispatchInputEvent(); diff --git a/app/assets/javascripts/filtered_search/dropdown_non_user.js.es6 b/app/assets/javascripts/filtered_search/dropdown_non_user.js.es6 index 54090375c5c..f06c3fc9c6f 100644 --- a/app/assets/javascripts/filtered_search/dropdown_non_user.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_non_user.js.es6 @@ -5,8 +5,8 @@ (() => { class DropdownNonUser extends gl.FilteredSearchDropdown { - constructor(droplab, dropdown, input, endpoint, symbol) { - super(droplab, dropdown, input); + constructor(droplab, dropdown, input, filter, endpoint, symbol) { + super(droplab, dropdown, input, filter); this.symbol = symbol; this.config = { droplabAjax: { diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js.es6 b/app/assets/javascripts/filtered_search/dropdown_user.js.es6 index 49581e3bfbd..e80d266ae89 100644 --- a/app/assets/javascripts/filtered_search/dropdown_user.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_user.js.es6 @@ -4,8 +4,8 @@ (() => { class DropdownUser extends gl.FilteredSearchDropdown { - constructor(droplab, dropdown, input) { - super(droplab, dropdown, input); + constructor(droplab, dropdown, input, filter) { + super(droplab, dropdown, input, filter); this.config = { droplabAjaxFilter: { endpoint: '/autocomplete/users.json', diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 index 3453311bee5..88b172d6fc4 100644 --- a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 +++ b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 @@ -58,11 +58,11 @@ return updatedItem; } - static setDataValueIfSelected(selected) { + static setDataValueIfSelected(filter, selected) { const dataValue = selected.getAttribute('data-value'); if (dataValue) { - gl.FilteredSearchDropdownManager.addWordToInput(dataValue); + gl.FilteredSearchDropdownManager.addWordToInput(filter, dataValue); } // Return boolean based on whether it was set diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown.js.es6 b/app/assets/javascripts/filtered_search/filtered_search_dropdown.js.es6 index 56147ad93c9..886d8113f4a 100644 --- a/app/assets/javascripts/filtered_search/filtered_search_dropdown.js.es6 +++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown.js.es6 @@ -2,10 +2,11 @@ const DATA_DROPDOWN_TRIGGER = 'data-dropdown-trigger'; class FilteredSearchDropdown { - constructor(droplab, dropdown, input) { + constructor(droplab, dropdown, input, filter) { this.droplab = droplab; this.hookId = input.getAttribute('data-id'); this.input = input; + this.filter = filter; this.dropdown = dropdown; this.loadingTemplate = `<div class="filter-dropdown-loading"> <i class="fa fa-spinner fa-spin"></i> @@ -30,11 +31,11 @@ const { selected } = e.detail; if (selected.tagName === 'LI' && selected.innerHTML) { - const dataValueSet = gl.DropdownUtils.setDataValueIfSelected(selected); + const dataValueSet = gl.DropdownUtils.setDataValueIfSelected(this.filter, selected); if (!dataValueSet) { const value = getValueFunction(selected); - gl.FilteredSearchDropdownManager.addWordToInput(value); + gl.FilteredSearchDropdownManager.addWordToInput(this.filter, value); } this.dismissDropdown(); diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 index e9f1fbf63ed..8b385d6b642 100644 --- a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 +++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 @@ -55,31 +55,30 @@ }; } - static addWordToInput(word, addSpace = false) { + static addWordToInput(tokenName, tokenValue = '') { const input = document.querySelector('.filtered-search'); - input.value = input.value.trim(); + const word = `${tokenName}:${tokenValue}`; - const value = input.value; - const hasExistingValue = value.length !== 0; - const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(value); + const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(input.value); const lastSearchToken = searchToken.split(' ').last(); - - // Find out what part of the token value the user has typed - // and remove it from input before appending the selected token value - if (lastToken !== searchToken) { - const lastTokenString = `${lastToken.symbol}${lastToken.value}`; - - // Spaces inside the token means that the token value will be escaped by quotes - const hasQuotes = lastTokenString.indexOf(' ') !== -1; - - // Add 2 length to account for the length of the front and back quotes - const lengthToRemove = hasQuotes ? lastTokenString.length + 2 : lastTokenString.length; - input.value = value.slice(0, -1 * (lengthToRemove)); - } else if (searchToken !== '' && word.indexOf(lastSearchToken) !== -1) { - input.value = value.slice(0, -1 * lastSearchToken.length); + const lastInputCharacter = input.value[input.value.length - 1]; + const lastInputTrimmedCharacter = input.value.trim()[input.value.trim().length - 1]; + + // Remove the typed tokenName + if (word.indexOf(lastSearchToken) === 0 && searchToken !== '') { + // Remove spaces after the colon + if (lastInputCharacter === ' ' && lastInputTrimmedCharacter === ':') { + input.value = input.value.trim(); + } + + input.value = input.value.slice(0, -1 * lastSearchToken.length); + } else if (lastInputCharacter !== ' ') { + // Remove the existing tokenValue + const lastTokenString = `${lastToken.key}:${lastToken.symbol}${lastToken.value}`; + input.value = input.value.slice(0, -1 * lastTokenString.length); } - input.value += hasExistingValue && addSpace ? ` ${word}` : word; + input.value += word; } updateCurrentDropdownOffset() { @@ -106,7 +105,7 @@ if (!mappingKey.reference) { const dl = this.droplab; - const defaultArguments = [null, dl, element, this.filteredSearchInput]; + const defaultArguments = [null, dl, element, this.filteredSearchInput, key]; const glArguments = defaultArguments.concat(mappingKey.extraArguments || []); // Passing glArguments to `new gl[glClass](<arguments>)` |