delete comment from list and error message in alert

DemocraciaEnRed · Mar 6, 2024 · fa112c7 · fa112c7
1 parent 1027d4c
commit fa112c7
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 5 deletions.
diff --git a/src/components/pacto/body/pacto/comment.jsx b/src/components/pacto/body/pacto/comment.jsx
@@ -13,7 +13,7 @@ import { deleteComment } from "@/utils/delete-data";
 import { useAlert } from "@/context/alert-context";
 
 
-export default function Comment({ project, comment, urlComment, answerable }) {
+export default function Comment({ project, comment, urlComment, answerable, deleteCommentFromList }) {
     const [commentSelected, setCommentSelected] = useState(null)
     const [likes, setLikes] = useState(comment.likes || 0)
     const [dislikes, setDislikes] = useState(comment.dislikes || 0)
@@ -63,9 +63,15 @@ export default function Comment({ project, comment, urlComment, answerable }) {
 
         if (deleteTime) {
             clearTimeout(timeout)
-            await deleteComment(urlComment)
-            setDeleteTime(false)
-            removeAlert()
+            try {
+                await deleteComment(urlComment)
+                deleteCommentFromList(comment._id)
+                setDeleteTime(false)
+                removeAlert()
+            } catch (err) {
+                addAlert(err.message, 'danger')
+                console.error(err);
+            }
             return
         }
         setDeleteTime(true)

diff --git a/src/components/pacto/body/pacto/comments.jsx b/src/components/pacto/body/pacto/comments.jsx
@@ -37,6 +37,12 @@ export default function Comments({ project, comments }) {
         }
     }
 
+    const deleteCommentFromList = (commentId) => {
+        const newComentList = [...commentList]
+        let index = commentList.findIndex(comment => comment._id === commentId);
+        newComentList.splice(index, 1)
+        if (index !== -1) setCommensList(newComentList)
+    }   
 
     return (
         <div className={`comment-section ${project.version !== project.currentVersion ? 'disabled is-relative' : ''}`}>
@@ -72,7 +78,15 @@ export default function Comments({ project, comments }) {
             <hr />
             <div className="comment-list">
                 <div className="box">
-                    {commentList.length > 0 && commentList.map(comment => <Comment project={project} comment={comment} key={comment._id} urlComment={`/projects/${project._id}/comments/${comment._id}`} answerable />
+                    {commentList.length > 0 && commentList.map(comment =>
+                        <Comment
+                            project={project}
+                            comment={comment}
+                            key={comment._id}
+                            urlComment={`/projects/${project._id}/comments/${comment._id}`}
+                            deleteCommentFromList={deleteCommentFromList}
+                            answerable
+                        />
                     )}
                 </div>
                 {comments.total / comments.limit > 1 &&<Pagination

diff --git a/src/utils/delete-data.js b/src/utils/delete-data.js
@@ -14,6 +14,8 @@ export const deleteComment = async (url) => {
         console.error(err);
         const pathname = window.location.pathname
         if (err.response.status === 401) window.location.href = '/auth/login?next=' + pathname
+        let returnError = { status: err.response.status, message: err.response.data.message }
+        throw returnError
     }
 
 }