Rewrote the PostHelpers and put them in a utils folder

webapp/components/PostCard/index.vue

@@ -70,7 +70,7 @@ import HcCategory from '~/components/Category'
 import HcRibbon from '~/components/Ribbon'
 // import { randomBytes } from 'crypto'
 import { mapGetters } from 'vuex'
-import { postMenuModalsData, deletePostMutationData } from '~/components/utils/PostHelpers'
+import { postMenuModalsData, deletePostMutation } from '~/components/utils/PostHelpers'
 
 export default {
   name: 'HcPostCard',
@@ -113,7 +113,7 @@ export default {
   methods: {
     async deletePostCallback() {
       try {
-        await this.$apollo.mutate(deletePostMutationData(this.post.id))
+        await this.$apollo.mutate(deletePostMutation(this.post.id))
         this.$toast.success(this.$t('delete.contribution.success'))
         this.$emit('removePostFromList')
       } catch (err) {

webapp/components/utils/PostHelpers.js

@@ -1,43 +1,43 @@
 import gql from 'graphql-tag'
 
-export default {
-  postMenuModalsData(truncatedPostName, confirmCallback, cancelCallback = () => {}) {
-    return {
-      delete: {
-        titleIdent: 'delete.contribution.title',
-        messageIdent: 'delete.contribution.message',
-        messageParams: {
-          name: truncatedPostName,
+export function postMenuModalsData(truncatedPostName, confirmCallback, cancelCallback = () => {}) {
+  return {
+    delete: {
+      titleIdent: 'delete.contribution.title',
+      messageIdent: 'delete.contribution.message',
+      messageParams: {
+        name: truncatedPostName,
+      },
+      buttons: {
+        confirm: {
+          danger: true,
+          icon: 'trash',
+          textIdent: 'delete.submit',
+          callback: confirmCallback,
         },
-        buttons: {
-          confirm: {
-            danger: true,
-            icon: 'trash',
-            textIdent: 'delete.submit',
-            callback: confirmCallback,
-          },
-          cancel: {
-            icon: 'close',
-            textIdent: 'delete.cancel',
-            callback: cancelCallback,
-          },
+        cancel: {
+          icon: 'close',
+          textIdent: 'delete.cancel',
+          callback: cancelCallback,
         },
       },
-    }
-  },
-  deletePostMutationData(postId) {
-    var gqlMutation = gql`
-      mutation($id: ID!) {
-        DeletePost(id: $id) {
-          id
-        }
-      }
-    `
-    return {
-      mutation: gqlMutation,
-      variables: {
-        id: postId,
-      },
-    }
-  },
+    },
+  }
+}
+
+export function deletePostMutation(postId) {
+  // TODO: Replace "gqlMutation" with "DeletePost" from '~/graphql/PostMutations.js', has not worked for me.
+  var gqlMutation = gql`
+    mutation($id: ID!) {
+      DeletePost(id: $id) {
+        id
+      }
+    }
+  `
+  return {
+    mutation: gqlMutation,
+    variables: {
+      id: postId,
+    },
+  }
 }

webapp/graphql/PostMutations.js

@@ -2,7 +2,7 @@ import gql from 'graphql-tag'
 
 export default app => {
   return {
-    CreatePost: gql(`
+    CreatePost: gql`
       mutation($title: String!, $content: String!) {
         CreatePost(title: $title, content: $content) {
           id
@@ -12,8 +12,8 @@ export default app => {
           contentExcerpt
         }
       }
-    `),
-    UpdatePost: gql(`
+    `,
+    UpdatePost: gql`
       mutation($id: ID!, $title: String!, $content: String!) {
         UpdatePost(id: $id, title: $title, content: $content) {
           id
@@ -23,6 +23,13 @@ export default app => {
           contentExcerpt
         }
       }
-    `),
+    `,
+    DeletePost: gql`
+      mutation($id: ID!) {
+        DeletePost(id: $id) {
+          id
+        }
+      }
+    `,
   }
 }

webapp/pages/post/_id/_slug/index.vue

@@ -71,7 +71,7 @@ import HcUser from '~/components/User'
 import HcShoutButton from '~/components/ShoutButton.vue'
 import HcCommentForm from '~/components/comments/CommentForm'
 import HcCommentList from '~/components/comments/CommentList'
-import { postMenuModalsData, deletePostMutationData } from '~/components/utils/PostHelpers'
+import { postMenuModalsData, deletePostMutation } from '~/components/utils/PostHelpers'
 
 export default {
   name: 'PostSlug',
@@ -224,7 +224,7 @@ export default {
     },
     async deletePostCallback() {
       try {
-        await this.$apollo.mutate(deletePostMutationData(this.post.id))
+        await this.$apollo.mutate(deletePostMutation(this.post.id))
         this.$toast.success(this.$t('delete.contribution.success'))
         this.$router.history.push('/') // Redirect to index (main) page
       } catch (err) {