diff options
Diffstat (limited to 'app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue')
-rw-r--r-- | app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue | 90 |
1 files changed, 0 insertions, 90 deletions
diff --git a/app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue b/app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue deleted file mode 100644 index c9002edc1ab..00000000000 --- a/app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue +++ /dev/null @@ -1,90 +0,0 @@ -<script> -import { GlDropdown, GlDropdownItem, GlDropdownDivider, GlSearchBoxByType } from '@gitlab/ui'; -import { __, sprintf } from '~/locale'; -import { convertEnvironmentScope } from '../utils'; - -export default { - name: 'CiEnvironmentsDropdown', - components: { - GlDropdown, - GlDropdownItem, - GlDropdownDivider, - GlSearchBoxByType, - }, - props: { - environments: { - type: Array, - required: true, - }, - selectedEnvironmentScope: { - type: String, - required: false, - default: '', - }, - }, - data() { - return { - searchTerm: '', - }; - }, - computed: { - composedCreateButtonLabel() { - return sprintf(__('Create wildcard: %{searchTerm}'), { searchTerm: this.searchTerm }); - }, - filteredEnvironments() { - const lowerCasedSearchTerm = this.searchTerm.toLowerCase(); - return this.environments.filter((environment) => { - return environment.toLowerCase().includes(lowerCasedSearchTerm); - }); - }, - shouldRenderCreateButton() { - return this.searchTerm && !this.environments.includes(this.searchTerm); - }, - environmentScopeLabel() { - return convertEnvironmentScope(this.selectedEnvironmentScope); - }, - }, - methods: { - selectEnvironment(selected) { - this.$emit('select-environment', selected); - this.clearSearch(); - }, - convertEnvironmentScopeValue(scope) { - return convertEnvironmentScope(scope); - }, - createEnvironmentScope() { - this.$emit('create-environment-scope', this.searchTerm); - this.selectEnvironment(this.searchTerm); - }, - isSelected(env) { - return this.selectedEnvironmentScope === env; - }, - clearSearch() { - this.searchTerm = ''; - }, - }, -}; -</script> -<template> - <gl-dropdown :text="environmentScopeLabel" @show="clearSearch"> - <gl-search-box-by-type v-model.trim="searchTerm" data-testid="ci-environment-search" /> - <gl-dropdown-item - v-for="environment in filteredEnvironments" - :key="environment" - :is-checked="isSelected(environment)" - is-check-item - @click="selectEnvironment(environment)" - > - {{ convertEnvironmentScopeValue(environment) }} - </gl-dropdown-item> - <gl-dropdown-item v-if="!filteredEnvironments.length" ref="noMatchingResults">{{ - __('No matching results') - }}</gl-dropdown-item> - <template v-if="shouldRenderCreateButton"> - <gl-dropdown-divider /> - <gl-dropdown-item data-testid="create-wildcard-button" @click="createEnvironmentScope"> - {{ composedCreateButtonLabel }} - </gl-dropdown-item> - </template> - </gl-dropdown> -</template> |