summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/boards/components/sidebar/remove_issue.vue
blob: 55278626ffc2eae2cdf046d1747c92540f19f465 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<script>
  import Vue from 'vue';
  import Flash from '../../../flash';
  import { __ } from '../../../locale';

  const Store = gl.issueBoards.BoardsStore;

  export default {
    props: {
      issue: {
        type: Object,
        required: true,
      },
      list: {
        type: Object,
        required: true,
      },
    },
    computed: {
      updateUrl() {
        return this.issue.path;
      },
    },
    methods: {
      removeIssue() {
        const { issue } = this;
        const lists = issue.getLists();
        const listLabelIds = lists.map(list => list.label.id);

        let labelIds = issue.labels.map(label => label.id).filter(id => !listLabelIds.includes(id));
        if (labelIds.length === 0) {
          labelIds = [''];
        }

        const data = {
          issue: {
            label_ids: labelIds,
          },
        };

        // Post the remove data
        Vue.http.patch(this.updateUrl, data).catch(() => {
          Flash(__('Failed to remove issue from board, please try again.'));

          lists.forEach(list => {
            list.addIssue(issue);
          });
        });

        // Remove from the frontend store
        lists.forEach(list => {
          list.removeIssue(issue);
        });

        Store.detail.issue = {};
      },
    },
  };
</script>
<template>
  <div
    class="block list"
  >
    <button
      class="btn btn-default btn-block"
      type="button"
      @click="removeIssue"
    >
      Remove from board
    </button>
  </div>
</template>