diff --git a/client/src/components/content-block-form/EditContentBlockWizard.vue b/client/src/components/content-block-form/EditContentBlockWizard.vue index b24cf200..ebf81408 100644 --- a/client/src/components/content-block-form/EditContentBlockWizard.vue +++ b/client/src/components/content-block-form/EditContentBlockWizard.vue @@ -24,7 +24,7 @@ methods: { hideModal() { - this.$store.dispatch('resetCurrentContentBlock'); + this.$store.dispatch('resetCurrentNoteBlock'); this.$store.dispatch('hideModal'); }, saveContentBlock(contentBlock) { @@ -67,7 +67,7 @@ return { query: CONTENT_BLOCK_QUERY, variables: { - id: store.state.currentContentBlock + id: store.state.currentNoteBlock } } } diff --git a/client/src/components/content-blocks/ContentComponent.vue b/client/src/components/content-blocks/ContentComponent.vue index 348bd44a..4332a037 100644 --- a/client/src/components/content-blocks/ContentComponent.vue +++ b/client/src/components/content-blocks/ContentComponent.vue @@ -39,8 +39,7 @@ import Solution from '@/components/content-blocks/Solution'; import BookmarkActions from '@/components/notes/BookmarkActions'; - import UPDATE_CONTENT_BOOKMARK from '@/graphql/gql/mutations/updateContentBookmark.gql'; - import CONTENT_BLOCK_QUERY from '@/graphql/gql/contentBlockQuery.gql'; + import {constructContentComponentBookmarkMutation} from '@/helpers/update-content-bookmark-mutation'; export default { props: ['component', 'parent', 'bookmarks', 'notes', 'root'], @@ -84,63 +83,15 @@ addNote(id) { this.$store.dispatch('addNote', { content: id, - contentBlock: this.root + type: this.parent.__typename, + block: this.root }); }, editNote() { this.$store.dispatch('editNote', this.note); }, bookmarkContent(uuid, bookmarked) { - this.$apollo.mutate({ - mutation: UPDATE_CONTENT_BOOKMARK, - variables: { - input: { - uuid, - contentBlock: this.root, - bookmarked - } - }, - update: (store, response) => { - const query = CONTENT_BLOCK_QUERY; - const variables = {id: this.root}; - const data = store.readQuery({ - query, - variables - }); - - const bookmarks = data.contentBlock.bookmarks; - - if (bookmarked) { - bookmarks.push({ - note: null, - uuid: uuid, - __typename: 'ContentBlockBookmarkNode' - }); - } else { - let index = bookmarks.findIndex(element => { - return element.uuid === uuid; - }); - if (index > -1) { - bookmarks.splice(index, 1); - } - } - - data.contentBlock.bookmarks = bookmarks; - - store.writeQuery({ - data, - query, - variables - }); - }, - optimisticResponse: { - __typename: 'Mutation', - updateContentBookmark: { - __typename: 'UpdateContentBookmarkPayload', - success: true - } - } - }); + this.$apollo.mutate(constructContentComponentBookmarkMutation(uuid, bookmarked, this.parent, this.root)); } } }; diff --git a/client/src/components/notes/EditNoteWizard.vue b/client/src/components/notes/EditNoteWizard.vue index ce94c1c6..05b41280 100644 --- a/client/src/components/notes/EditNoteWizard.vue +++ b/client/src/components/notes/EditNoteWizard.vue @@ -7,6 +7,7 @@ import UPDATE_NOTE_MUTATION from '@/graphql/gql/mutations/updateNote.gql'; import MODULE_DETAILS_QUERY from '@/graphql/gql/moduleDetailsQuery.gql'; + import INSTRUMENT_QUERY from '@/graphql/gql/instrumentQuery.gql'; import {mapGetters} from 'vuex'; @@ -21,6 +22,9 @@ methods: { editNote(note) { + const slug = this.$route.params.slug; + const routeName = this.$route.name; + this.$apollo.mutate({ mutation: UPDATE_NOTE_MUTATION, variables: { @@ -28,12 +32,25 @@ note } }, - refetchQueries: [{ - query: MODULE_DETAILS_QUERY, - variables: { - slug: this.$route.params.slug + refetchQueries() { + let query; + if (routeName === 'instrument') { + query = { + query: INSTRUMENT_QUERY, + variables: { + slug + } + } + } else { + query = { + query: MODULE_DETAILS_QUERY, + variables: { + slug + } + } } - }] + return [query]; + } }).then(() => { this.$store.dispatch('hideModal'); }); diff --git a/client/src/components/notes/NewNoteWizard.vue b/client/src/components/notes/NewNoteWizard.vue index 70f6be8c..eda0331f 100644 --- a/client/src/components/notes/NewNoteWizard.vue +++ b/client/src/components/notes/NewNoteWizard.vue @@ -20,21 +20,23 @@ }, computed: { - ...mapGetters(['currentContent', 'currentContentBlock', 'currentNoteParent']) + ...mapGetters(['currentContent', 'currentNoteBlock', 'currentNoteParent', 'noteType']) }, methods: { addNote(n) { const content = this.currentContent; - const contentBlock = this.currentContentBlock; + const block = this.currentNoteBlock; const parent = this.currentNoteParent; + const type = this.noteType; const text = n.text; let note = {}; if (content > '') { note = { content, - contentBlock, - text + block, + text, + type } } else { note = { diff --git a/client/src/graphql/client.js b/client/src/graphql/client.js index 7280a0e7..68c365c8 100644 --- a/client/src/graphql/client.js +++ b/client/src/graphql/client.js @@ -1,4 +1,4 @@ -import {InMemoryCache} from 'apollo-cache-inmemory/lib/index' +import {InMemoryCache, defaultDataIdFromObject} from 'apollo-cache-inmemory/lib/index' import {createHttpLink} from 'apollo-link-http' import {ApolloClient} from 'apollo-client' import {ApolloLink} from 'apollo-link' @@ -43,6 +43,14 @@ export default function (uri) { const composedLink = ApolloLink.from([createOmitTypenameLink, consoleLink, httpLink]); const cache = new InMemoryCache({ + dataIdFromObject: obj => { + switch (obj.__typename) { + case 'InstrumentNode': + return `${obj.__typename}:${obj.slug}`; + default: + return defaultDataIdFromObject(obj); + } + }, cacheRedirects: { Query: { contentBlock: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ContentBlockNode', id: args.id}), @@ -51,7 +59,7 @@ export default function (uri) { objective: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ObjectiveNode', id: args.id}), objectiveGroup: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ObjectiveGroupNode', id: args.id}), // todo: remove, the new client seems to cache this correctly by itself - // module: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ModuleNode', id: args.id}), + // module: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ModuleNode', id: args.slug}), projectEntry: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ProjectEntryNode', id: args.id}), } } diff --git a/client/src/graphql/gql/bookQuery.gql b/client/src/graphql/gql/bookQuery.gql deleted file mode 100644 index 77ecb36b..00000000 --- a/client/src/graphql/gql/bookQuery.gql +++ /dev/null @@ -1,32 +0,0 @@ -query BookQuery { - books { - edges { - node { - id - title - topics { - edges { - node { - id - title - slug - teaser - description - modules { - edges { - node { - id - title - slug - teaser - heroImage - } - } - } - } - } - } - } - } - } -} diff --git a/client/src/graphql/gql/fragments/instrumentParts.gql b/client/src/graphql/gql/fragments/instrumentParts.gql new file mode 100644 index 00000000..73c2bb1e --- /dev/null +++ b/client/src/graphql/gql/fragments/instrumentParts.gql @@ -0,0 +1,14 @@ +fragment InstrumentParts on InstrumentNode { + id + title + slug + bookmarks { + uuid + note { + id + text + } + } + type + contents +} diff --git a/client/src/graphql/gql/instrumentQuery.gql b/client/src/graphql/gql/instrumentQuery.gql index 2f7f0e07..c89e8fcf 100644 --- a/client/src/graphql/gql/instrumentQuery.gql +++ b/client/src/graphql/gql/instrumentQuery.gql @@ -1,9 +1,6 @@ +#import "./fragments/instrumentParts.gql" query InstrumentQuery($slug: String!){ instrument(slug: $slug) { - id - title - slug - type - contents + ...InstrumentParts } } diff --git a/client/src/graphql/gql/instrumentQueryById.gql b/client/src/graphql/gql/instrumentQueryById.gql new file mode 100644 index 00000000..f0fa658e --- /dev/null +++ b/client/src/graphql/gql/instrumentQueryById.gql @@ -0,0 +1,6 @@ +#import "./fragments/instrumentParts.gql" +query InstrumentQuery($id: ID!){ + instrument(id: $id) { + ...InstrumentParts + } +} diff --git a/client/src/graphql/gql/mutations/updateInstrumentBookmark.gql b/client/src/graphql/gql/mutations/updateInstrumentBookmark.gql new file mode 100644 index 00000000..17679013 --- /dev/null +++ b/client/src/graphql/gql/mutations/updateInstrumentBookmark.gql @@ -0,0 +1,5 @@ +mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) { + updateInstrumentBookmark(input: $input) { + success + } +} diff --git a/client/src/helpers/new-note-mutation.js b/client/src/helpers/new-note-mutation.js index 037bc11b..399e1cec 100644 --- a/client/src/helpers/new-note-mutation.js +++ b/client/src/helpers/new-note-mutation.js @@ -2,41 +2,68 @@ import ADD_NOTE_MUTATION from '@/graphql/gql/mutations/addNote.gql'; import CONTENT_BLOCK_QUERY from '@/graphql/gql/contentBlockQuery.gql'; import CHAPTER_QUERY from '@/graphql/gql/chapterQuery.gql'; import MODULE_QUERY from '@/graphql/gql/moduleByIdQuery.gql'; +import INSTRUMENT_FRAGMENT from '@/graphql/gql/fragments/instrumentParts.gql'; -const getBlockType = id => atob(id).split(':')[0] +const getBlockType = id => atob(id).split(':')[0]; +const compareUuid = note => element => element.uuid === note.content; export const constructNoteMutation = (n) => { let update = () => { }; - if (n.contentBlock) { // has a content block, so it is a content block bookmark + if (n.block) { // has a block, so it is a content block or instrument bookmark update = (store, {data: {addNote: {note}}}) => { - const query = CONTENT_BLOCK_QUERY; - const variables = {id: n.contentBlock}; - const data = store.readQuery({ - query, - variables - }); + if (n.type === 'ContentBlockNode') { + const query = CONTENT_BLOCK_QUERY; + const variables = {id: n.block}; + const data = store.readQuery({ + query, + variables + }); - const bookmarks = data.contentBlock.bookmarks; + const bookmarks = data.contentBlock.bookmarks; - let index = bookmarks.findIndex(element => { - return element.uuid === n.content; - }); + let index = bookmarks.findIndex(compareUuid(n)); - if (index > -1) { - let el = bookmarks[index]; - el.note = note; - bookmarks.splice(index, 1, el); + if (index > -1) { + let el = bookmarks[index]; + el.note = note; + bookmarks.splice(index, 1, el); + } + + data.contentBlock.bookmarks = bookmarks; + + store.writeQuery({ + data, + query, + variables + }); + } else { + const fragment = INSTRUMENT_FRAGMENT; + const id = `InstrumentNode:${n.block}`; + const data = store.readFragment({ + fragment, + id + }); + + const bookmarks = data.bookmarks; + + let index = bookmarks.findIndex(compareUuid(n)); + + if (index > -1) { + let el = bookmarks[index]; + el.note = note; + bookmarks.splice(index, 1, el); + } + + data.bookmarks = bookmarks; + + store.writeFragment({ + data, + fragment, + id + }); } - - data.contentBlock.bookmarks = bookmarks; - - store.writeQuery({ - data, - query, - variables - }); }; } else { // it's a chapter bookmark or a module bookmark update = (store, {data: {addNote: {note}}}) => { diff --git a/client/src/helpers/update-content-bookmark-mutation.js b/client/src/helpers/update-content-bookmark-mutation.js new file mode 100644 index 00000000..9a2253cd --- /dev/null +++ b/client/src/helpers/update-content-bookmark-mutation.js @@ -0,0 +1,111 @@ +import UPDATE_CONTENT_BOOKMARK from '@/graphql/gql/mutations/updateContentBookmark.gql'; +import UPDATE_INSTRUMENT_BOOKMARK from '@/graphql/gql/mutations/updateInstrumentBookmark.gql'; +import CONTENT_BLOCK_QUERY from '@/graphql/gql/contentBlockQuery.gql'; +import INSTRUMENT_FRAGMENT from '@/graphql/gql/fragments/instrumentParts.gql'; + +const compareUuid = uuid => element => element.uuid === uuid; + +export const constructContentComponentBookmarkMutation = (uuid, bookmarked, parent, root) => { + let mutation = {}; + + if (parent.__typename === 'ContentBlockNode') { + mutation = { + mutation: UPDATE_CONTENT_BOOKMARK, + variables: { + input: { + uuid, + contentBlock: root, + bookmarked + } + }, + update: (store, response) => { + const query = CONTENT_BLOCK_QUERY; + const variables = {id: root}; + const data = store.readQuery({ + query, + variables + }); + + const bookmarks = data.contentBlock.bookmarks; + + if (bookmarked) { + bookmarks.push({ + note: null, + uuid, + __typename: 'ContentBlockBookmarkNode' + }); + } else { + let index = bookmarks.findIndex(compareUuid(uuid)); + if (index > -1) { + bookmarks.splice(index, 1); + } + } + + data.contentBlock.bookmarks = bookmarks; + + store.writeQuery({ + data, + query, + variables + }); + }, + optimisticResponse: { + __typename: 'Mutation', + updateContentBookmark: { + __typename: 'UpdateContentBookmarkPayload', + success: true + } + } + } + } else { + mutation = { + mutation: UPDATE_INSTRUMENT_BOOKMARK, + variables: { + input: { + uuid, + instrument: root, + bookmarked + } + }, + update: (store, response) => { + const fragment = INSTRUMENT_FRAGMENT; + const id = `InstrumentNode:${root}`; + const data = store.readFragment({ + fragment, + id + }); + + const bookmarks = data.bookmarks; + + if (bookmarked) { + bookmarks.push({ + note: null, + uuid, + __typename: 'InstrumentBookmarkNode' + }) + } else { + let index = bookmarks.findIndex(compareUuid(uuid)); + if (index > -1) { + bookmarks.splice(index, 1); + } + } + + data.bookmarks = bookmarks; + + store.writeFragment({ + data, + fragment, + id + }); + }, + optimisticResponse: { + __typename: 'Mutation', + updateInstrumentBookmark: { + __typename: 'UpdateInstrumentBookmarkPayload', + success: true + } + } + }; + } + return mutation; +}; diff --git a/client/src/pages/instrument.vue b/client/src/pages/instrument.vue index 4d05d476..be5f7133 100644 --- a/client/src/pages/instrument.vue +++ b/client/src/pages/instrument.vue @@ -2,11 +2,15 @@

{{instrument.title}}

- - + +
@@ -14,17 +18,7 @@