summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue
blob: 041fa13a8f518cb6cb8076114743dccfab971064 (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
<script>
import simplePoll from '../../../lib/utils/simple_poll';
import eventHub from '../../event_hub';
import statusIcon from '../mr_widget_status_icon.vue';
import Flash from '../../../flash';

export default {
  name: 'MRWidgetRebase',
  components: {
    statusIcon,
  },
  props: {
    mr: {
      type: Object,
      required: true,
    },
    service: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      isMakingRequest: false,
      rebasingError: null,
    };
  },
  computed: {
    status() {
      if (this.mr.rebaseInProgress || this.isMakingRequest) {
        return 'loading';
      }
      if (!this.mr.canPushToSourceBranch && !this.mr.rebaseInProgress) {
        return 'warning';
      }
      return 'success';
    },
    showDisabledButton() {
      return ['failed', 'loading'].includes(this.status);
    },
  },
  methods: {
    rebase() {
      this.isMakingRequest = true;
      this.rebasingError = null;

      this.service
        .rebase()
        .then(() => {
          simplePoll(this.checkRebaseStatus);
        })
        .catch(error => {
          this.rebasingError = error.merge_error;
          this.isMakingRequest = false;
          Flash('Something went wrong. Please try again.');
        });
    },
    checkRebaseStatus(continuePolling, stopPolling) {
      this.service
        .poll()
        .then(res => res.data)
        .then(res => {
          if (res.rebase_in_progress) {
            continuePolling();
          } else {
            this.isMakingRequest = false;

            if (res.merge_error && res.merge_error.length) {
              this.rebasingError = res.merge_error;
              Flash('Something went wrong. Please try again.');
            }

            eventHub.$emit('MRWidgetUpdateRequested');
            stopPolling();
          }
        })
        .catch(() => {
          this.isMakingRequest = false;
          Flash('Something went wrong. Please try again.');
          stopPolling();
        });
    },
  },
};
</script>
<template>
  <div class="mr-widget-body media">
    <status-icon
      :status="status"
      :show-disabled-button="showDisabledButton"
    />

    <div class="rebase-state-find-class-convention media media-body space-children">
      <template v-if="mr.rebaseInProgress || isMakingRequest">
        <span class="bold">
          Rebase in progress
        </span>
      </template>
      <template v-if="!mr.rebaseInProgress && !mr.canPushToSourceBranch">
        <span class="bold">
          Fast-forward merge is not possible.
          Rebase the source branch onto
          <span class="label-branch">{{ mr.targetBranch }}</span>
          to allow this merge request to be merged.
        </span>
      </template>
      <template v-if="!mr.rebaseInProgress && mr.canPushToSourceBranch && !isMakingRequest">
        <div
          class="accept-merge-holder clearfix
js-toggle-container accept-action media space-children"
        >
          <button
            :disabled="isMakingRequest"
            type="button"
            class="btn btn-sm btn-reopen btn-success qa-mr-rebase-button"
            @click="rebase"
          >
            <gl-loading-icon v-if="isMakingRequest" />
            Rebase
          </button>
          <span
            v-if="!rebasingError"
            class="bold"
          >
            Fast-forward merge is not possible.
            Rebase the source branch onto the target branch or merge target
            branch into source branch to allow this merge request to be merged.
          </span>
          <span
            v-else
            class="bold danger">
            {{ rebasingError }}
          </span>
        </div>
      </template>
    </div>
  </div>
</template>