added like dislike feature in frontend for ques and answer

Dushyantbha012 · Feb 24, 2024 · 61fee8c · 61fee8c
1 parent 2376842
commit 61fee8c
Show file tree

Hide file tree

Showing 4 changed files with 79 additions and 22 deletions.
diff --git a/Backend-Realm/routers/questionRouters/questionRouters.js b/Backend-Realm/routers/questionRouters/questionRouters.js
@@ -99,56 +99,60 @@ questionRouters.post("/question",authMiddleware,async(req,res)=>{
 })
 
 questionRouters.post("/likeques",authMiddleware,async(req,res)=>{
-    //try{
+  console.log("request reached likeques")  
+  try{
         const quesId = req.body.quesId;
 
     await Question.findByIdAndUpdate(
         quesId,
         { $inc: { likes: 1 } }, 
         { new: true });
-        return res.json({message:"Liked"})
-   // }
-    //catch{
-        //res.status(410).json({message:"Error"})
-    //}
+        return res.status(200).json({message:"Liked"})
+   }
+    catch{
+        res.status(410).json({message:"Error"})
+    }
 })
 
 questionRouters.post("/dislikeques",authMiddleware,async(req,res)=>{
-    try{
+  console.log("request reached dislikeques")    
+  try{
         const quesId = req.body.quesId;
 
     await Question.findByIdAndUpdate(
         quesId,
         { $inc: { dislikes: 1 } }, 
 
         { new: true });
-        return res.json({message:"Disliked"})
+        return res.status(200).json({message:"Disliked"})
     }catch{
         res.status(410).json({message:"Error"})
     }
 })
 questionRouters.post("/likeanswer",authMiddleware,async(req,res)=>{
-    try{
+  console.log("request reached likeans")    
+  try{
         const ansId = req.body.ansId;
 
     await Answer.findByIdAndUpdate(
         ansId,
         { $inc: { likes: 1 } }, 
         { new: true });
-        return res.json({message:"Liked"})
+        return res.status(200).json({message:"Liked"})
     }catch{
         res.status(410).json({message:"Error"})
     }
 })
 questionRouters.post("/dislikeanswer",authMiddleware,async(req,res)=>{
+  console.log("request reached dislikeans")   
     try{
         const ansId = req.body.ansId;
 
     await Answer.findByIdAndUpdate(
         ansId,
         { $inc: { dislikes: 1 } }, 
         { new: true });
-        return res.json({message:"Disliked"})
+        return res.status(200).json({message:"Disliked"})
     }catch{
         res.status(410).json({message:"Error"})
     }

diff --git a/Frontend-Realm/src/components/QuestionPage/AnswerList/AnswerItem.jsx b/Frontend-Realm/src/components/QuestionPage/AnswerList/AnswerItem.jsx
@@ -1,14 +1,43 @@
-import React from 'react'
+import React from "react";
+import axios from "axios"
 
-function AnswerItem({content="", author="", likes=0 ,dislikes=0, ansdbId=""}) {
+function AnswerItem({
+  content = "",
+  author = "",
+  likes = 0,
+  dislikes = 0,
+  ansdbId = "",
+}){
+  const likeAnswer = async () => {
+    const res = await axios({
+      method: "POST",
+      url: "http://localhost:3000/api/question/likeanswer",
+      data: {ansId:ansdbId},
+      headers: { Authorization: localStorage.getItem("token") },
+    });
+    if(res.status===200){
+      window.location.reload(false);
+    }
+  };
+  const dislikeAnswer = async () => {
+    const res = await axios({
+      method: "POST",
+      url: "http://localhost:3000/api/question/dislikeanswer",
+      data: {ansId:ansdbId},
+      headers: { Authorization: localStorage.getItem("token") },
+    });
+    if(res.status===200){
+      window.location.reload(false);
+    }
+  };
   return (
     <div>
-        <div>{content}</div>
-        <div>{author}</div>
-        <div>{likes}</div>
-        <div>{dislikes}</div>
+      <div>{content}</div>
+      <div>{author}</div>
+      <div onClick={likeAnswer}>{likes}</div>
+      <div onClick={dislikeAnswer}>{dislikes}</div>
     </div>
-  )
+  );
 }
 
-export default AnswerItem
+export default AnswerItem;
diff --git a/Frontend-Realm/src/components/QuestionPage/AnswerList/AnswerList.jsx b/Frontend-Realm/src/components/QuestionPage/AnswerList/AnswerList.jsx
@@ -42,13 +42,37 @@ function AnswerList() {
       }
     }
   };
+
+  const likeQues = async () => {
+    const res = await axios({
+      method: "POST",
+      url: "http://localhost:3000/api/question/likeques",
+      data: {quesId:localStorage.getItem("quesId")},
+      headers: { Authorization: localStorage.getItem("token") },
+    });
+    if(res.status===200){
+      window.location.reload(false);
+    }
+  };
+  const dislikeQues = async () => {
+    const res = await axios({
+      method: "POST",
+      url: "http://localhost:3000/api/question/dislikeques",
+      data: {quesId:localStorage.getItem("quesId")},
+      headers: { Authorization: localStorage.getItem("token") },
+    });
+    if(res.status===200){
+      window.location.reload(false);
+    }
+  };
+
   return (
     <div>
       <div>
         <div>{data.title}</div>
         <div>{data.author}</div>
-        <div>{data.likes}</div>
-        <div>{data.dislikes}</div>
+        <div onClick={likeQues}>{data.likes}</div>
+        <div onClick={dislikeQues}>{data.dislikes}</div>
       </div>
       <div>
         {data.answers.map((answer) => (

diff --git a/Frontend-Realm/src/components/QuestionPage/QuestionList/QuestionItem.jsx b/Frontend-Realm/src/components/QuestionPage/QuestionList/QuestionItem.jsx
@@ -6,7 +6,7 @@ function QuestionItem({author, dislikes, likes, title, quesId}) {
     localStorage.setItem("quesId",quesId);
     navigateTo("/answer")
   }
-
+  
   return (
     <div><div onClick={onClickHandeler}>{title}</div></div>
   )