Investigation how to update the Comments List intelligent

webapp/components/Comment.vue

@@ -19,6 +19,7 @@
       <content-menu
         placement="bottom-end"
         resource-type="comment"
+        :deleteCallback="deleteCallback"
         :resource="comment"
         style="float-right"
         :is-owner="isAuthor(author.id)"
@@ -69,6 +70,9 @@ export default {
   methods: {
     isAuthor(id) {
       return this.user.id === id
+    },
+    deleteCallback() {
+      console.log('"deleteCallback" was called !!!')
     }
   }
 }

webapp/components/Modal.vue

@@ -18,6 +18,7 @@
       v-if="open === 'delete'"
       :id="data.resource.id"
       :type="data.type"
+      :deleteCallback="deleteCallback"
       :name="name"
       @close="close"
     />
@@ -37,6 +38,10 @@ export default {
     ReportModal,
     DeleteModal
   },
+  props: {
+    deleteCallback: { type: Function, required: true },
+    cancelCallback: { type: Function, default: null }
+  },
   computed: {
     ...mapGetters({
       data: 'modal/data',

webapp/components/Modal/DeleteModal.vue

@@ -53,6 +53,8 @@ export default {
   props: {
     name: { type: String, default: '' },
     type: { type: String, required: true },
+    deleteCallback: { type: Function, required: true },
+    cancelCallback: { type: Function, default: null },
     id: { type: String, required: true }
   },
   data() {
@@ -116,12 +118,23 @@ export default {
           setTimeout(() => {
             this.success = false
             this.$emit('close')
-            if (this.$router.history.current.name === 'post-id-slug') {
+            switch (this.type) {
-              // redirect to index
+              case 'contribution':
-              this.$router.history.push('/')
+                if (this.$router.history.current.name === 'post-id-slug') {
-            } else {
+                  // redirect to index
-              // reload the page (when deleting from profile or index)
+                  this.$router.history.push('/')
-              window.location.assign(window.location.href)
+                } else {
+                  // reload the page (when deleting from profile or index)
+                  window.location.assign(window.location.href)
+                }
+                break
+              case 'comment':
+                // reload the page
+                // window.location.assign(window.location.href)
+                console.log('Remove comment emit !!!')
+                // this.$parent.$parent.$emit('deleteComment')
+                this.deleteCallback()
+                break
             }
           }, 500)
         }, 1500)

webapp/components/comments/CommentList/index.vue

@@ -19,10 +19,18 @@
       class="comments"
     >
       <comment
-        v-for="comment in comments"
+        v-for="(comment, index) in comments"
         :key="comment.id"
         :comment="comment"
+        @deleteComment="deleteComment(index)"
       />
+      <!-- <comment
+        is="comment-item"
+        v-for="(comment, index) in comments"
+        :key="comment.id"
+        :comment="comment"
+        v-on:remove="comments.splice(index, 1)"
+      /> -->
     </div>
     <hc-empty
       v-else
@@ -61,6 +69,10 @@ export default {
   methods: {
     refetchPostComments(comment) {
       this.$apollo.queries.Post.refetch()
+    },
+    deleteComment(index) {
+      console.log('Remove comment event !!!')
+      this.comments.splice(index, 1)
     }
   },
   apollo: {