1 files changed, 36 insertions, 7 deletions

diff --git a/app/assets/javascripts/issues_list/index.js b/app/assets/javascripts/issues_list/index.js
index 71ceb9bef55..dcc7ee72273 100644
--- a/app/assets/javascripts/issues_list/index.js
+++ b/app/assets/javascripts/issues_list/index.js
@@ -1,5 +1,7 @@
+import produce from 'immer';
 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
+import getIssuesQuery from 'ee_else_ce/issues_list/queries/get_issues.query.graphql';
 import IssuesListApp from '~/issues_list/components/issues_list_app.vue';
 import createDefaultClient from '~/lib/graphql';
 import { convertObjectPropsToCamelCase, parseBoolean } from '~/lib/utils/common_utils';
@@ -13,9 +15,16 @@ export function mountJiraIssuesListApp() {
     return false;
   }
 
-  Vue.use(VueApollo);
+  const { issuesPath, projectPath } = el.dataset;
+  const canEdit = parseBoolean(el.dataset.canEdit);
+  const isJiraConfigured = parseBoolean(el.dataset.isJiraConfigured);
+
+  if (!isJiraConfigured || !canEdit) {
+    return false;
+  }
 
-  const defaultClient = createDefaultClient();
+  Vue.use(VueApollo);
+  const defaultClient = createDefaultClient({}, { assumeImmutableResults: true });
   const apolloProvider = new VueApollo({
     defaultClient,
   });
@@ -26,10 +35,10 @@ export function mountJiraIssuesListApp() {
     render(createComponent) {
       return createComponent(JiraIssuesImportStatusRoot, {
         props: {
-          canEdit: parseBoolean(el.dataset.canEdit),
-          isJiraConfigured: parseBoolean(el.dataset.isJiraConfigured),
-          issuesPath: el.dataset.issuesPath,
-          projectPath: el.dataset.projectPath,
+          canEdit,
+          isJiraConfigured,
+          issuesPath,
+          projectPath,
         },
       });
     },
@@ -74,7 +83,27 @@ export function mountIssuesListApp() {
 
   Vue.use(VueApollo);
 
-  const defaultClient = createDefaultClient({}, { assumeImmutableResults: true });
+  const resolvers = {
+    Mutation: {
+      reorderIssues: (_, { oldIndex, newIndex, serializedVariables }, { cache }) => {
+        const variables = JSON.parse(serializedVariables);
+        const sourceData = cache.readQuery({ query: getIssuesQuery, variables });
+
+        const data = produce(sourceData, (draftData) => {
+          const issues = draftData.project.issues.nodes.slice();
+          const issueToMove = issues[oldIndex];
+          issues.splice(oldIndex, 1);
+          issues.splice(newIndex, 0, issueToMove);
+
+          draftData.project.issues.nodes = issues;
+        });
+
+        cache.writeQuery({ query: getIssuesQuery, variables, data });
+      },
+    },
+  };
+
+  const defaultClient = createDefaultClient(resolvers, { assumeImmutableResults: true });
   const apolloProvider = new VueApollo({
     defaultClient,
   });