diff options
Diffstat (limited to 'app/assets/javascripts/protected_tags/protected_tag_create.js')
-rw-r--r-- | app/assets/javascripts/protected_tags/protected_tag_create.js | 71 |
1 files changed, 26 insertions, 45 deletions
diff --git a/app/assets/javascripts/protected_tags/protected_tag_create.js b/app/assets/javascripts/protected_tags/protected_tag_create.js index 365b9a3b142..b5661af352c 100644 --- a/app/assets/javascripts/protected_tags/protected_tag_create.js +++ b/app/assets/javascripts/protected_tags/protected_tag_create.js @@ -3,8 +3,8 @@ import CreateItemDropdown from '~/create_item_dropdown'; import { createAlert } from '~/alert'; import axios from '~/lib/utils/axios_utils'; import { s__, __ } from '~/locale'; -import AccessDropdown from '~/projects/settings/access_dropdown'; -import { ACCESS_LEVELS, LEVEL_TYPES } from './constants'; +import { initAccessDropdown } from '~/projects/settings/init_access_dropdown'; +import { ACCESS_LEVELS } from './constants'; export default class ProtectedTagCreate { constructor({ hasLicense }) { @@ -12,6 +12,7 @@ export default class ProtectedTagCreate { this.$form = $('.js-new-protected-tag'); this.buildDropdowns(); this.bindEvents(); + this.selectedItems = []; } bindEvents() { @@ -19,20 +20,9 @@ export default class ProtectedTagCreate { } buildDropdowns() { - const $allowedToCreateDropdown = this.$form.find('.js-allowed-to-create'); - // Cache callback this.onSelectCallback = this.onSelect.bind(this); - // Allowed to Create dropdown - this.protectedTagAccessDropdown = new AccessDropdown({ - $dropdown: $allowedToCreateDropdown, - accessLevelsData: gon.create_access_levels, - onSelect: this.onSelectCallback, - accessLevel: ACCESS_LEVELS.CREATE, - hasLicense: this.hasLicense, - }); - // Protected tag dropdown this.createItemDropdown = new CreateItemDropdown({ $dropdown: this.$form.find('.js-protected-tag-select'), @@ -41,17 +31,36 @@ export default class ProtectedTagCreate { onSelect: this.onSelectCallback, getData: ProtectedTagCreate.getProtectedTags, }); + + // Allowed to Create dropdown + const createTagSelector = 'js-allowed-to-create'; + const [dropdownEl] = this.$form.find(`.${createTagSelector}`); + this.protectedTagAccessDropdown = initAccessDropdown(dropdownEl, { + toggleClass: createTagSelector, + hasLicense: this.hasLicense, + accessLevel: ACCESS_LEVELS.CREATE, + accessLevelsData: gon.create_access_levels, + searchEnabled: dropdownEl.dataset.filter !== undefined, + testId: 'allowed_to_create_dropdown', + }); + + this.protectedTagAccessDropdown.$on('select', (selected) => { + this.selectedItems = selected; + this.onSelectCallback(); + }); + + this.protectedTagAccessDropdown.$on('shown', () => { + this.createItemDropdown.close(); + }); } // This will run after clicked callback onSelect() { // Enable submit button const $tagInput = this.$form.find('input[name="protected_tag[name]"]'); - const $allowedToCreateInput = this.protectedTagAccessDropdown.getSelectedItems(); - this.$form .find('button[type="submit"]') - .prop('disabled', !($tagInput.val() && $allowedToCreateInput.length)); + .prop('disabled', !($tagInput.val() && this.selectedItems.length)); } static getProtectedTags(term, callback) { @@ -65,35 +74,7 @@ export default class ProtectedTagCreate { name: this.$form.find('input[name="protected_tag[name]"]').val(), }, }; - - Object.keys(ACCESS_LEVELS).forEach((level) => { - const accessLevel = ACCESS_LEVELS[level]; - const selectedItems = this.protectedTagAccessDropdown.getSelectedItems(); - const levelAttributes = []; - - selectedItems.forEach((item) => { - if (item.type === LEVEL_TYPES.USER) { - levelAttributes.push({ - user_id: item.user_id, - }); - } else if (item.type === LEVEL_TYPES.ROLE) { - levelAttributes.push({ - access_level: item.access_level, - }); - } else if (item.type === LEVEL_TYPES.GROUP) { - levelAttributes.push({ - group_id: item.group_id, - }); - } else if (item.type === LEVEL_TYPES.DEPLOY_KEY) { - levelAttributes.push({ - deploy_key_id: item.deploy_key_id, - }); - } - }); - - formData.protected_tag[`${accessLevel}_attributes`] = levelAttributes; - }); - + formData.protected_tag[`${ACCESS_LEVELS.CREATE}_attributes`] = this.selectedItems; return formData; } |