diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-20 18:10:29 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-20 18:10:29 +0300 |
commit | ef8c47e97e1c178291e4857314a3f53875d75062 (patch) | |
tree | 89ef0c1cd34e864aad1346a0ee07bccb81a9ac65 /app/assets/javascripts/projects | |
parent | f2ebc27236ecef67e67da1da864bbf58e9b9c267 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/projects')
5 files changed, 66 insertions, 117 deletions
diff --git a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue index 909f1afd9f6..43fe54d6e38 100644 --- a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue +++ b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue @@ -2,60 +2,42 @@ import { GlAlert } from '@gitlab/ui'; import { __, sprintf } from '~/locale'; import ServiceDeskSetting from './service_desk_setting.vue'; -import ServiceDeskService from '../services/service_desk_service'; -import eventHub from '../event_hub'; +import axios from '~/lib/utils/axios_utils'; export default { - name: 'ServiceDeskRoot', components: { GlAlert, ServiceDeskSetting, }, - props: { + inject: { initialIsEnabled: { - type: Boolean, - required: true, + default: false, }, endpoint: { - type: String, - required: true, + default: '', }, - incomingEmail: { - type: String, - required: false, + initialIncomingEmail: { default: '', }, customEmail: { - type: String, - required: false, default: '', }, customEmailEnabled: { - type: Boolean, - required: false, + default: false, }, selectedTemplate: { - type: String, - required: false, default: '', }, outgoingName: { - type: String, - required: false, default: '', }, projectKey: { - type: String, - required: false, default: '', }, templates: { - type: Array, - required: false, - default: () => [], + default: [], }, }, - data() { return { isEnabled: this.initialIsEnabled, @@ -63,28 +45,21 @@ export default { isAlertShowing: false, alertVariant: 'danger', alertMessage: '', + incomingEmail: this.initialIncomingEmail, updatedCustomEmail: this.customEmail, }; }, - - created() { - eventHub.$on('serviceDeskEnabledCheckboxToggled', this.onEnableToggled); - eventHub.$on('serviceDeskTemplateSave', this.onSaveTemplate); - this.service = new ServiceDeskService(this.endpoint); - }, - - beforeDestroy() { - eventHub.$off('serviceDeskEnabledCheckboxToggled', this.onEnableToggled); - eventHub.$off('serviceDeskTemplateSave', this.onSaveTemplate); - }, - methods: { onEnableToggled(isChecked) { this.isEnabled = isChecked; this.incomingEmail = ''; - this.service - .toggleServiceDesk(isChecked) + const body = { + service_desk_enabled: isChecked, + }; + + return axios + .put(this.endpoint, body) .then(({ data }) => { const email = data.service_desk_address; if (isChecked && !email) { @@ -104,8 +79,16 @@ export default { onSaveTemplate({ selectedTemplate, outgoingName, projectKey }) { this.isTemplateSaving = true; - this.service - .updateTemplate({ selectedTemplate, outgoingName, projectKey }, this.isEnabled) + + const body = { + issue_template_key: selectedTemplate, + outgoing_name: outgoingName, + project_key: projectKey, + service_desk_enabled: this.isEnabled, + }; + + return axios + .put(this.endpoint, body) .then(({ data }) => { this.updatedCustomEmail = data?.service_desk_address; this.showAlert(__('Changes saved.'), 'success'); @@ -150,6 +133,8 @@ export default { :initial-project-key="projectKey" :templates="templates" :is-template-saving="isTemplateSaving" + @save="onSaveTemplate" + @toggle="onEnableToggled" /> </div> </template> diff --git a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue index a850374fc88..39d9a6a4239 100644 --- a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue +++ b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue @@ -1,12 +1,9 @@ <script> import { GlButton, GlFormSelect, GlToggle, GlLoadingIcon, GlSprintf } from '@gitlab/ui'; import { __ } from '~/locale'; -import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; -import eventHub from '../event_hub'; export default { - name: 'ServiceDeskSetting', components: { ClipboardButton, GlButton, @@ -15,7 +12,6 @@ export default { GlLoadingIcon, GlSprintf, }, - mixins: [glFeatureFlagsMixin()], props: { isEnabled: { type: Boolean, @@ -84,10 +80,10 @@ export default { }, methods: { onCheckboxToggle(isChecked) { - eventHub.$emit('serviceDeskEnabledCheckboxToggled', isChecked); + this.$emit('toggle', isChecked); }, onSaveTemplate() { - eventHub.$emit('serviceDeskTemplateSave', { + this.$emit('save', { selectedTemplate: this.selectedTemplate, outgoingName: this.outgoingName, projectKey: this.projectKey, @@ -111,7 +107,11 @@ export default { </label> <div v-if="isEnabled" class="row mt-3"> <div class="col-md-9 mb-0"> - <strong id="incoming-email-describer" class="d-block mb-1"> + <strong + id="incoming-email-describer" + class="gl-display-block gl-mb-1" + data-testid="incoming-email-describer" + > {{ __('Email address to use for Support Desk') }} </strong> <template v-if="email"> @@ -128,11 +128,7 @@ export default { disabled="true" /> <div class="input-group-append"> - <clipboard-button - :title="__('Copy')" - :text="email" - css-class="input-group-text qa-clipboard-button" - /> + <clipboard-button :title="__('Copy')" :text="email" css-class="input-group-text" /> </div> </div> <span v-if="hasCustomEmail" class="form-text text-muted"> diff --git a/app/assets/javascripts/projects/settings_service_desk/event_hub.js b/app/assets/javascripts/projects/settings_service_desk/event_hub.js deleted file mode 100644 index e31806ad199..00000000000 --- a/app/assets/javascripts/projects/settings_service_desk/event_hub.js +++ /dev/null @@ -1,3 +0,0 @@ -import createEventHub from '~/helpers/event_hub_factory'; - -export default createEventHub(); diff --git a/app/assets/javascripts/projects/settings_service_desk/index.js b/app/assets/javascripts/projects/settings_service_desk/index.js index 8f9828dd73d..f842ffaaa2b 100644 --- a/app/assets/javascripts/projects/settings_service_desk/index.js +++ b/app/assets/javascripts/projects/settings_service_desk/index.js @@ -3,43 +3,37 @@ import { parseBoolean } from '~/lib/utils/common_utils'; import ServiceDeskRoot from './components/service_desk_root.vue'; export default () => { - const serviceDeskRootElement = document.querySelector('.js-service-desk-setting-root'); - if (serviceDeskRootElement) { - // eslint-disable-next-line no-new - new Vue({ - el: serviceDeskRootElement, - components: { - ServiceDeskRoot, - }, - data() { - const { dataset } = serviceDeskRootElement; - return { - initialIsEnabled: parseBoolean(dataset.enabled), - endpoint: dataset.endpoint, - incomingEmail: dataset.incomingEmail, - customEmail: dataset.customEmail, - customEmailEnabled: parseBoolean(dataset.customEmailEnabled), - selectedTemplate: dataset.selectedTemplate, - outgoingName: dataset.outgoingName, - projectKey: dataset.projectKey, - templates: JSON.parse(dataset.templates), - }; - }, - render(createElement) { - return createElement('service-desk-root', { - props: { - initialIsEnabled: this.initialIsEnabled, - endpoint: this.endpoint, - incomingEmail: this.incomingEmail, - customEmail: this.customEmail, - customEmailEnabled: this.customEmailEnabled, - selectedTemplate: this.selectedTemplate, - outgoingName: this.outgoingName, - projectKey: this.projectKey, - templates: this.templates, - }, - }); - }, - }); + const el = document.querySelector('.js-service-desk-setting-root'); + + if (!el) { + return false; } + + const { + customEmail, + customEmailEnabled, + enabled, + endpoint, + incomingEmail, + outgoingName, + projectKey, + selectedTemplate, + templates, + } = el.dataset; + + return new Vue({ + el, + provide: { + customEmail, + customEmailEnabled: parseBoolean(customEmailEnabled), + endpoint, + initialIncomingEmail: incomingEmail, + initialIsEnabled: parseBoolean(enabled), + outgoingName, + projectKey, + selectedTemplate, + templates: JSON.parse(templates), + }, + render: (createElement) => createElement(ServiceDeskRoot), + }); }; diff --git a/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js b/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js deleted file mode 100644 index b68c5bb876f..00000000000 --- a/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js +++ /dev/null @@ -1,23 +0,0 @@ -import axios from '~/lib/utils/axios_utils'; - -class ServiceDeskService { - constructor(endpoint) { - this.endpoint = endpoint; - } - - toggleServiceDesk(enable) { - return axios.put(this.endpoint, { service_desk_enabled: enable }); - } - - updateTemplate({ selectedTemplate, outgoingName, projectKey = '' }, isEnabled) { - const body = { - issue_template_key: selectedTemplate, - outgoing_name: outgoingName, - project_key: projectKey, - service_desk_enabled: isEnabled, - }; - return axios.put(this.endpoint, body); - } -} - -export default ServiceDeskService; |