diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-07-20 12:55:51 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-07-20 12:55:51 +0300 |
commit | e8d2c2579383897a1dd7f9debd359abe8ae8373d (patch) | |
tree | c42be41678c2586d49a75cabce89322082698334 /app/assets/javascripts/pages/admin/users/components | |
parent | fc845b37ec3a90aaa719975f607740c22ba6a113 (diff) |
Add latest changes from gitlab-org/gitlab@14-1-stable-eev14.1.0-rc42
Diffstat (limited to 'app/assets/javascripts/pages/admin/users/components')
-rw-r--r-- | app/assets/javascripts/pages/admin/users/components/delete_user_modal.vue | 151 | ||||
-rw-r--r-- | app/assets/javascripts/pages/admin/users/components/user_modal_manager.vue | 77 |
2 files changed, 0 insertions, 228 deletions
diff --git a/app/assets/javascripts/pages/admin/users/components/delete_user_modal.vue b/app/assets/javascripts/pages/admin/users/components/delete_user_modal.vue deleted file mode 100644 index a3b78da6ef5..00000000000 --- a/app/assets/javascripts/pages/admin/users/components/delete_user_modal.vue +++ /dev/null @@ -1,151 +0,0 @@ -<script> -import { GlModal, GlButton, GlFormInput, GlSprintf } from '@gitlab/ui'; -import * as Sentry from '@sentry/browser'; -import { s__, sprintf } from '~/locale'; -import OncallSchedulesList from '~/vue_shared/components/oncall_schedules_list.vue'; - -export default { - components: { - GlModal, - GlButton, - GlFormInput, - GlSprintf, - OncallSchedulesList, - }, - props: { - title: { - type: String, - required: true, - }, - content: { - type: String, - required: true, - }, - action: { - type: String, - required: true, - }, - secondaryAction: { - type: String, - required: true, - }, - deleteUserUrl: { - type: String, - required: true, - }, - blockUserUrl: { - type: String, - required: true, - }, - username: { - type: String, - required: true, - }, - csrfToken: { - type: String, - required: true, - }, - oncallSchedules: { - type: String, - required: false, - default: '[]', - }, - }, - data() { - return { - enteredUsername: '', - }; - }, - computed: { - modalTitle() { - return sprintf(this.title, { username: this.username }); - }, - secondaryButtonLabel() { - return s__('AdminUsers|Block user'); - }, - canSubmit() { - return this.enteredUsername === this.username; - }, - schedules() { - try { - return JSON.parse(this.oncallSchedules); - } catch (e) { - Sentry.captureException(e); - } - return []; - }, - }, - methods: { - show() { - this.$refs.modal.show(); - }, - onCancel() { - this.enteredUsername = ''; - this.$refs.modal.hide(); - }, - onSecondaryAction() { - const { form } = this.$refs; - - form.action = this.blockUserUrl; - this.$refs.method.value = 'put'; - - form.submit(); - }, - onSubmit() { - this.$refs.form.submit(); - this.enteredUsername = ''; - }, - }, -}; -</script> - -<template> - <gl-modal ref="modal" modal-id="delete-user-modal" :title="modalTitle" kind="danger"> - <p> - <gl-sprintf :message="content"> - <template #username> - <strong>{{ username }}</strong> - </template> - <template #strong="props"> - <strong>{{ props.content }}</strong> - </template> - </gl-sprintf> - </p> - - <oncall-schedules-list v-if="schedules.length" :schedules="schedules" /> - - <p> - <gl-sprintf :message="s__('AdminUsers|To confirm, type %{username}')"> - <template #username> - <code>{{ username }}</code> - </template> - </gl-sprintf> - </p> - - <form ref="form" :action="deleteUserUrl" method="post" @submit.prevent> - <input ref="method" type="hidden" name="_method" value="delete" /> - <input :value="csrfToken" type="hidden" name="authenticity_token" /> - <gl-form-input - v-model="enteredUsername" - autofocus - type="text" - name="username" - autocomplete="off" - /> - </form> - <template #modal-footer> - <gl-button @click="onCancel">{{ s__('Cancel') }}</gl-button> - <gl-button - :disabled="!canSubmit" - category="secondary" - variant="danger" - @click="onSecondaryAction" - > - {{ secondaryAction }} - </gl-button> - <gl-button :disabled="!canSubmit" category="primary" variant="danger" @click="onSubmit">{{ - action - }}</gl-button> - </template> - </gl-modal> -</template> diff --git a/app/assets/javascripts/pages/admin/users/components/user_modal_manager.vue b/app/assets/javascripts/pages/admin/users/components/user_modal_manager.vue deleted file mode 100644 index 1dfea3f1e7b..00000000000 --- a/app/assets/javascripts/pages/admin/users/components/user_modal_manager.vue +++ /dev/null @@ -1,77 +0,0 @@ -<script> -import DeleteUserModal from './delete_user_modal.vue'; - -export default { - components: { DeleteUserModal }, - props: { - modalConfiguration: { - required: true, - type: Object, - }, - csrfToken: { - required: true, - type: String, - }, - selector: { - required: true, - type: String, - }, - }, - data() { - return { - currentModalData: null, - }; - }, - computed: { - activeModal() { - return Boolean(this.currentModalData); - }, - - modalProps() { - const { glModalAction: requestedAction } = this.currentModalData; - return { - ...this.modalConfiguration[requestedAction], - ...this.currentModalData, - csrfToken: this.csrfToken, - }; - }, - }, - - mounted() { - /* - * Here we're looking for every button that needs to launch a modal - * on click, and then attaching a click event handler to show the modal - * if it's correctly configured. - * - * TODO: Replace this with integrated modal components https://gitlab.com/gitlab-org/gitlab/-/issues/320922 - */ - document.querySelectorAll(this.selector).forEach((button) => { - button.addEventListener('click', (e) => { - if (!button.dataset.glModalAction) return; - - e.preventDefault(); - this.show(button.dataset); - }); - }); - }, - - methods: { - show(modalData) { - const { glModalAction: requestedAction } = modalData; - - if (!this.modalConfiguration[requestedAction]) { - throw new Error(`Modal action ${requestedAction} has no configuration in HTML`); - } - - this.currentModalData = modalData; - - return this.$nextTick().then(() => { - this.$refs.modal.show(); - }); - }, - }, -}; -</script> -<template> - <delete-user-modal v-if="activeModal" ref="modal" v-bind="modalProps" /> -</template> |