Update bookmark mutation generator function

client/cypress/e2e/frontend/bookmarks.spec.js

@@ -38,6 +38,7 @@ describe('Bookmarks', () => {
         ModuleEditModeQuery: {},
         InstrumentQuery: {
           instrument: {
+            bookmarks: [],
             contents: [
               {
                 type: 'text_block',

client/src/__generated__/gql.ts

@@ -34,8 +34,8 @@ const documents = {
     "\n  mutation AddContentHighlight($input: AddContentHighlightInput!) {\n    addContentHighlight(input: $input) {\n      __typename\n      highlight {\n        ...HighlightParts\n      }\n    }\n  }\n": types.AddContentHighlightDocument,
     "\n              fragment InstrumentHighlightsWithIdOnlyFragment on InstrumentNode {\n                highlights {\n                  id\n                }\n              }\n            ": types.InstrumentHighlightsWithIdOnlyFragmentFragmentDoc,
     "\n              fragment ContentBlockHighlightsWithIdOnlyFragment on ContentBlockNode {\n                highlights {\n                  id\n                }\n              }\n            ": types.ContentBlockHighlightsWithIdOnlyFragmentFragmentDoc,
-    "\n        mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n          updateInstrumentBookmark(input: $input) {\n            success\n          }\n        }\n      ": types.UpdateInstrumentBookmarkDocument,
+    "\n      mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n        updateInstrumentBookmark(input: $input) {\n          success\n        }\n      }\n    ": types.UpdateInstrumentBookmarkDocument,
-    "\n        mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n          updateContentBookmark(input: $input) {\n            success\n          }\n        }\n      ": types.UpdateContentBookmarkDocument,
+    "\n      mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n        updateContentBookmark(input: $input) {\n          success\n        }\n      }\n    ": types.UpdateContentBookmarkDocument,
     "\n    query MyActivitiesQuery {\n      myActivities {\n        instruments {\n          id\n          slug\n          title\n          path\n          highlights {\n            ...HighlightParts\n          }\n          bookmarks {\n            ... on InstrumentBookmarkNode {\n              path\n            }\n          }\n        }\n        topics {\n          id\n          title\n          modules {\n            id\n            slug\n            title\n            metaTitle\n            myHighlights {\n              ...HighlightParts\n            }\n            myBookmarks {\n              ... on ChapterBookmarkNode {\n                chapter {\n                  path\n                }\n                path\n                note {\n                  id\n                  text\n                }\n              }\n              ... on ContentBlockBookmarkNode {\n                id\n                uuid\n                path\n                contentBlock {\n                  id\n                  path\n                }\n                note {\n                  id\n                  text\n                }\n              }\n              ... on ModuleBookmarkNode {\n                path\n                note {\n                  id\n                  text\n                }\n              }\n            }\n            mySubmissions {\n              id\n              text\n              assignment {\n                id\n                title\n                path\n                module {\n                  slug\n                }\n              }\n            }\n            myAnswers {\n              id\n              survey {\n                path\n                id\n                title\n              }\n            }\n          }\n        }\n      }\n    }\n  ": types.MyActivitiesQueryDocument,
     "\n    query ChapterQuery($id: ID!) {\n      chapter(id: $id) {\n        path\n      }\n    }\n  ": types.ChapterQueryDocument,
     "\n    query ContentBlockQuery($id: ID!) {\n      contentBlock(id: $id) {\n        path\n      }\n    }\n  ": types.ContentBlockQueryDocument,
@@ -148,11 +148,11 @@ export function graphql(source: "\n              fragment ContentBlockHighlights
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n        mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n          updateInstrumentBookmark(input: $input) {\n            success\n          }\n        }\n      "): (typeof documents)["\n        mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n          updateInstrumentBookmark(input: $input) {\n            success\n          }\n        }\n      "];
+export function graphql(source: "\n      mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n        updateInstrumentBookmark(input: $input) {\n          success\n        }\n      }\n    "): (typeof documents)["\n      mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n        updateInstrumentBookmark(input: $input) {\n          success\n        }\n      }\n    "];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n        mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n          updateContentBookmark(input: $input) {\n            success\n          }\n        }\n      "): (typeof documents)["\n        mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n          updateContentBookmark(input: $input) {\n            success\n          }\n        }\n      "];
+export function graphql(source: "\n      mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n        updateContentBookmark(input: $input) {\n          success\n        }\n      }\n    "): (typeof documents)["\n      mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n        updateContentBookmark(input: $input) {\n          success\n        }\n      }\n    "];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */

client/src/components/content-blocks/ContentComponent.vue

@@ -198,25 +198,21 @@ const editNote = () => {
   store.dispatch('editNote', note);
 };
 
-const { mutation, variables, update, optimisticResponse } = constructContentComponentBookmarkMutation(
+const { mutation, updateCurry, getVariables, optimisticResponse } = constructContentComponentBookmarkMutation(
   props.component.id,
-  bookmarked.value,
   props.parent,
   props.root
 );
 const { mutate: mutateBookmarkContent } = useMutation(mutation, {
-  update,
   optimisticResponse,
 });
 
 const bookmarkContent = (bookmarked: boolean) => {
-  const newVars = {
+  const variables = getVariables(bookmarked);
-    input: {
+  const update = updateCurry(bookmarked);
-      ...variables.input,
+  mutateBookmarkContent(variables, {
-      bookmarked,
+    update,
-    },
+  });
-  };
-  mutateBookmarkContent(newVars);
 };
 
 const markHighlights = () => {

client/src/helpers/update-content-bookmark-mutation.ts

@@ -4,150 +4,156 @@ import { pushToArray, removeAtIndex } from '@/graphql/immutable-operations';
 import { graphql } from '@/__generated__';
 
 const compareUuid = (uuid: string) => (element) => element.uuid === uuid;
+type UpdateCurry = (newBookmarkedValue: boolean) => (store) => void;
+type GetVariables = (newBookmarkedValue: boolean) => any;
 
 interface Mutation {
   mutation: any;
-  variables: any;
-  update: (store: any) => void;
   optimisticResponse: any;
+  updateCurry: UpdateCurry;
+  getVariables: GetVariables;
 }
 
-export const constructContentComponentBookmarkMutation: (
+export const constructContentComponentBookmarkMutation: (uuid: string, parent: any, root: any) => Mutation = (
-  uuid: string,
+  uuid,
-  bookmarked: boolean,
+  parent,
-  parent: any,
+  root
-  root: any
+) => {
-) => Mutation = (uuid, bookmarked, parent, root) => {
+  let mutation: any;
-  let mutation: Mutation;
+  let updateCurry: UpdateCurry;
+  let getVariables: GetVariables;
+  let optimisticResponse: any;
 
   if (parent.__typename === 'InstrumentNode') {
-    mutation = {
+    updateCurry = (newBookmarkedValue: boolean) => (store) => {
-      mutation: graphql(`
+      const fragment = INSTRUMENT_FRAGMENT;
-        mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {
+      const id = store.identify({
-          updateInstrumentBookmark(input: $input) {
+        __typename: 'InstrumentNode',
-            success
+        slug: root,
-          }
+      });
+      const instrument = store.readFragment({
+        fragment,
+        id,
+      });
+
+      let bookmarks: any[];
+      console.log(newBookmarkedValue);
+
+      if (newBookmarkedValue) {
+        const element = {
+          note: null,
+          uuid,
+          __typename: 'InstrumentBookmarkNode',
+        };
+        bookmarks = pushToArray(instrument.bookmarks, element);
+      } else {
+        const index = instrument.bookmarks.findIndex(compareUuid(uuid));
+        if (index > -1) {
+          bookmarks = removeAtIndex(instrument.bookmarks, index);
+        } else {
+          bookmarks = [...instrument.bookmarks];
         }
-      `),
+      }
-      variables: {
+
+      const data = {
+        ...instrument,
+        bookmarks,
+      };
+      console.log(data);
+
+      store.writeFragment({
+        data,
+        fragment,
+        id,
+      });
+    };
+    getVariables = (newBookmarkedValue: boolean) => {
+      return {
         input: {
           uuid,
           instrument: root,
-          bookmarked,
+          bookmarked: newBookmarkedValue,
         },
-      },
+      };
-      update: (store) => {
+    };
-        const fragment = INSTRUMENT_FRAGMENT;
+    mutation = graphql(`
-        const id = store.identify({
+      mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {
-          __typename: 'InstrumentNode',
+        updateInstrumentBookmark(input: $input) {
-          slug: root,
+          success
-        });
-        const instrument = store.readFragment({
-          fragment,
-          id,
-        });
-
-        let bookmarks: any[];
-
-        if (bookmarked) {
-          const element = {
-            note: null,
-            uuid,
-            __typename: 'InstrumentBookmarkNode',
-          };
-          bookmarks = pushToArray(instrument.bookmarks, element);
-        } else {
-          const index = instrument.bookmarks.findIndex(compareUuid(uuid));
-          if (index > -1) {
-            bookmarks = removeAtIndex(instrument.bookmarks, index);
-          } else {
-            bookmarks = [...instrument.bookmarks];
-          }
         }
-
+      }
-        const data = {
+    `);
-          ...instrument,
+    optimisticResponse = {
-          bookmarks,
+      __typename: 'Mutation',
-        };
+      updateInstrumentBookmark: {
-
+        __typename: 'UpdateInstrumentBookmarkPayload',
-        store.writeFragment({
+        success: true,
-          data,
-          fragment,
-          id,
-        });
-      },
-      optimisticResponse: {
-        __typename: 'Mutation',
-        updateInstrumentBookmark: {
-          __typename: 'UpdateInstrumentBookmarkPayload',
-          success: true,
-        },
       },
     };
   } else {
-    mutation = {
+    updateCurry = (newBookmarkedValue: boolean) => (store) => {
-      mutation: graphql(`
+      const query = CONTENT_BLOCK_QUERY;
-        mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {
+      const variables = { id: root };
-          updateContentBookmark(input: $input) {
+      const { contentBlock } = store.readQuery({
-            success
+        query,
-          }
+        variables,
+      });
+
+      // const bookmarks = data.contentBlock.bookmarks;
+      let bookmarks: any[];
+
+      if (newBookmarkedValue) {
+        const element = {
+          note: null,
+          uuid,
+          __typename: 'ContentBlockBookmarkNode',
+        };
+        bookmarks = pushToArray(contentBlock.bookmarks, element);
+      } else {
+        const index = contentBlock.bookmarks.findIndex(compareUuid(uuid));
+        if (index > -1) {
+          bookmarks = removeAtIndex(contentBlock.bookmarks, index);
+        } else {
+          bookmarks = [...contentBlock.bookmarks];
         }
-      `),
+      }
-      variables: {
+
+      const data = {
+        contentBlock: {
+          ...contentBlock,
+          bookmarks,
+        },
+      };
+
+      store.writeQuery({
+        data,
+        query,
+        variables,
+      });
+    };
+    getVariables = (newBookmarkedValue: boolean) => {
+      return {
         input: {
           uuid,
           contentBlock: root,
-          bookmarked,
+          bookmarked: newBookmarkedValue,
         },
-      },
+      };
-      update: (store) => {
+    };
-        const query = CONTENT_BLOCK_QUERY;
+    mutation = graphql(`
-        const variables = { id: root };
+      mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {
-        const { contentBlock } = store.readQuery({
+        updateContentBookmark(input: $input) {
-          query,
+          success
-          variables,
-        });
-
-        // const bookmarks = data.contentBlock.bookmarks;
-        let bookmarks: any[];
-
-        if (bookmarked) {
-          const element = {
-            note: null,
-            uuid,
-            __typename: 'ContentBlockBookmarkNode',
-          };
-          bookmarks = pushToArray(contentBlock.bookmarks, element);
-        } else {
-          const index = contentBlock.bookmarks.findIndex(compareUuid(uuid));
-          if (index > -1) {
-            bookmarks = removeAtIndex(contentBlock.bookmarks, index);
-          } else {
-            bookmarks = [...contentBlock.bookmarks];
-          }
         }
-
+      }
-        const data = {
+    `);
-          contentBlock: {
+    optimisticResponse = {
-            ...contentBlock,
+      __typename: 'Mutation',
-            bookmarks,
+      updateContentBookmark: {
-          },
+        __typename: 'UpdateContentBookmarkPayload',
-        };
+        success: true,
-
-        store.writeQuery({
-          data,
-          query,
-          variables,
-        });
-      },
-      optimisticResponse: {
-        __typename: 'Mutation',
-        updateContentBookmark: {
-          __typename: 'UpdateContentBookmarkPayload',
-          success: true,
-        },
       },
     };
   }
-  return mutation;
+  return { mutation, updateCurry, getVariables, optimisticResponse };
 };