summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.vue
blob: 97f4196b94dd9651d82978252f918f6ba832c54c (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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<script>
  import Flash from '../../../flash';
  import statusIcon from '../mr_widget_status_icon.vue';
  import MrWidgetAuthor from '../../components/mr_widget_author.vue';
  import eventHub from '../../event_hub';

  export default {
    name: 'MRWidgetMergeWhenPipelineSucceeds',
    components: {
      MrWidgetAuthor,
      statusIcon,
    },
    props: {
      mr: {
        type: Object,
        required: true,
        default: () => ({}),
      },
      service: {
        type: Object,
        required: true,
        default: () => ({}),
      },
    },
    data() {
      return {
        isCancellingAutoMerge: false,
        isRemovingSourceBranch: false,
      };
    },
    computed: {
      canRemoveSourceBranch() {
        const {
          shouldRemoveSourceBranch,
          canRemoveSourceBranch,
          mergeUserId,
          currentUserId,
        } = this.mr;

        return !shouldRemoveSourceBranch &&
          canRemoveSourceBranch &&
          mergeUserId === currentUserId;
      },
    },
    methods: {
      cancelAutomaticMerge() {
        this.isCancellingAutoMerge = true;
        this.service.cancelAutomaticMerge()
          .then(res => res.data)
          .then((data) => {
            eventHub.$emit('UpdateWidgetData', data);
          })
          .catch(() => {
            this.isCancellingAutoMerge = false;
            Flash('Something went wrong. Please try again.');
          });
      },
      removeSourceBranch() {
        const options = {
          sha: this.mr.sha,
          merge_when_pipeline_succeeds: true,
          should_remove_source_branch: true,
        };

        this.isRemovingSourceBranch = true;
        this.service.merge(options)
          .then(res => res.data)
          .then((data) => {
            if (data.status === 'merge_when_pipeline_succeeds') {
              eventHub.$emit('MRWidgetUpdateRequested');
            }
          })
          .catch(() => {
            this.isRemovingSourceBranch = false;
            Flash('Something went wrong. Please try again.');
          });
      },
    },
  };
</script>
<template>
  <div class="mr-widget-body media">
    <status-icon status="success" />
    <div class="media-body">
      <h4 class="d-flex align-items-start">
        <span class="append-right-10">
          {{ s__("mrWidget|Set by") }}
          <mr-widget-author :author="mr.setToMWPSBy" />
          {{ s__("mrWidget|to be merged automatically when the pipeline succeeds") }}
        </span>
        <a
          v-if="mr.canCancelAutomaticMerge"
          :disabled="isCancellingAutoMerge"
          role="button"
          href="#"
          class="btn btn-sm btn-default js-cancel-auto-merge"
          @click.prevent="cancelAutomaticMerge">
          <i
            v-if="isCancellingAutoMerge"
            class="fa fa-spinner fa-spin"
            aria-hidden="true"
          >
          </i>
          {{ s__("mrWidget|Cancel automatic merge") }}
        </a>
      </h4>
      <section class="mr-info-list">
        <p>
          {{ s__("mrWidget|The changes will be merged into") }}
          <a
            :href="mr.targetBranchPath"
            class="label-branch"
          >
            {{ mr.targetBranch }}
          </a>
        </p>
        <p v-if="mr.shouldRemoveSourceBranch">
          {{ s__("mrWidget|The source branch will be removed") }}
        </p>
        <p
          v-else
          class="d-flex align-items-start"
        >
          <span class="append-right-10">
            {{ s__("mrWidget|The source branch will not be removed") }}
          </span>
          <a
            v-if="canRemoveSourceBranch"
            :disabled="isRemovingSourceBranch"
            role="button"
            class="btn btn-sm btn-default js-remove-source-branch"
            href="#"
            @click.prevent="removeSourceBranch"
          >
            <i
              v-if="isRemovingSourceBranch"
              class="fa fa-spinner fa-spin"
              aria-hidden="true"
            >
            </i>
            {{ s__("mrWidget|Remove source branch") }}
          </a>
        </p>
      </section>
    </div>
  </div>
</template>