From 5db1bc00488ec280af507872e8575388b3904d40 Mon Sep 17 00:00:00 2001 From: swayamName1 Date: Sun, 26 May 2024 21:03:09 +0530 Subject: [PATCH 1/2] Integrated Delete Faq with Backend #679 --- .../src/pages/Admin/Components/Faq/Faq.jsx | 19 +++-- .../Components/Faq/ManageFaq/ManageFaq.jsx | 84 +++++++++++++++++-- 2 files changed, 85 insertions(+), 18 deletions(-) diff --git a/frontend/src/pages/Admin/Components/Faq/Faq.jsx b/frontend/src/pages/Admin/Components/Faq/Faq.jsx index 8c17f678..f56e7029 100644 --- a/frontend/src/pages/Admin/Components/Faq/Faq.jsx +++ b/frontend/src/pages/Admin/Components/Faq/Faq.jsx @@ -2,8 +2,6 @@ import React from "react"; import style from "./faq.module.scss"; import { AiFillEdit } from "react-icons/ai"; import { AiOutlinePlus } from "react-icons/ai"; -import { Link } from "react-router-dom"; - export function Faq(props) { return (
@@ -12,17 +10,17 @@ export function Faq(props) {
- props.setTab(10)} style={{ color: "white" }}> +

props.setTab(10)} style={{ color: "white" }}> ADD FAQ - +

To add a new faq

- props.setTab(10)} style={{ color: "red" }}> + props.setTab(10)} style={{ color: "red" }}> CLICK HERE - +

@@ -34,9 +32,9 @@ export function Faq(props) {
- props.setTab(17)} className={style["main-btn"]}> +

props.setTab(17)} className={style["main-btn"]}> Manage here - +

@@ -47,7 +45,10 @@ export function Faq(props) {
-
props.setTab(18)} className={style["main-btn"]}> +
props.setTab(18)} + className={style["main-btn"]} + > Manage here
diff --git a/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx b/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx index fcc00b44..ff0397b2 100644 --- a/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx +++ b/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx @@ -1,4 +1,5 @@ import React from "react"; +import React from "react"; import { useEffect, useState } from "react"; import Accordion from "@material-ui/core/Accordion"; import AccordionDetails from "@material-ui/core/AccordionDetails"; @@ -6,14 +7,27 @@ import AccordionSummary from "@material-ui/core/AccordionSummary"; import Typography from "@material-ui/core/Typography"; import Button from "@material-ui/core/Button"; import { Edit, Delete } from "@material-ui/icons"; +import Button from "@material-ui/core/Button"; +import { Edit, Delete } from "@material-ui/icons"; import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import { END_POINT } from "../../../../../config/api"; import Loader from "../../../../../components/util/Loader"; import style from "./manage-faq.module.scss"; +import { SimpleToast } from "../../../../../components/util/Toast"; + export function ManageFaq() { const [faqs, setFaqs] = useState([]); - const [expanded, setExpanded] = React.useState(false); - const [isFetching, setIsFetching] = useState(false); + const [expanded, setExpanded] = useState(false); + const [isFetching, setIsFetching] = useState(true); + const [open, setOpenToast] = useState(false); + const [toastMessage, setToastMessage] = useState(""); + const [severity, setSeverity] = useState("success"); + const [reload, setReload] = useState(true); + const handleCloseToast = () => { + setTimeout(() => { + setOpenToast(false); + }, 500); + }; const handleChange = (panel) => (event, isExpanded) => { setExpanded(isExpanded ? panel : false); }; @@ -26,12 +40,45 @@ export function ManageFaq() { setIsFetching(false); } catch (err) { console.log(err.message); + setIsFetching(false); } } - useEffect(() => { + + const deleteFaq = async (faqId) => { setIsFetching(true); + const url = `${END_POINT}/faq/deleteFaq`; + const body = { + faqId: faqId, + }; + const headers = { + "Content-Type": "application/json", + authorization: `Bearer ${localStorage.getItem("token")}`, + }; + try { + const response = await fetch(url, { + method: "PUT", + headers: headers, + body: JSON.stringify(body), + }); + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + const data = await response.json(); + setToastMessage(data.message); + setOpenToast(true); + setSeverity("success"); + setReload(!reload); + } catch (error) { + setToastMessage("Failed to delete Faq"); + setOpenToast(true); + setSeverity("error"); + } finally { + setIsFetching(false); + } + }; + useEffect(() => { fetchAllFaq(); - }, []); + }, [reload]); return (
@@ -39,7 +86,7 @@ export function ManageFaq() {
{isFetching ? ( - + ) : ( faqs.map((faq) => ( -

- -    {faq.question} -

+
+

+ +    {faq.question} +

+
@@ -81,6 +140,7 @@ export function ManageFaq() { className={style["btns"]} variant="contained" endIcon={} + onClick={() => deleteFaq(faq._id)} > DELETE @@ -91,6 +151,12 @@ export function ManageFaq() { )}
+
); } From 10a61a3bdb6ac95484a78c0665f04cc997ad6ffd Mon Sep 17 00:00:00 2001 From: swayamName1 Date: Sun, 26 May 2024 21:14:03 +0530 Subject: [PATCH 2/2] Integrated Delete Faq with Backend #679 --- .../src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx b/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx index ff0397b2..bba4f997 100644 --- a/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx +++ b/frontend/src/pages/Admin/Components/Faq/ManageFaq/ManageFaq.jsx @@ -1,5 +1,4 @@ import React from "react"; -import React from "react"; import { useEffect, useState } from "react"; import Accordion from "@material-ui/core/Accordion"; import AccordionDetails from "@material-ui/core/AccordionDetails"; @@ -7,8 +6,6 @@ import AccordionSummary from "@material-ui/core/AccordionSummary"; import Typography from "@material-ui/core/Typography"; import Button from "@material-ui/core/Button"; import { Edit, Delete } from "@material-ui/icons"; -import Button from "@material-ui/core/Button"; -import { Edit, Delete } from "@material-ui/icons"; import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import { END_POINT } from "../../../../../config/api"; import Loader from "../../../../../components/util/Loader";