diff options
Diffstat (limited to 'app/assets/javascripts/members/components/action_buttons')
-rw-r--r-- | app/assets/javascripts/members/components/action_buttons/remove_member_button.vue | 35 |
1 files changed, 20 insertions, 15 deletions
diff --git a/app/assets/javascripts/members/components/action_buttons/remove_member_button.vue b/app/assets/javascripts/members/components/action_buttons/remove_member_button.vue index a477aedd233..665e8ee69f7 100644 --- a/app/assets/javascripts/members/components/action_buttons/remove_member_button.vue +++ b/app/assets/javascripts/members/components/action_buttons/remove_member_button.vue @@ -1,6 +1,6 @@ <script> import { GlButton, GlTooltipDirective } from '@gitlab/ui'; -import { mapState } from 'vuex'; +import { mapActions, mapState } from 'vuex'; export default { name: 'RemoveMemberButton', @@ -45,7 +45,7 @@ export default { oncallSchedules: { type: Object, required: false, - default: () => {}, + default: () => ({}), }, }, computed: { @@ -54,30 +54,35 @@ export default { return state[this.namespace].memberPath; }, }), - computedMemberPath() { - return this.memberPath.replace(':id', this.memberId); - }, - stringifiedSchedules() { - return JSON.stringify(this.oncallSchedules); + modalData() { + return { + isAccessRequest: this.isAccessRequest, + isInvite: this.isInvite, + memberPath: this.memberPath.replace(':id', this.memberId), + memberType: this.memberType, + message: this.message, + oncallSchedules: this.oncallSchedules, + }; }, }, + methods: { + ...mapActions({ + showRemoveMemberModal(dispatch, payload) { + return dispatch(`${this.namespace}/showRemoveMemberModal`, payload); + }, + }), + }, }; </script> <template> <gl-button - v-gl-tooltip.hover - class="js-remove-member-button" + v-gl-tooltip variant="danger" :title="title" :aria-label="title" :icon="icon" - :data-member-path="computedMemberPath" - :data-member-type="memberType" - :data-is-access-request="isAccessRequest" - :data-is-invite="isInvite" - :data-message="message" - :data-oncall-schedules="stringifiedSchedules" data-qa-selector="delete_member_button" + @click="showRemoveMemberModal(modalData)" /> </template> |