diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared')
3 files changed, 35 insertions, 7 deletions
diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/constants.js b/app/assets/javascripts/vue_shared/components/filtered_search_bar/constants.js index c698b94749d..b09e8323ba2 100644 --- a/app/assets/javascripts/vue_shared/components/filtered_search_bar/constants.js +++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/constants.js @@ -31,6 +31,8 @@ export const OPERATORS_IS_NOT = [...OPERATORS_IS, ...OPERATORS_NOT]; export const OPERATORS_IS_NOT_OR = [...OPERATORS_IS, ...OPERATORS_NOT, ...OPERATORS_OR]; export const OPERATORS_AFTER_BEFORE = [...OPERATORS_AFTER, ...OPERATORS_BEFORE]; +export const OPERATORS_TO_GROUP = [OPERATOR_OR, OPERATOR_NOT]; + export const OPTION_NONE = { value: FILTER_NONE, text: __('None'), title: __('None') }; export const OPTION_ANY = { value: FILTER_ANY, text: __('Any'), title: __('Any') }; export const OPTION_CURRENT = { value: FILTER_CURRENT, text: __('Current') }; diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/base_token.vue b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/base_token.vue index 3857dd9c55d..5d72ac34e73 100644 --- a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/base_token.vue +++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/base_token.vue @@ -11,7 +11,13 @@ import { debounce, last } from 'lodash'; import { stripQuotes } from '~/lib/utils/text_utility'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; -import { DEBOUNCE_DELAY, FILTERS_NONE_ANY, OPERATOR_NOT, OPERATOR_OR } from '../constants'; +import { + DEBOUNCE_DELAY, + FILTERS_NONE_ANY, + OPERATOR_NOT, + OPERATOR_OR, + OPERATORS_TO_GROUP, +} from '../constants'; import { getRecentlyUsedSuggestions, setTokenValueToRecentlyUsed } from '../filtered_search_utils'; export default { @@ -102,7 +108,7 @@ export default { }, activeTokenValue() { const data = - this.glFeatures.groupMultiSelectTokens && Array.isArray(this.value.data) + this.multiSelectEnabled && Array.isArray(this.value.data) ? last(this.value.data) : this.value.data; return this.getActiveTokenValue(this.suggestions, data); @@ -153,6 +159,22 @@ export default { ? this.activeTokenValue[this.searchBy] : undefined; }, + multiSelectEnabled() { + return ( + this.config.multiSelect && + this.glFeatures.groupMultiSelectTokens && + OPERATORS_TO_GROUP.includes(this.value.operator) + ); + }, + validatedConfig() { + if (this.config.multiSelect && !this.multiSelectEnabled) { + return { + ...this.config, + multiSelect: false, + }; + } + return this.config; + }, }, watch: { active: { @@ -199,7 +221,7 @@ export default { } }, DEBOUNCE_DELAY), handleTokenValueSelected(selectedValue) { - if (this.glFeatures.groupMultiSelectTokens) { + if (this.multiSelectEnabled) { this.$emit('token-selected', selectedValue); } @@ -228,7 +250,7 @@ export default { <template> <gl-filtered-search-token - :config="config" + :config="validatedConfig" :value="value" :active="active" :multi-select-values="multiSelectValues" diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/user_token.vue b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/user_token.vue index c5326ead60d..87e295d00dd 100644 --- a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/user_token.vue +++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/user_token.vue @@ -7,7 +7,7 @@ import { __ } from '~/locale'; import { WORKSPACE_GROUP, WORKSPACE_PROJECT } from '~/issues/constants'; import usersAutocompleteQuery from '~/graphql_shared/queries/users_autocomplete.query.graphql'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; -import { OPTIONS_NONE_ANY } from '../constants'; +import { OPERATORS_TO_GROUP, OPTIONS_NONE_ANY } from '../constants'; import BaseToken from './base_token.vue'; @@ -57,7 +57,11 @@ export default { return this.config.fetchUsers ? this.config.fetchUsers : this.fetchUsersBySearchTerm; }, multiSelectEnabled() { - return this.config.multiSelect && this.glFeatures.groupMultiSelectTokens; + return ( + this.config.multiSelect && + this.glFeatures.groupMultiSelectTokens && + OPERATORS_TO_GROUP.includes(this.value.operator) + ); }, }, watch: { @@ -94,7 +98,7 @@ export default { return user?.avatarUrl || user?.avatar_url; }, displayNameFor(username) { - return this.getActiveUser(this.allUsers, username)?.name || `@${username}`; + return this.getActiveUser(this.allUsers, username)?.name || username; }, avatarFor(username) { const user = this.getActiveUser(this.allUsers, username); |