eh

client/src/components/History.js

@@ -1,27 +1,22 @@
 import React, { useState, useEffect } from "react";
 import { useParams } from "react-router-dom";
-import { Card, CardContent, Typography } from "@mui/material";
+import { Card, CardContent, Typography, Button } from "@mui/material";
 
 const serverUrl = process.env.REACT_APP_SERVER_URL;
 
 const UserAnswers = () => {
     const { username } = useParams();
     const [userAnswers, setUserAnswers] = useState([]);
 
-
-
     useEffect(() => {
         const fetchUserAnswers = async () => {
             try {
-                const response = await fetch(`${serverUrl}/get_user_answers`);
+                const response = await fetch(`${serverUrl}/get_user_answers?username=${username}`);
                 if (!response.ok) {
                     throw new Error("Failed to fetch user answers");
                 }
                 const data = await response.json();
                 setUserAnswers(data);
-                console.log(data)
-                console.log(username)
-
             } catch (error) {
                 console.error("Error fetching user answers:", error);
             }
@@ -30,6 +25,18 @@ const UserAnswers = () => {
         fetchUserAnswers();
     }, [username]);
 
+    const handleDeletePost = async (postId, answer1, answer2, answer3) => {
+        try {
+            const response = await fetch(`${serverUrl}/get_user_answers?answer1=${answer1}&answer2=${answer2}&answer3=${answer3}`);
+            if (!response.ok) {
+                throw new Error("Failed to delete post");
+            }
+            setUserAnswers(userAnswers.filter((answer) => answer._id !== postId));
+        } catch (error) {
+            console.error("Error deleting post:", error);
+        }
+    };
+
     return (
         <div className="flex flex-col items-center justify-center space-y-4">
             <Typography variant="h4" component="h1" className="mb-4">
@@ -53,6 +60,14 @@ const UserAnswers = () => {
                         <Typography variant="body1" component="p">
                             {answer.answer4}
                         </Typography>
+                        <Button
+                            onClick={() =>
+                                handleDeletePost(answer._id, answer.answer1, answer.answer2, answer.answer3)
+                            }
+                            color="error"
+                        >
+                            Delete
+                        </Button>
                     </CardContent>
                 </Card>
             ))}

server/accounts.js

@@ -148,6 +148,21 @@ const getAnswers = async (req, res) => {
   res.status(200).send(answers);
 }
 
+const deleteAnswer = async (req, res) => {
+  const db = await getDB();
+  const username = getUserFromSession(req.session) ?? "";
+  const answer1 = req.query?.answer1 ?? undefined;
+  const answer2 = req.query?.answer2 ?? undefined;
+  const answer3 = req.query?.answer3 ?? undefined;
+  const answers = await db.collection('answers').deleteOne({
+    username: username,
+    answer1: answer1,
+    answer2: answer2,
+    answer3: answer3,
+  });
+  res.status(200).send(answers);
+}
+
 
 module.exports = {
   closeMongoDBConnection,
@@ -161,5 +176,6 @@ module.exports = {
   //   updateProfilePicture,
   createAnswers,
   getAllAnswers,
-  getAnswers
+  getAnswers,
+  deleteAnswer
 };

server/server.js

@@ -44,6 +44,8 @@ app.post('/logout', accounts.logoutAccount);
 app.post('/update_answer', accounts.createAnswers);
 app.get('/get_answers', accounts.getAllAnswers);
 app.get('/get_user_answers', accounts.getAnswers);
+app.get('/delete_one_answer', accounts.deleteAnswer);
+