summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/groups/components/app.vue
diff options
context:
space:
mode:
authorKushal Pandya <kushal@gitlab.com>2018-01-10 12:56:03 +0530
committerKushal Pandya <kushal@gitlab.com>2018-01-11 16:35:37 +0530
commita2ae0f85127619e0e380c9cd5198508a801ab3bd (patch)
tree51f841653e46dd49599f54c3b23d9e6633e74f47 /app/assets/javascripts/groups/components/app.vue
parenta783158bbf52b3d115f9d102499719cc365de81e (diff)
downloadgitlab-ce-a2ae0f85127619e0e380c9cd5198508a801ab3bd.tar.gz
Add modal dialog for leave group action
Diffstat (limited to 'app/assets/javascripts/groups/components/app.vue')
-rw-r--r--app/assets/javascripts/groups/components/app.vue48
1 files changed, 37 insertions, 11 deletions
diff --git a/app/assets/javascripts/groups/components/app.vue b/app/assets/javascripts/groups/components/app.vue
index 400306759b2..e035ba462db 100644
--- a/app/assets/javascripts/groups/components/app.vue
+++ b/app/assets/javascripts/groups/components/app.vue
@@ -1,16 +1,20 @@
<script>
/* global Flash */
+import { s__ } from '~/locale';
+import loadingIcon from '~/vue_shared/components/loading_icon.vue';
+import modal from '~/vue_shared/components/modal.vue';
+import { getParameterByName } from '~/lib/utils/common_utils';
+import { mergeUrlParams } from '~/lib/utils/url_utility';
+
import eventHub from '../event_hub';
-import { getParameterByName } from '../../lib/utils/common_utils';
-import loadingIcon from '../../vue_shared/components/loading_icon.vue';
import { COMMON_STR } from '../constants';
-import { mergeUrlParams } from '../../lib/utils/url_utility';
import groupsComponent from './groups.vue';
export default {
components: {
loadingIcon,
+ modal,
groupsComponent,
},
props: {
@@ -32,6 +36,10 @@ export default {
isLoading: true,
isSearchEmpty: false,
searchEmptyMessage: '',
+ showModal: false,
+ groupLeaveConfirmationMessage: '',
+ targetGroup: null,
+ targetParentGroup: null,
};
},
computed: {
@@ -48,7 +56,7 @@ export default {
eventHub.$on('fetchPage', this.fetchPage);
eventHub.$on('toggleChildren', this.toggleChildren);
- eventHub.$on('leaveGroup', this.leaveGroup);
+ eventHub.$on('showLeaveGroupModal', this.showLeaveGroupModal);
eventHub.$on('updatePagination', this.updatePagination);
eventHub.$on('updateGroups', this.updateGroups);
},
@@ -58,7 +66,7 @@ export default {
beforeDestroy() {
eventHub.$off('fetchPage', this.fetchPage);
eventHub.$off('toggleChildren', this.toggleChildren);
- eventHub.$off('leaveGroup', this.leaveGroup);
+ eventHub.$off('showLeaveGroupModal', this.showLeaveGroupModal);
eventHub.$off('updatePagination', this.updatePagination);
eventHub.$off('updateGroups', this.updateGroups);
},
@@ -141,14 +149,23 @@ export default {
parentGroup.isOpen = false;
}
},
- leaveGroup(group, parentGroup) {
- const targetGroup = group;
- targetGroup.isBeingRemoved = true;
- this.service.leaveGroup(targetGroup.leavePath)
+ showLeaveGroupModal(group, parentGroup) {
+ this.targetGroup = group;
+ this.targetParentGroup = parentGroup;
+ this.showModal = true;
+ this.groupLeaveConfirmationMessage = s__(`GroupsTree|Are you sure you want to leave the "${group.fullName}" group?`);
+ },
+ hideLeaveGroupModal() {
+ this.showModal = false;
+ },
+ leaveGroup() {
+ this.showModal = false;
+ this.targetGroup.isBeingRemoved = true;
+ this.service.leaveGroup(this.targetGroup.leavePath)
.then(res => res.json())
.then((res) => {
$.scrollTo(0);
- this.store.removeGroup(targetGroup, parentGroup);
+ this.store.removeGroup(this.targetGroup, this.targetParentGroup);
Flash(res.notice, 'notice');
})
.catch((err) => {
@@ -157,7 +174,7 @@ export default {
message = COMMON_STR.LEAVE_FORBIDDEN;
}
Flash(message);
- targetGroup.isBeingRemoved = false;
+ this.targetGroup.isBeingRemoved = false;
});
},
updatePagination(headers) {
@@ -190,5 +207,14 @@ export default {
:search-empty-message="searchEmptyMessage"
:page-info="pageInfo"
/>
+ <modal
+ v-show="showModal"
+ :primary-button-label="__('Leave')"
+ kind="warning"
+ :title="__('Are you sure?')"
+ :text="groupLeaveConfirmationMessage"
+ @cancel="hideLeaveGroupModal"
+ @submit="leaveGroup"
+ />
</div>
</template>