diff options
Diffstat (limited to 'app/assets/javascripts/admin/users')
11 files changed, 101 insertions, 89 deletions
diff --git a/app/assets/javascripts/admin/users/components/actions/activate.vue b/app/assets/javascripts/admin/users/components/actions/activate.vue index 74e9c60a57b..3a54035c587 100644 --- a/app/assets/javascripts/admin/users/components/actions/activate.vue +++ b/app/assets/javascripts/admin/users/components/actions/activate.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -26,16 +27,15 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Activate user %{username}?'), { username: this.username, }), - messageHtml, actionCancel: { text: __('Cancel'), }, @@ -43,15 +43,16 @@ export default { text: I18N_USER_ACTIONS.activate, attributes: [{ variant: 'confirm' }], }, - }), - }; + messageHtml, + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/approve.vue b/app/assets/javascripts/admin/users/components/actions/approve.vue index 77a9be8eec2..5a8c675822d 100644 --- a/app/assets/javascripts/admin/users/components/actions/approve.vue +++ b/app/assets/javascripts/admin/users/components/actions/approve.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -28,12 +29,12 @@ export default { required: true, }, }, - computed: { - attributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Approve user %{username}?'), { username: this.username, }), @@ -45,16 +46,15 @@ export default { attributes: [{ variant: 'confirm', 'data-qa-selector': 'approve_user_confirm_button' }], }, messageHtml, - }), - 'data-qa-selector': 'approve_user_button', - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...attributes }"> + <gl-dropdown-item data-qa-selector="approve_user_button" @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/ban.vue b/app/assets/javascripts/admin/users/components/actions/ban.vue index e5ab0f9123f..55938832dce 100644 --- a/app/assets/javascripts/admin/users/components/actions/ban.vue +++ b/app/assets/javascripts/admin/users/components/actions/ban.vue @@ -2,6 +2,7 @@ import { GlDropdownItem } from '@gitlab/ui'; import { helpPagePath } from '~/helpers/help_page_helper'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -39,12 +40,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Ban user %{username}?'), { username: this.username, }), @@ -56,15 +57,15 @@ export default { attributes: [{ variant: 'confirm' }], }, messageHtml, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/block.vue b/app/assets/javascripts/admin/users/components/actions/block.vue index 03557008a89..d25dd400f9b 100644 --- a/app/assets/javascripts/admin/users/components/actions/block.vue +++ b/app/assets/javascripts/admin/users/components/actions/block.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -29,12 +30,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Block user %{username}?'), { username: this.username }), actionCancel: { text: __('Cancel'), @@ -44,15 +45,15 @@ export default { attributes: [{ variant: 'confirm' }], }, messageHtml, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/deactivate.vue b/app/assets/javascripts/admin/users/components/actions/deactivate.vue index 640c8fefc20..c85f3f01675 100644 --- a/app/assets/javascripts/admin/users/components/actions/deactivate.vue +++ b/app/assets/javascripts/admin/users/components/actions/deactivate.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -36,12 +37,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Deactivate user %{username}?'), { username: this.username, }), @@ -53,15 +54,15 @@ export default { attributes: [{ variant: 'confirm' }], }, messageHtml, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/reject.vue b/app/assets/javascripts/admin/users/components/actions/reject.vue index 901306455fa..bac08de1d5e 100644 --- a/app/assets/javascripts/admin/users/components/actions/reject.vue +++ b/app/assets/javascripts/admin/users/components/actions/reject.vue @@ -2,6 +2,7 @@ import { GlDropdownItem } from '@gitlab/ui'; import { helpPagePath } from '~/helpers/help_page_helper'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -39,12 +40,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'delete', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'delete', + modalAttributes: { title: sprintf(s__('AdminUsers|Reject user %{username}?'), { username: this.username, }), @@ -56,15 +57,15 @@ export default { attributes: [{ variant: 'danger' }], }, messageHtml, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/unban.vue b/app/assets/javascripts/admin/users/components/actions/unban.vue index 8083e26177e..beede2d37d7 100644 --- a/app/assets/javascripts/admin/users/components/actions/unban.vue +++ b/app/assets/javascripts/admin/users/components/actions/unban.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922 @@ -22,12 +23,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Unban user %{username}?'), { username: this.username, }), @@ -39,15 +40,15 @@ export default { attributes: [{ variant: 'confirm' }], }, messageHtml, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/unblock.vue b/app/assets/javascripts/admin/users/components/actions/unblock.vue index 7de6653e0cd..720f2efd932 100644 --- a/app/assets/javascripts/admin/users/components/actions/unblock.vue +++ b/app/assets/javascripts/admin/users/components/actions/unblock.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; export default { @@ -17,12 +18,13 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Unblock user %{username}?'), { username: this.username }), message: s__('AdminUsers|You can always block their account again if needed.'), actionCancel: { @@ -32,15 +34,15 @@ export default { text: I18N_USER_ACTIONS.unblock, attributes: [{ variant: 'confirm' }], }, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/actions/unlock.vue b/app/assets/javascripts/admin/users/components/actions/unlock.vue index 10d4fb06d61..55ea3e0aba7 100644 --- a/app/assets/javascripts/admin/users/components/actions/unlock.vue +++ b/app/assets/javascripts/admin/users/components/actions/unlock.vue @@ -1,6 +1,7 @@ <script> import { GlDropdownItem } from '@gitlab/ui'; import { sprintf, s__, __ } from '~/locale'; +import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub'; import { I18N_USER_ACTIONS } from '../../constants'; export default { @@ -17,12 +18,12 @@ export default { required: true, }, }, - computed: { - modalAttributes() { - return { - 'data-path': this.path, - 'data-method': 'put', - 'data-modal-attributes': JSON.stringify({ + methods: { + onClick() { + eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, { + path: this.path, + method: 'put', + modalAttributes: { title: sprintf(s__('AdminUsers|Unlock user %{username}?'), { username: this.username }), message: __('Are you sure?'), actionCancel: { @@ -32,15 +33,15 @@ export default { text: I18N_USER_ACTIONS.unlock, attributes: [{ variant: 'confirm' }], }, - }), - }; + }, + }); }, }, }; </script> <template> - <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }"> + <gl-dropdown-item @click="onClick"> <slot></slot> </gl-dropdown-item> </template> diff --git a/app/assets/javascripts/admin/users/components/modals/delete_user_modal.vue b/app/assets/javascripts/admin/users/components/modals/delete_user_modal.vue index e949498c55b..d7c08096376 100644 --- a/app/assets/javascripts/admin/users/components/modals/delete_user_modal.vue +++ b/app/assets/javascripts/admin/users/components/modals/delete_user_modal.vue @@ -57,14 +57,17 @@ export default { }; }, computed: { + trimmedUsername() { + return this.username.trim(); + }, modalTitle() { - return sprintf(this.title, { username: this.username }, false); + return sprintf(this.title, { username: this.trimmedUsername }, false); }, secondaryButtonLabel() { return s__('AdminUsers|Block user'); }, canSubmit() { - return this.enteredUsername === this.username; + return this.enteredUsername === this.trimmedUsername; }, obstacles() { try { @@ -104,7 +107,7 @@ export default { <p> <gl-sprintf :message="content"> <template #username> - <strong>{{ username }}</strong> + <strong>{{ trimmedUsername }}</strong> </template> <template #strong="props"> <strong>{{ props.content }}</strong> @@ -115,13 +118,13 @@ export default { <user-deletion-obstacles-list v-if="obstacles.length" :obstacles="obstacles" - :user-name="username" + :user-name="trimmedUsername" /> <p> <gl-sprintf :message="s__('AdminUsers|To confirm, type %{username}')"> <template #username> - <code class="gl-white-space-pre-wrap">{{ username }}</code> + <code class="gl-white-space-pre-wrap">{{ trimmedUsername }}</code> </template> </gl-sprintf> </p> diff --git a/app/assets/javascripts/admin/users/components/user_actions.vue b/app/assets/javascripts/admin/users/components/user_actions.vue index 4f4e2947341..567d7151847 100644 --- a/app/assets/javascripts/admin/users/components/user_actions.vue +++ b/app/assets/javascripts/admin/users/components/user_actions.vue @@ -112,7 +112,7 @@ export default { right :text="$options.i18n.userAdministration" :text-sr-only="!showButtonLabels" - icon="settings" + icon="ellipsis_h" data-qa-selector="user_actions_dropdown_toggle" :data-qa-username="user.username" > |