added about us page in content

src/routes.js

@@ -90,6 +90,7 @@ import EditPrivacyPolicy from "./views/Content/editPrivacyPolicy";
 import EditTermsConditions from "./views/Content/editTermsConditions";
 import EditShippingPolicy from "./views/Content/editShippingPolicy";
 import EditRefundpolicy from "./views/Content/editRefundPolicy";
+import EditAboutUs from "./views/Content/editAboutUs";
 
 import UserTable from "./views/UserAddress/userTable";
 import EditUserAddress from "./views/UserAddress/editUserAddress";
@@ -296,6 +297,11 @@ const routes = [
     name: "Content",
     element: EditRefundpolicy,
   },
+  {
+    path: "/content/about-us",
+    name: "Content",
+    element: EditAboutUs,
+  },
 
   // { path: '/complaint/view/:id', name: 'view Complain', element: ViewComplaint },
   //Complaints

src/views/Content/content.js

@@ -34,6 +34,11 @@ export default function Content() {
       action: "Edit",
       path: "/content/refund-policy",
     },
+    {
+      name: "About Us",
+      action: "Edit",
+      path: "/content/about-us",
+    }
   ];
 
   return (

src/views/Content/editAboutUs.js

@@ -0,0 +1,162 @@
+import { Typography } from "@material-ui/core";
+import { Box, Button } from "@mui/material";
+import React, { useEffect, useState } from "react";
+import ReactQuill from "react-quill";
+import "react-quill/dist/quill.snow.css";
+import axios from "axios";
+import { isAutheticated } from "src/auth";
+
+const TOOLBAR_OPTIONS = [
+  [{ header: [1, 2, 3, 4, 5, 6, false] }],
+  [{ font: [] }],
+  [{ list: "ordered" }, { list: "bullet" }],
+  ["bold", "italic", "underline", "strike"], 
+  [{ color: [] }, { background: [] }],
+  [{ align: [] }],
+  [{ script: "super" }, { script: "sub" }], 
+  ["undo", "redo"], 
+];
+
+export default function EditAboutUs() {
+    const [title, setTitle] = useState("About Us");
+    const [content, setContent] = useState("");
+    const [added, setAdded] = useState(false);
+    const [olderContent, setOlderContent] = useState("");
+    const [id, setId] = useState(null);
+  
+    const token = isAutheticated();
+    const handleContentChange = (content, delta, source, editor) => {
+      setContent(editor.getHTML());
+    };
+    const getAboutUs = async () => {
+      const response = await axios.get("/api/content/about-us", {
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      });
+      if (response.status === 200) {
+  
+        setContent(response?.data?.aboutUs[0]?.aboutUsContent);
+        setId(response?.data?.aboutUs[0]?._id);
+        setOlderContent(
+            response?.data?.aboutUs[0]?.aboutUsContent
+            );
+      }
+    };
+  
+    const addAboutUs = async () => {
+      const response = await axios.post(
+        "/api/content/about-us",
+        { content },
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        }
+      );
+      if (response.status == 201) {
+        swal({
+          title: "Congratulations!!",
+          text: "About us  added successfully!",
+          icon: "success",
+          button: "OK",
+        });
+      }
+    };
+    const handleCancelClick = () => {
+      setContent(olderContent);
+    };
+    const updateContent = async () => {
+      const response = await axios.patch(
+        "/api/content/about-us-update",
+        { content },
+        {
+          params: { id: id }, 
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        }
+      
+      );
+      if (response.status === 200) {
+        swal({
+          title: "Congratulations!",
+          text: "About Us updated successfully!",
+          icon: "success",
+          button: "OK",
+        });
+      } else {
+        swal({
+          title: "Sorry, please try again",
+          text: "Something went wrong!",
+          icon: "error",
+          button: "Retry",
+          dangerMode: true,
+        });
+      }
+    };
+    const handleSaveClick = async () => {
+      if (olderContent === undefined && olderContent.length===0) {
+        await addAboutUs();
+        setAdded(true);
+      } else {
+        setAdded(false);
+        await updateContent();
+      }
+      // // Reload terms and conditions
+      // await getAboutUs();
+    };
+    useEffect(() => {
+      // addTermsandConditions();
+      getAboutUs();
+    }, [added]);
+    return (
+      <div>
+        <div style={{ display: "flex" }}>
+          <Button
+            variant="contained"
+            color="primary"
+            onClick={handleSaveClick}
+            style={{
+              fontWeight: "bold",
+              marginBottom: "1rem",
+              textTransform: "capitalize",
+              marginRight: "5px",
+            }}
+          >
+            Save
+          </Button>
+          <Button
+            variant="contained"
+            color="primary"
+            onClick={handleCancelClick}
+            style={{
+              fontWeight: "bold",
+              marginBottom: "1rem",
+              textTransform: "capitalize",
+              marginRight: "5px",
+            }}
+          >
+            Cancel
+          </Button>
+        </div>
+  
+        <Box style={{ background: "#FFFFFF", color: "black", padding: "1rem" }}>
+          <Typography
+            style={{ margin: "0.5rem 0rem", fontWeight: "bold" }}
+            variant="h6"
+          >
+            {" "}
+            {title}  :{" "}
+          </Typography>
+          <Typography style={{ margin: "0.5rem 0rem" }}>Body</Typography>
+          <ReactQuill
+            theme="snow"
+            value={content}
+            onChange={handleContentChange}
+            modules={{ toolbar: TOOLBAR_OPTIONS }}
+          />
+        </Box>
+      </div>
+    );
+  }

src/views/Content/editPrivacyPolicy.js

@@ -58,7 +58,7 @@ export default function EditPrivacyPolicy() {
     if (response.status == 201) {
       swal({
         title: "Congratulations!!",
-        text: "Terms and condition  added successfully!",
+        text: "privacy and policy  added successfully!",
         icon: "success",
         button: "OK",
       });