Add latest changes from gitlab-org/gitlab@15-6-stable-eev15.6.0-rc42

5 files changed, 222 insertions, 19 deletions

diff --git a/app/assets/javascripts/issuable/bulk_update_sidebar/components/graphql/mutations/move_issue.mutation.graphql b/app/assets/javascripts/issuable/bulk_update_sidebar/components/graphql/mutations/move_issue.mutation.graphql
new file mode 100644
index 00000000000..d350072425b
--- /dev/null
+++ b/app/assets/javascripts/issuable/bulk_update_sidebar/components/graphql/mutations/move_issue.mutation.graphql
@@ -0,0 +1,5 @@
+mutation moveIssue($moveIssueInput: IssueMoveInput!) {
+  issueMove(input: $moveIssueInput) {
+    errors
+  }
+}
diff --git a/app/assets/javascripts/issuable/bulk_update_sidebar/components/move_issues_button.vue b/app/assets/javascripts/issuable/bulk_update_sidebar/components/move_issues_button.vue
new file mode 100644
index 00000000000..6e287ac3bb7
--- /dev/null
+++ b/app/assets/javascripts/issuable/bulk_update_sidebar/components/move_issues_button.vue
@@ -0,0 +1,171 @@
+<script>
+import { GlAlert } from '@gitlab/ui';
+import IssuableMoveDropdown from '~/vue_shared/components/sidebar/issuable_move_dropdown.vue';
+import createFlash from '~/flash';
+import { logError } from '~/lib/logger';
+import { s__ } from '~/locale';
+import {
+  WORK_ITEM_TYPE_ENUM_ISSUE,
+  WORK_ITEM_TYPE_ENUM_INCIDENT,
+  WORK_ITEM_TYPE_ENUM_TASK,
+  WORK_ITEM_TYPE_ENUM_TEST_CASE,
+} from '~/work_items/constants';
+import issuableEventHub from '~/issues/list/eventhub';
+import getIssuesQuery from 'ee_else_ce/issues/list/queries/get_issues.query.graphql';
+import getIssuesCountQuery from 'ee_else_ce/issues/list/queries/get_issues_counts.query.graphql';
+import moveIssueMutation from './graphql/mutations/move_issue.mutation.graphql';
+
+export default {
+  name: 'MoveIssuesButton',
+  components: {
+    IssuableMoveDropdown,
+    GlAlert,
+  },
+  props: {
+    projectFullPath: {
+      type: String,
+      required: true,
+    },
+    projectsFetchPath: {
+      type: String,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      selectedIssuables: [],
+      moveInProgress: false,
+    };
+  },
+  computed: {
+    cannotMoveTasksWarningTitle() {
+      if (this.tasksSelected && this.testCasesSelected) {
+        return s__('Issues|Tasks and test cases can not be moved.');
+      }
+
+      if (this.testCasesSelected) {
+        return s__('Issues|Test cases can not be moved.');
+      }
+
+      return s__('Issues|Tasks can not be moved.');
+    },
+    issuesSelected() {
+      return this.selectedIssuables.some((item) => item.type === WORK_ITEM_TYPE_ENUM_ISSUE);
+    },
+    incidentsSelected() {
+      return this.selectedIssuables.some((item) => item.type === WORK_ITEM_TYPE_ENUM_INCIDENT);
+    },
+    tasksSelected() {
+      return this.selectedIssuables.some((item) => item.type === WORK_ITEM_TYPE_ENUM_TASK);
+    },
+    testCasesSelected() {
+      return this.selectedIssuables.some((item) => item.type === WORK_ITEM_TYPE_ENUM_TEST_CASE);
+    },
+  },
+  mounted() {
+    issuableEventHub.$on('issuables:issuableChecked', this.handleIssuableChecked);
+  },
+  beforeDestroy() {
+    issuableEventHub.$off('issuables:issuableChecked', this.handleIssuableChecked);
+  },
+  methods: {
+    handleIssuableChecked(issuable, value) {
+      if (value) {
+        this.selectedIssuables.push(issuable);
+      } else {
+        const index = this.selectedIssuables.indexOf(issuable);
+        if (index > -1) {
+          this.selectedIssuables.splice(index, 1);
+        }
+      }
+    },
+    moveIssues(targetProject) {
+      const iids = this.selectedIssuables.reduce((result, issueData) => {
+        if (
+          issueData.type === WORK_ITEM_TYPE_ENUM_ISSUE ||
+          issueData.type === WORK_ITEM_TYPE_ENUM_INCIDENT
+        ) {
+          result.push(issueData.iid);
+        }
+        return result;
+      }, []);
+
+      if (iids.length === 0) {
+        return;
+      }
+
+      this.moveInProgress = true;
+      issuableEventHub.$emit('issuables:bulkMoveStarted');
+
+      const promises = iids.map((id) => {
+        return this.moveIssue(id, targetProject);
+      });
+
+      Promise.all(promises)
+        .then((promisesResult) => {
+          let foundError = false;
+
+          for (const promiseResult of promisesResult) {
+            if (promiseResult.data.issueMove?.errors?.length) {
+              foundError = true;
+              logError(
+                `Error moving issue. Error message: ${promiseResult.data.issueMove.errors[0].message}`,
+              );
+            }
+          }
+
+          if (!foundError) {
+            const client = this.$apollo.provider.defaultClient;
+            client.refetchQueries({
+              include: [getIssuesQuery, getIssuesCountQuery],
+            });
+            this.moveInProgress = false;
+            this.selectedIssuables = [];
+            issuableEventHub.$emit('issuables:bulkMoveEnded');
+          } else {
+            throw new Error();
+          }
+        })
+        .catch(() => {
+          this.moveInProgress = false;
+          issuableEventHub.$emit('issuables:bulkMoveEnded');
+
+          createFlash({
+            message: s__(`Issues|There was an error while moving the issues.`),
+          });
+        });
+    },
+    moveIssue(issueIid, targetProject) {
+      return this.$apollo.mutate({
+        mutation: moveIssueMutation,
+        variables: {
+          moveIssueInput: {
+            projectPath: this.projectFullPath,
+            iid: issueIid,
+            targetProjectPath: targetProject.full_path,
+          },
+        },
+      });
+    },
+  },
+  i18n: {
+    dropdownButtonTitle: s__('Issues|Move selected'),
+  },
+};
+</script>
+<template>
+  <div>
+    <issuable-move-dropdown
+      :project-full-path="projectFullPath"
+      :projects-fetch-path="projectsFetchPath"
+      :move-in-progress="moveInProgress"
+      :disabled="!issuesSelected && !incidentsSelected"
+      :dropdown-header-title="$options.i18n.dropdownButtonTitle"
+      :dropdown-button-title="$options.i18n.dropdownButtonTitle"
+      @move-issuable="moveIssues"
+    />
+    <gl-alert v-if="tasksSelected || testCasesSelected" :dismissible="false" variant="warning">
+      {{ cannotMoveTasksWarningTitle }}
+    </gl-alert>
+  </div>
+</template>
diff --git a/app/assets/javascripts/issuable/bulk_update_sidebar/index.js b/app/assets/javascripts/issuable/bulk_update_sidebar/index.js
index 4657771353f..b7cb805ee37 100644
--- a/app/assets/javascripts/issuable/bulk_update_sidebar/index.js
+++ b/app/assets/javascripts/issuable/bulk_update_sidebar/index.js
@@ -1,6 +1,9 @@
 import Vue from 'vue';
+import VueApollo from 'vue-apollo';
+import { gqlClient } from '../../issues/list/graphql';
 import StatusDropdown from './components/status_dropdown.vue';
 import SubscriptionsDropdown from './components/subscriptions_dropdown.vue';
+import MoveIssuesButton from './components/move_issues_button.vue';
 import issuableBulkUpdateActions from './issuable_bulk_update_actions';
 import IssuableBulkUpdateSidebar from './issuable_bulk_update_sidebar';
 
@@ -42,3 +45,31 @@ export function initSubscriptionsDropdown() {
     render: (createElement) => createElement(SubscriptionsDropdown),
   });
 }
+
+export function initMoveIssuesButton() {
+  const el = document.querySelector('.js-move-issues');
+
+  if (!el) {
+    return null;
+  }
+
+  const { dataset } = el;
+
+  Vue.use(VueApollo);
+  const apolloProvider = new VueApollo({
+    defaultClient: gqlClient,
+  });
+
+  return new Vue({
+    el,
+    name: 'MoveIssuesRoot',
+    apolloProvider,
+    render: (createElement) =>
+      createElement(MoveIssuesButton, {
+        props: {
+          projectFullPath: dataset.projectFullPath,
+          projectsFetchPath: dataset.projectsFetchPath,
+        },
+      }),
+  });
+}
diff --git a/app/assets/javascripts/issuable/bulk_update_sidebar/issuable_bulk_update_sidebar.js b/app/assets/javascripts/issuable/bulk_update_sidebar/issuable_bulk_update_sidebar.js
index a33c6ae8030..b46a95c7dfa 100644
--- a/app/assets/javascripts/issuable/bulk_update_sidebar/issuable_bulk_update_sidebar.js
+++ b/app/assets/javascripts/issuable/bulk_update_sidebar/issuable_bulk_update_sidebar.js
@@ -3,7 +3,7 @@
 import $ from 'jquery';
 import issuableEventHub from '~/issues/list/eventhub';
 import LabelsSelect from '~/labels/labels_select';
-import MilestoneSelect from '~/milestones/milestone_select';
+import { mountMilestoneDropdown } from '~/sidebar/mount_sidebar';
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
 
 const HIDDEN_CLASS = 'hidden';
@@ -46,35 +46,28 @@ export default class IssuableBulkUpdateSidebar {
     // https://gitlab.com/gitlab-org/gitlab/-/issues/325874
     issuableEventHub.$on('issuables:enableBulkEdit', () => this.toggleBulkEdit(null, true));
     issuableEventHub.$on('issuables:updateBulkEdit', () => this.updateFormState());
+
+    // These events are connected to the logic inside `move_issues_button.vue`,
+    // so that only one action can be performed at a time
+    issuableEventHub.$on('issuables:bulkMoveStarted', () => this.toggleSubmitButtonDisabled(true));
+    issuableEventHub.$on('issuables:bulkMoveEnded', () => this.updateFormState());
   }
 
   initDropdowns() {
     new LabelsSelect();
-    new MilestoneSelect();
+    mountMilestoneDropdown();
 
     // Checking IS_EE and using ee_else_ce is odd, but we do it here to satisfy
     // the import/no-unresolved lint rule when FOSS_ONLY=1, even though at
     // runtime this block won't execute.
     if (IS_EE) {
-      import('ee_else_ce/vue_shared/components/sidebar/health_status_select/health_status_bundle')
-        .then(({ default: HealthStatusSelect }) => {
-          HealthStatusSelect();
-        })
-        .catch(() => {});
-
-      import('ee_else_ce/vue_shared/components/sidebar/epics_select/epics_select_bundle')
-        .then(({ default: EpicSelect }) => {
-          EpicSelect();
+      import('ee_else_ce/sidebar/mount_sidebar')
+        .then(({ mountEpicDropdown, mountHealthStatusDropdown, mountIterationDropdown }) => {
+          mountEpicDropdown();
+          mountHealthStatusDropdown();
+          mountIterationDropdown();
         })
         .catch(() => {});
-
-      import('ee_else_ce/vue_shared/components/sidebar/iterations_dropdown_bundle')
-        .then(({ default: iterationsDropdown }) => {
-          iterationsDropdown();
-        })
-        .catch((e) => {
-          throw e;
-        });
     }
   }
 
@@ -89,6 +82,8 @@ export default class IssuableBulkUpdateSidebar {
     this.updateSelectedIssuableIds();
 
     IssuableBulkUpdateActions.setOriginalDropdownData();
+
+    issuableEventHub.$emit('issuables:selectionChanged', !noCheckedIssues);
   }
 
   prepForSubmit() {
diff --git a/app/assets/javascripts/issuable/components/related_issuable_item.vue b/app/assets/javascripts/issuable/components/related_issuable_item.vue
index 8894e8f63b8..254248ef1d4 100644
--- a/app/assets/javascripts/issuable/components/related_issuable_item.vue
+++ b/app/assets/javascripts/issuable/components/related_issuable_item.vue
@@ -141,6 +141,7 @@ export default {
         <gl-link
           :href="computedPath"
           class="sortable-link gl-font-weight-normal"
+          target="_blank"
           @click="handleTitleClick"
         >
           {{ title }}