Add comment bulk delete feature

app/api/views.py

@@ -311,6 +311,11 @@ class CommentListProject(generics.ListAPIView):
         )
         return queryset
 
+    def delete(self, request, *args, **kwargs):
+        delete_ids = request.data['ids']
+        self.model.objects.filter(user=request.user, pk__in=delete_ids).delete()
+        return Response(status=status.HTTP_204_NO_CONTENT)
+
 
 class CommentDetail(generics.RetrieveUpdateDestroyAPIView):
     queryset = Comment.objects.all()

frontend/components/containers/comments/CommentList.vue

@@ -128,6 +128,14 @@ export default {
       this.isLoading = true
       this.comments = await this.service.listProjectComment(this.$route.params.id, this.search)
       this.isLoading = false
+    },
+
+    async remove() {
+      this.isLoading = true
+      const items = CommentItemList.valueOf(this.selected)
+      await this.service.deleteBulk(this.$route.params.id, items)
+      this.comments.deleteBulk(items)
+      this.isLoading = false
     }
   }
 }

frontend/models/comment.ts

@@ -18,10 +18,19 @@ export class CommentItemList {
     this.commentItems = this.commentItems.filter(comment => comment.id !== item.id)
   }
 
+  deleteBulk(items: CommentItemList) {
+    const ids = items.ids()
+    this.commentItems = this.commentItems.filter(comment => !ids.includes(comment.id))
+  }
+
   count(): Number {
     return this.commentItems.length
   }
 
+  ids(): Number[]{
+    return this.commentItems.map(item => item.id)
+  }
+
   toArray(): Object[] {
     return this.commentItems.map(item => item.toObject())
   }

frontend/repositories/comment/api.ts

@@ -40,8 +40,8 @@ export class FromApiCommentItemListRepository implements CommentItemListReposito
     const response = await this.request.delete(url)
   }
 
-  async deleteBulk(projectId: string, docId: string, items: CommentItemList): Promise<void> {
-    const url = `/projects/${projectId}/docs/${docId}/comments`
-    await this.request.delete(url)
+  async deleteBulk(projectId: string, items: CommentItemList): Promise<void> {
+    const url = `/projects/${projectId}/comments`
+    await this.request.delete(url, { ids: items.ids() })
   }
 }

frontend/repositories/comment/interface.ts

@@ -21,5 +21,5 @@ export interface CommentItemListRepository {
 
   delete(projectId: string, docId: string, item: CommentItem): Promise<void>
 
-  deleteBulk(projectId: string, docId: string, items: CommentItemList): Promise<void>
+  deleteBulk(projectId: string, items: CommentItemList): Promise<void>
 }

frontend/services/api.service.js

@@ -40,8 +40,8 @@ class ApiService {
     return this.request('PATCH', url, data, config)
   }
 
-  delete(url, config = {}) {
-    return this.request('DELETE', url, {}, config)
+  delete(url, data, config = {}) {
+    return this.request('DELETE', url, data, config)
   }
 }
 

frontend/services/application/comment.service.ts

@@ -26,7 +26,7 @@ export class CommentApplicationService {
     return this.repository.delete(projectId, docId, item)
   }
 
-  public deleteBulk(projectId: string, docId: string, items: CommentItemList): Promise<void> {
-    return this.repository.deleteBulk(projectId, docId, items)
+  public deleteBulk(projectId: string, items: CommentItemList): Promise<void> {
+    return this.repository.deleteBulk(projectId, items)
   }
 }