Refactored the PostHelpers to an imported lib instead a mixin

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 PostMutationHelpers from '~/mixins/PostMutationHelpers'
+import PostHelpers from '~/components/PostHelpers'
 
 export default {
   name: 'HcPostCard',
@@ -80,7 +80,6 @@ export default {
     HcRibbon,
     ContentMenu,
   },
-  mixins: [PostMutationHelpers],
   props: {
     post: {
       type: Object,
@@ -103,6 +102,24 @@ export default {
       if (!author) return false
       return this.user.id === this.post.author.id
     },
+    menuModalsData() {
+      // "this.post" may not always be defined at the beginning …
+      return PostHelpers.postMenuModalsData(
+        this.post ? this.$filters.truncate(this.post.title, 30) : '',
+        this.deletePostCallback,
+      )
+    },
+  },
+  methods: {
+    async deletePostCallback() {
+      try {
+        await this.$apollo.mutate(PostHelpers.deletePostMutationData(this.post.id))
+        this.$toast.success(this.$t('delete.contribution.success'))
+        this.$emit('deletePost')
+      } catch (err) {
+        this.$toast.error(err.message)
+      }
+    },
   },
 }
 </script>

webapp/components/PostHelpers.js

@@ -0,0 +1,42 @@
+import gql from 'graphql-tag'
+
+export default {
+  postMenuModalsData: (postNameShort, confirmCallback) => {
+    return {
+      delete: {
+        titleIdent: 'delete.contribution.title',
+        messageIdent: 'delete.contribution.message',
+        messageParams: {
+          name: postNameShort,
+        },
+        buttons: {
+          confirm: {
+            icon: 'trash',
+            textIdent: 'delete.submit',
+            callback: confirmCallback,
+          },
+          cancel: {
+            icon: 'close',
+            textIdent: 'delete.cancel',
+            callback: () => {},
+          },
+        },
+      },
+    }
+  },
+  deletePostMutationData(postId) {
+    var gqlMutation = gql`
+      mutation($id: ID!) {
+        DeletePost(id: $id) {
+          id
+        }
+      }
+    `
+    return {
+      mutation: gqlMutation,
+      variables: {
+        id: postId,
+      },
+    }
+  },
+}

webapp/mixins/PostMutationHelpers.js

@@ -1,61 +0,0 @@
-import gql from 'graphql-tag'
-
-export default {
-  data() {
-    return {
-      menuModalsData: {
-        delete: {
-          titleIdent: 'delete.contribution.title',
-          messageIdent: 'delete.contribution.message',
-          messageParams: {
-            // "this.post" is not defined at the beginning …
-            name: this.post ? this.$filters.truncate(this.post.title, 30) : '',
-          },
-          buttons: {
-            confirm: {
-              icon: 'trash',
-              textIdent: 'delete.submit',
-              callback: this.deletePostCallback,
-            },
-            cancel: {
-              icon: 'close',
-              textIdent: 'delete.cancel',
-              callback: () => {},
-            },
-          },
-        },
-      },
-    }
-  },
-  methods: {
-    async deletePostCallback(postDisplayType = 'list') {
-      try {
-        var gqlMutation = gql`
-          mutation($id: ID!) {
-            DeletePost(id: $id) {
-              id
-            }
-          }
-        `
-        await this.$apollo.mutate({
-          mutation: gqlMutation,
-          variables: {
-            id: this.post.id,
-          },
-        })
-        this.$toast.success(this.$t('delete.contribution.success'))
-        switch (postDisplayType) {
-          case 'list':
-            this.$emit('deletePost')
-            break
-          default:
-            // case 'page':
-            this.$router.history.push('/') // Single page type: Redirect to index (main) page
-            break
-        }
-      } catch (err) {
-        this.$toast.error(err.message)
-      }
-    },
-  },
-}

webapp/pages/post/_id/_slug/index.spec.js

@@ -56,7 +56,7 @@ describe('PostSlug', () => {
 
     beforeEach(jest.useFakeTimers)
 
-    describe('test mixin "PostMutationHelpers"', () => {
+    describe('test "PostHelpers"', () => {
       beforeEach(() => {
         wrapper = Wrapper()
         wrapper.setData({

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

@@ -13,7 +13,7 @@
           placement="bottom-end"
           resource-type="contribution"
           :resource="post"
-          :modalsData="menuModalsDataPage()"
+          :modalsData="menuModalsData"
           :is-owner="isAuthor(post.author.id)"
         />
       </no-ssr>
@@ -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 PostMutationHelpers from '~/mixins/PostMutationHelpers'
+import PostHelpers from '~/components/PostHelpers'
 
 export default {
   name: 'PostSlug',
@@ -88,7 +88,6 @@ export default {
     HcCommentForm,
     HcCommentList,
   },
-  mixins: [PostMutationHelpers],
   head() {
     return {
       title: this.title,
@@ -210,14 +209,27 @@ export default {
       this.ready = true
     }, 50)
   },
+  computed: {
+    // "this.post" may not always be defined at the beginning …
+    menuModalsData() {
+      return PostHelpers.postMenuModalsData(
+        this.post ? this.$filters.truncate(this.post.title, 30) : '',
+        this.deletePostCallback,
+      )
+    },
+  },
   methods: {
     isAuthor(id) {
       return this.$store.getters['auth/user'].id === id
     },
-    menuModalsDataPage() {
+    async deletePostCallback() {
-      const locMenuModalsData = this.menuModalsData
+      try {
-      locMenuModalsData.delete.buttons.confirm.callback = () => this.deletePostCallback('page')
+        await this.$apollo.mutate(PostHelpers.deletePostMutationData(this.post.id))
-      return locMenuModalsData
+        this.$toast.success(this.$t('delete.contribution.success'))
+        this.$router.history.push('/') // Redirect to index (main) page
+      } catch (err) {
+        this.$toast.error(err.message)
+      }
     },
   },
 }

webapp/pages/profile/_id/_slug.spec.js

@@ -46,7 +46,7 @@ describe('ProfileSlug', () => {
 
     beforeEach(jest.useFakeTimers)
 
-    describe('test mixin "PostMutationHelpers"', () => {
+    describe('test "PostHelpers"', () => {
       beforeEach(() => {
         wrapper = Wrapper()
       })
@@ -60,7 +60,7 @@ describe('ProfileSlug', () => {
           beforeEach(jest.runAllTimers)
 
           it('emits "deletePost"', () => {
-            expect(wrapper.emitted().deletePost.length).toBe(1)
+            expect(wrapper.emitted().deletePost).toHaveLength(1)
           })
 
           it('does not go to index (main) page', () => {