Skip to content

G
gitlab-ce
Commit 254f11c6 authored by Natalia Tepluhina's avatar Natalia Tepluhina
Browse files
Options

Merge branch 'ntepluhina-immer' into 'master' 

Create a POC for 'immer' library

See merge request gitlab-org/gitlab!39738
parents 5494ff53 d8151d8f
Hide whitespace changes
Inline Side-by-side
Showing with 145 additions and 121 deletions
app/assets/javascripts/design_management/graphql.js
View file @ 254f11c6
import Vue from 'vue';
import VueApollo from 'vue-apollo';
import { uniqueId } from 'lodash';
import produce from 'immer';
import { defaultDataIdFromObject } from 'apollo-cache-inmemory';
import createDefaultClient from '~/lib/graphql';
import activeDiscussionQuery from './graphql/queries/active_discussion.query.graphql';
......@@ -11,12 +12,17 @@ Vue.use(VueApollo);
const resolvers = {
Mutation: {
updateActiveDiscussion: (_, { id = null, source }, { cache }) => {
const data = cache.readQuery({ query: activeDiscussionQuery });
data.activeDiscussion = {
__typename: 'ActiveDiscussion',
id,
source,
};
const sourceData = cache.readQuery({ query: activeDiscussionQuery });
const data = produce(sourceData, draftData => {
// eslint-disable-next-line no-param-reassign
draftData.activeDiscussion = {
__typename: 'ActiveDiscussion',
id,
source,
};
});
cache.writeQuery({ query: activeDiscussionQuery, data });
},
},
......@@ -37,6 +43,7 @@ const defaultClient = createDefaultClient(
},
},
typeDefs,
assumeImmutableResults: true,
},
);
......
app/assets/javascripts/design_management/pages/index.vue
View file @ 254f11c6
......@@ -281,13 +281,8 @@ export default {
.mutate({
mutation: moveDesignMutation,
variables: this.designMoveVariables(newIndex, element),
update: (store, { data: { designManagementMove } }) => {
return updateDesignsOnStoreAfterReorder(
store,
designManagementMove,
this.projectQueryBody,
);
},
update: (store, { data: { designManagementMove } }) =>
updateDesignsOnStoreAfterReorder(store, designManagementMove, this.projectQueryBody),
optimisticResponse: moveDesignOptimisticResponse(this.reorderedDesigns),
})
.catch(() => {
......
app/assets/javascripts/design_management/utils/cache_update.js
View file @ 254f11c6
/* eslint-disable @gitlab/require-i18n-strings */
import { groupBy } from 'lodash';
import produce from 'immer';
import { deprecatedCreateFlash as createFlash } from '~/flash';
import { extractCurrentDiscussion, extractDesign } from './design_management_utils';
import { extractCurrentDiscussion, extractDesign, extractDesigns } from './design_management_utils';
import {
ADD_IMAGE_DIFF_NOTE_ERROR,
UPDATE_IMAGE_DIFF_NOTE_ERROR,
......@@ -10,13 +11,20 @@ import {
designDeletionError,
} from './error_messages';
const designsOf = data => data.project.issue.designCollection.designs;
const isParticipating = (design, username) =>
design.issue.participants.nodes.some(participant => participant.username === username);
const deleteDesignsFromStore = (store, query, selectedDesigns) => {
const data = store.readQuery(query);
const sourceData = store.readQuery(query);
const changedDesigns = data.project.issue.designCollection.designs.nodes.filter(
node => !selectedDesigns.includes(node.filename),
);
data.project.issue.designCollection.designs.nodes = [...changedDesigns];
const data = produce(sourceData, draftData => {
const changedDesigns = designsOf(sourceData).nodes.filter(
design => !selectedDesigns.includes(design.filename),
);
designsOf(draftData).nodes = [...changedDesigns];
});
store.writeQuery({
...query,
......@@ -33,13 +41,15 @@ const deleteDesignsFromStore = (store, query, selectedDesigns) => {
*/
const addNewVersionToStore = (store, query, version) => {
if (!version) return;
const sourceData = store.readQuery(query);
const data = store.readQuery(query);
data.project.issue.designCollection.versions.nodes = [
version,
...data.project.issue.designCollection.versions.nodes,
];
const data = produce(sourceData, draftData => {
// eslint-disable-next-line no-param-reassign
draftData.project.issue.designCollection.versions.nodes = [
version,
...draftData.project.issue.designCollection.versions.nodes,
];
});
store.writeQuery({
...query,
......@@ -48,46 +58,41 @@ const addNewVersionToStore = (store, query, version) => {
};
const addDiscussionCommentToStore = (store, createNote, query, queryVariables, discussionId) => {
const data = store.readQuery({
const sourceData = store.readQuery({
query,
variables: queryVariables,
});
const design = extractDesign(data);
const currentDiscussion = extractCurrentDiscussion(design.discussions, discussionId);
currentDiscussion.notes.nodes = [...currentDiscussion.notes.nodes, createNote.note];
design.notesCount += 1;
if (
!design.issue.participants.nodes.some(
participant => participant.username === createNote.note.author.username,
)
) {
design.issue.participants.nodes = [
...design.issue.participants.nodes,
{
__typename: 'User',
...createNote.note.author,
},
];
}
const newParticipant = {
__typename: 'User',
...createNote.note.author,
};
const data = produce(sourceData, draftData => {
const design = extractDesign(draftData);
const currentDiscussion = extractCurrentDiscussion(design.discussions, discussionId);
currentDiscussion.notes.nodes = [...currentDiscussion.notes.nodes, createNote.note];
if (!isParticipating(design, createNote.note.author.username)) {
design.issue.participants.nodes = [...design.issue.participants.nodes, newParticipant];
}
design.notesCount += 1;
});
store.writeQuery({
query,
variables: queryVariables,
data: {
...data,
design: {
...design,
},
},
data,
});
};
const addImageDiffNoteToStore = (store, createImageDiffNote, query, variables) => {
const data = store.readQuery({
const sourceData = store.readQuery({
query,
variables,
});
const newDiscussion = {
__typename: 'Discussion',
id: createImageDiffNote.note.discussion.id,
......@@ -101,100 +106,100 @@ const addImageDiffNoteToStore = (store, createImageDiffNote, query, variables) =
nodes: [createImageDiffNote.note],
},
};
const design = extractDesign(data);
const notesCount = design.notesCount + 1;
design.discussions.nodes = [...design.discussions.nodes, newDiscussion];
if (
!design.issue.participants.nodes.some(
participant => participant.username === createImageDiffNote.note.author.username,
)
) {
design.issue.participants.nodes = [
...design.issue.participants.nodes,
{
__typename: 'User',
...createImageDiffNote.note.author,
},
];
}
const data = produce(sourceData, draftData => {
const design = extractDesign(draftData);
design.notesCount += 1;
design.discussions.nodes = [...design.discussions.nodes, newDiscussion];
if (
!design.issue.participants.nodes.some(
participant => participant.username === createImageDiffNote.note.author.username,
)
) {
design.issue.participants.nodes = [
...design.issue.participants.nodes,
{
__typename: 'User',
...createImageDiffNote.note.author,
},
];
}
});
store.writeQuery({
query,
variables,
data: {
...data,
design: {
...design,
notesCount,
},
},
data,
});
};
const updateImageDiffNoteInStore = (store, updateImageDiffNote, query, variables) => {
const data = store.readQuery({
const sourceData = store.readQuery({
query,
variables,
});
const design = extractDesign(data);
const discussion = extractCurrentDiscussion(
design.discussions,
updateImageDiffNote.note.discussion.id,
);
discussion.notes = {
...discussion.notes,
nodes: [updateImageDiffNote.note, ...discussion.notes.nodes.slice(1)],
};
const data = produce(sourceData, draftData => {
const design = extractDesign(draftData);
const discussion = extractCurrentDiscussion(
design.discussions,
updateImageDiffNote.note.discussion.id,
);
discussion.notes = {
...discussion.notes,
nodes: [updateImageDiffNote.note, ...discussion.notes.nodes.slice(1)],
};
});
store.writeQuery({
query,
variables,
data: {
...data,
design,
},
data,
});
};
const addNewDesignToStore = (store, designManagementUpload, query) => {
const data = store.readQuery(query);
const sourceData = store.readQuery(query);
const currentDesigns = data.project.issue.designCollection.designs.nodes;
const existingDesigns = groupBy(currentDesigns, 'filename');
const newDesigns = currentDesigns.concat(
designManagementUpload.designs.filter(d => !existingDesigns[d.filename]),
);
const data = produce(sourceData, draftData => {
const currentDesigns = extractDesigns(draftData);
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);
let newVersionNode;
const findNewVersions = designManagementUpload.designs.find(design => design.versions);
if (findNewVersions) {
const findNewVersionsNodes = findNewVersions.versions.nodes;
if (findNewVersions) {
const findNewVersionsNodes = findNewVersions.versions.nodes;
if (findNewVersionsNodes && findNewVersionsNodes.length) {
newVersionNode = [findNewVersionsNodes[0]];
if (findNewVersionsNodes && findNewVersionsNodes.length) {
newVersionNode = [findNewVersionsNodes[0]];
}
}
}
const newVersions = [
...(newVersionNode || []),
...data.project.issue.designCollection.versions.nodes,
];
const updatedDesigns = {
__typename: 'DesignCollection',
designs: {
__typename: 'DesignConnection',
nodes: newDesigns,
},
versions: {
__typename: 'DesignVersionConnection',
nodes: newVersions,
},
};
const newVersions = [
...(newVersionNode || []),
...draftData.project.issue.designCollection.versions.nodes,
];
data.project.issue.designCollection = updatedDesigns;
const updatedDesigns = {
__typename: 'DesignCollection',
designs: {
__typename: 'DesignConnection',
nodes: newDesigns,
},
versions: {
__typename: 'DesignVersionConnection',
nodes: newVersions,
},
};
// eslint-disable-next-line no-param-reassign
draftData.project.issue.designCollection = updatedDesigns;
});
store.writeQuery({
...query,
......@@ -203,8 +208,14 @@ const addNewDesignToStore = (store, designManagementUpload, query) => {
};
const moveDesignInStore = (store, designManagementMove, query) => {
const data = store.readQuery(query);
data.project.issue.designCollection.designs = designManagementMove.designCollection.designs;
const sourceData = store.readQuery(query);
const data = produce(sourceData, draftData => {
// eslint-disable-next-line no-param-reassign
draftData.project.issue.designCollection.designs =
designManagementMove.designCollection.designs;
});
store.writeQuery({
...query,
data,
......
changelogs/unreleased/ntepluhina-immer.yml 0 → 100644
View file @ 254f11c6
---
title: Create a POC for 'immer' library
merge_request: 39738
author:
type: other
yarn.lock
View file @ 254f11c6
......@@ -5954,6 +5954,11 @@ immediate@~3.0.5:
resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
integrity sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=
immer@^7.0.7:
version "7.0.7"
resolved "https://registry.yarnpkg.com/immer/-/immer-7.0.7.tgz#9dfe713d49bf871cc59aedfce59b1992fa37a977"
integrity sha512-Q8yYwVADJXrNfp1ZUAh4XDHkcoE3wpdpb4mC5abDSajs2EbW8+cGdPyAnglMyLnm7EF6ojD2xBFX7L5i4TIytw==
import-fresh@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-2.0.0.tgz#d81355c15612d386c61f9ddd3922d4304822a546"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7