1 files changed, 48 insertions, 42 deletions

diff --git a/app/assets/javascripts/design_management/utils/cache_update.js b/app/assets/javascripts/design_management/utils/cache_update.js
index 24b374b79fd..b79df9d01d5 100644
--- a/app/assets/javascripts/design_management/utils/cache_update.js
+++ b/app/assets/javascripts/design_management/utils/cache_update.js
@@ -1,6 +1,7 @@
 /* eslint-disable @gitlab/require-i18n-strings */
 
-import createFlash from '~/flash';
+import { groupBy } from 'lodash';
+import { deprecatedCreateFlash as createFlash } from '~/flash';
 import { extractCurrentDiscussion, extractDesign } from './design_management_utils';
 import {
   ADD_IMAGE_DIFF_NOTE_ERROR,
@@ -12,10 +13,10 @@ import {
 const deleteDesignsFromStore = (store, query, selectedDesigns) => {
   const data = store.readQuery(query);
 
-  const changedDesigns = data.project.issue.designCollection.designs.edges.filter(
-    ({ node }) => !selectedDesigns.includes(node.filename),
+  const changedDesigns = data.project.issue.designCollection.designs.nodes.filter(
+    node => !selectedDesigns.includes(node.filename),
   );
-  data.project.issue.designCollection.designs.edges = [...changedDesigns];
+  data.project.issue.designCollection.designs.nodes = [...changedDesigns];
 
   store.writeQuery({
     ...query,
@@ -34,11 +35,10 @@ const addNewVersionToStore = (store, query, version) => {
   if (!version) return;
 
   const data = store.readQuery(query);
-  const newEdge = { node: version, __typename: 'DesignVersionEdge' };
 
-  data.project.issue.designCollection.versions.edges = [
-    newEdge,
-    ...data.project.issue.designCollection.versions.edges,
+  data.project.issue.designCollection.versions.nodes = [
+    version,
+    ...data.project.issue.designCollection.versions.nodes,
   ];
 
   store.writeQuery({
@@ -59,18 +59,15 @@ const addDiscussionCommentToStore = (store, createNote, query, queryVariables, d
 
   design.notesCount += 1;
   if (
-    !design.issue.participants.edges.some(
-      participant => participant.node.username === createNote.note.author.username,
+    !design.issue.participants.nodes.some(
+      participant => participant.username === createNote.note.author.username,
     )
   ) {
-    design.issue.participants.edges = [
-      ...design.issue.participants.edges,
+    design.issue.participants.nodes = [
+      ...design.issue.participants.nodes,
       {
-        __typename: 'UserEdge',
-        node: {
-          __typename: 'User',
-          ...createNote.note.author,
-        },
+        __typename: 'User',
+        ...createNote.note.author,
       },
     ];
   }
@@ -108,18 +105,15 @@ const addImageDiffNoteToStore = (store, createImageDiffNote, query, variables) =
   const notesCount = design.notesCount + 1;
   design.discussions.nodes = [...design.discussions.nodes, newDiscussion];
   if (
-    !design.issue.participants.edges.some(
-      participant => participant.node.username === createImageDiffNote.note.author.username,
+    !design.issue.participants.nodes.some(
+      participant => participant.username === createImageDiffNote.note.author.username,
     )
   ) {
-    design.issue.participants.edges = [
-      ...design.issue.participants.edges,
+    design.issue.participants.nodes = [
+      ...design.issue.participants.nodes,
       {
-        __typename: 'UserEdge',
-        node: {
-          __typename: 'User',
-          ...createImageDiffNote.note.author,
-        },
+        __typename: 'User',
+        ...createImageDiffNote.note.author,
       },
     ];
   }
@@ -166,42 +160,37 @@ const updateImageDiffNoteInStore = (store, updateImageDiffNote, query, variables
 const addNewDesignToStore = (store, designManagementUpload, query) => {
   const data = store.readQuery(query);
 
-  const newDesigns = data.project.issue.designCollection.designs.edges.reduce((acc, design) => {
-    if (!acc.find(d => d.filename === design.node.filename)) {
-      acc.push(design.node);
-    }
-
-    return acc;
-  }, designManagementUpload.designs);
+  const currentDesigns = data.project.issue.designCollection.designs.nodes;
+  const existingDesigns = groupBy(currentDesigns, 'filename');
+  const newDesigns = currentDesigns.concat(
+    designManagementUpload.designs.filter(d => !existingDesigns[d.filename]),
+  );
 
   let newVersionNode;
   const findNewVersions = designManagementUpload.designs.find(design => design.versions);
 
   if (findNewVersions) {
-    const findNewVersionsEdges = findNewVersions.versions.edges;
+    const findNewVersionsNodes = findNewVersions.versions.nodes;
 
-    if (findNewVersionsEdges && findNewVersionsEdges.length) {
-      newVersionNode = [findNewVersionsEdges[0]];
+    if (findNewVersionsNodes && findNewVersionsNodes.length) {
+      newVersionNode = [findNewVersionsNodes[0]];
     }
   }
 
   const newVersions = [
     ...(newVersionNode || []),
-    ...data.project.issue.designCollection.versions.edges,
+    ...data.project.issue.designCollection.versions.nodes,
   ];
 
   const updatedDesigns = {
     __typename: 'DesignCollection',
     designs: {
       __typename: 'DesignConnection',
-      edges: newDesigns.map(design => ({
-        __typename: 'DesignEdge',
-        node: design,
-      })),
+      nodes: newDesigns,
     },
     versions: {
       __typename: 'DesignVersionConnection',
-      edges: newVersions,
+      nodes: newVersions,
     },
   };
 
@@ -213,6 +202,15 @@ const addNewDesignToStore = (store, designManagementUpload, query) => {
   });
 };
 
+const moveDesignInStore = (store, designManagementMove, query) => {
+  const data = store.readQuery(query);
+  data.project.issue.designCollection.designs = designManagementMove.designCollection.designs;
+  store.writeQuery({
+    ...query,
+    data,
+  });
+};
+
 const onError = (data, message) => {
   createFlash(message);
   throw new Error(data.errors);
@@ -274,3 +272,11 @@ export const updateStoreAfterUploadDesign = (store, data, query) => {
     addNewDesignToStore(store, data, query);
   }
 };
+
+export const updateDesignsOnStoreAfterReorder = (store, data, query) => {
+  if (hasErrors(data)) {
+    createFlash(data.errors[0]);
+  } else {
+    moveDesignInStore(store, data, query);
+  }
+};