Add latest changes from gitlab-org/gitlab@13-0-stable-ee

1 files changed, 66 insertions, 17 deletions

diff --git a/app/assets/javascripts/notes/components/comment_form.vue b/app/assets/javascripts/notes/components/comment_form.vue
index 9a809b71a58..a070cf8866a 100644
--- a/app/assets/javascripts/notes/components/comment_form.vue
+++ b/app/assets/javascripts/notes/components/comment_form.vue
@@ -3,6 +3,7 @@ import $ from 'jquery';
 import { mapActions, mapGetters, mapState } from 'vuex';
 import { isEmpty } from 'lodash';
 import Autosize from 'autosize';
+import { GlAlert, GlIntersperse, GlLink, GlSprintf } from '@gitlab/ui';
 import { __, sprintf } from '~/locale';
 import TimelineEntryItem from '~/vue_shared/components/notes/timeline_entry_item.vue';
 import Flash from '../../flash';
@@ -34,6 +35,10 @@ export default {
     userAvatarLink,
     loadingButton,
     TimelineEntryItem,
+    GlAlert,
+    GlIntersperse,
+    GlLink,
+    GlSprintf,
   },
   mixins: [issuableStateMixin],
   props: {
@@ -57,8 +62,9 @@ export default {
       'getNoteableData',
       'getNotesData',
       'openState',
+      'getBlockedByIssues',
     ]),
-    ...mapState(['isToggleStateButtonLoading']),
+    ...mapState(['isToggleStateButtonLoading', 'isToggleBlockedIssueWarning']),
     noteableDisplayName() {
       return splitCamelCase(this.noteableType).toLowerCase();
     },
@@ -159,6 +165,7 @@ export default {
       'reopenIssue',
       'toggleIssueLocalState',
       'toggleStateButtonLoading',
+      'toggleBlockedIssueWarning',
     ]),
     setIsSubmitButtonDisabled(note, isSubmitting) {
       if (!isEmpty(note) && !isSubmitting) {
@@ -220,22 +227,17 @@ export default {
       this.isSubmitting = false;
     },
     toggleIssueState() {
+      if (
+        this.noteableType.toLowerCase() === constants.ISSUE_NOTEABLE_TYPE &&
+        this.isOpen &&
+        this.getBlockedByIssues &&
+        this.getBlockedByIssues.length > 0
+      ) {
+        this.toggleBlockedIssueWarning(true);
+        return;
+      }
       if (this.isOpen) {
-        this.closeIssue()
-          .then(() => {
-            this.enableButton();
-            refreshUserMergeRequestCounts();
-          })
-          .catch(() => {
-            this.enableButton();
-            this.toggleStateButtonLoading(false);
-            Flash(
-              sprintf(
-                __('Something went wrong while closing the %{issuable}. Please try again later'),
-                { issuable: this.noteableDisplayName },
-              ),
-            );
-          });
+        this.forceCloseIssue();
       } else {
         this.reopenIssue()
           .then(() => {
@@ -258,6 +260,23 @@ export default {
           });
       }
     },
+    forceCloseIssue() {
+      this.closeIssue()
+        .then(() => {
+          this.enableButton();
+          refreshUserMergeRequestCounts();
+        })
+        .catch(() => {
+          this.enableButton();
+          this.toggleStateButtonLoading(false);
+          Flash(
+            sprintf(
+              __('Something went wrong while closing the %{issuable}. Please try again later'),
+              { issuable: this.noteableDisplayName },
+            ),
+          );
+        });
+    },
     discard(shouldClear = true) {
       // `blur` is needed to clear slash commands autocomplete cache if event fired.
       // `focus` is needed to remain cursor in the textarea.
@@ -361,6 +380,36 @@ js-gfm-input js-autosize markdown-area js-vue-textarea qa-comment-input"
               >
               </textarea>
             </markdown-field>
+            <gl-alert
+              v-if="isToggleBlockedIssueWarning"
+              class="prepend-top-16"
+              :title="__('Are you sure you want to close this blocked issue?')"
+              :primary-button-text="__('Yes, close issue')"
+              :secondary-button-text="__('Cancel')"
+              variant="warning"
+              :dismissible="false"
+              @primaryAction="forceCloseIssue"
+              @secondaryAction="toggleBlockedIssueWarning(false) && enableButton()"
+            >
+              <p>
+                <gl-sprintf
+                  :message="
+                    __('This issue is currently blocked by the following issues: %{issues}.')
+                  "
+                >
+                  <template #issues>
+                    <gl-intersperse>
+                      <gl-link
+                        v-for="blockingIssue in getBlockedByIssues"
+                        :key="blockingIssue.web_url"
+                        :href="blockingIssue.web_url"
+                        >#{{ blockingIssue.iid }}</gl-link
+                      >
+                    </gl-intersperse>
+                  </template>
+                </gl-sprintf>
+              </p>
+            </gl-alert>
             <div class="note-form-actions">
               <div
                 class="float-left btn-group
@@ -427,7 +476,7 @@ append-right-10 comment-type-dropdown js-comment-type-dropdown droplab-dropdown"
               </div>
 
               <loading-button
-                v-if="canToggleIssueState"
+                v-if="canToggleIssueState && !isToggleBlockedIssueWarning"
                 :loading="isToggleStateButtonLoading"
                 :container-class="[
                   actionButtonClassNames,