diff --git a/src/Components/Banner/AddBanner.jsx b/src/Components/Banner/AddBanner.jsx index 3a4066b..87803e9 100644 --- a/src/Components/Banner/AddBanner.jsx +++ b/src/Components/Banner/AddBanner.jsx @@ -47,7 +47,7 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { } = useForm({ resolver: yupResolver(addCommunityBannerSchema), }); - + const formData = watch(); const onSubmit = async (data) => { @@ -58,7 +58,7 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { formData.append("sub_heading", data.sub_heading); formData.append("CTO_button_link", data.CTO_button_link); formData.append("CTO_button_title", data.CTO_button_title); - if (data.banner_image[0]) { + if (selectedImage[0]) { formData.append("banner_image", data.banner_image[0]); } // Trigger the mutation @@ -72,7 +72,10 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { setIsLoading(false); toast({ render: () => ( - + ), }); reset(); @@ -81,7 +84,10 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { setIsLoading(false); toast({ render: () => ( - + ), }); } @@ -154,17 +160,13 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { alt="Selected Image" /> */} - - - - - + {selectedImage === fallbackImage || largeImageData === null ? ( "" @@ -210,14 +212,12 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { // maxLength={51} /> 50 - ? "red" - : "gray.500" - } + color={formData?.heading?.length > 50 ? "red" : "gray.500"} className="web-text-small" > - If heading crosses 50 characters it will cause problem in alignment on website.you have entered {formData?.heading?.length} characters + If heading crosses 50 characters it will cause problem in + alignment on website.you have entered {formData?.heading?.length}{" "} + characters {errors.name && ( @@ -238,16 +238,14 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { errorBorderColor="crimson" isInvalid={formData?.sub_heading?.length > 230} /> - + 230 - ? "red" - : "gray.500" - } + color={formData?.sub_heading?.length > 230 ? "red" : "gray.500"} className="web-text-small" > - If sub heading crosses 50 characters it will cause problem in alignment on website.you have entered {formData?.sub_heading?.length} characters + If sub heading crosses 50 characters it will cause problem in + alignment on website.you have entered{" "} + {formData?.sub_heading?.length} characters {errors.sub_heading && ( @@ -271,13 +269,13 @@ const AddBanner = ({ createApi, navigateLink, title, center }) => { /> 30 - ? "red" - : "gray.500" + formData?.CTO_button_title?.length > 30 ? "red" : "gray.500" } className="web-text-small" > - If Button title crosses 50 characters it will cause problem in alignment on website.you have entered {formData?.CTO_button_title?.length} characters + If Button title crosses 50 characters it will cause problem in + alignment on website.you have entered{" "} + {formData?.CTO_button_title?.length} characters {errors.CTO_button_title && ( diff --git a/src/Pages/Policy/AddPolicy.jsx b/src/Pages/Policy/AddPolicy.jsx new file mode 100644 index 0000000..8db7d4b --- /dev/null +++ b/src/Pages/Policy/AddPolicy.jsx @@ -0,0 +1,340 @@ +import { + Box, + Button, + Divider, + FormControl, + FormHelperText, + FormLabel, + Heading, + Image, + Input, + Stack, + useToast, +} from "@chakra-ui/react"; +import React, { useState } from "react"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import Header from "../../Components/Header"; +import { useNavigate } from "react-router-dom"; +import fallbackImage from "../../assets/ultp-fallback-img.webp"; +import { + addPolicy, + addTerms, + addWhitePapers, +} from "../../Validations/Validations"; +import { TiWarning } from "react-icons/ti"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { useForm } from "react-hook-form"; +import { motion } from "framer-motion"; +import Loader01 from "../../Components/Loaders/Loader01"; +import { useCreatePolicyMutation } from "../../Services/api.service"; +import ToastBox from "../../Components/ToastBox"; +import ReactQuill from "react-quill"; + +const AddPolicy = () => { + const toast = useToast(); + const navigate = useNavigate(); + const [isLoading, setIsLoading] = useState(false); + const [selectedImage, setSelectedImage] = useState(fallbackImage); + const [imageData, setImageData] = useState(null); + const [value, setValue] = useState(""); + + const [createPolicy] = useCreatePolicyMutation(); + + // const termContent = data?.data; + + const { + register, + handleSubmit, + reset, + setValue: setYupFormValue, + formState: { errors }, + } = useForm({ + resolver: yupResolver(addPolicy), + defaultValues: { + title: "", + content: "", + banner_image: "", + }, + }); + + console.log(errors); + const handleImageChange = (e) => { + const file = e.target.files[0]; + setImageData(file); + // setYupFormValue("banner_image", file); + if (file) { + const reader = new FileReader(); + reader.onloadend = () => { + setSelectedImage(reader.result); + }; + reader.readAsDataURL(file); + } + }; + + const onSubmit = async (data) => { + setYupFormValue("content", value); + try { + setIsLoading(true); + const formData = new FormData(); + formData.append("title", data?.title); + formData.append("content", data?.content); + if (selectedImage[0]) { + formData.append("banner_image", data?.image[0]); + } + // for (let [key, value] of formData.entries()) { + // console.log(key, value); + // } + // Trigger the mutation + createPolicy(formData) + .then((response) => { + // Handle the response here + + if (response?.data?.statusCode === 200) { + setIsLoading(false); + toast({ + render: () => ( + + ), + }); + reset(); + navigate("/policy"); + } else if (response?.data?.statusCode === 500) { + setIsLoading(false); + toast({ + render: () => ( + + ), + }); + } else { + setIsLoading(false); + toast({ + render: () => ( + + ), + }); + } + }) + .catch((error) => { + // Handle errors + console.error("Error creating community:", error); + setIsLoading(false); + // Handle error notification if needed + }); + } catch (error) { + // Handle errors + console.error("Error creating community:", error); + setIsLoading(false); + } + }; + + return ( + +
+ + + + + Selected Image + {selectedImage === fallbackImage || imageData === null ? ( + "" + ) : ( + + {imageData?.name} + + {(imageData?.size / (1024 * 1024)).toFixed(2)} mb + + + )} + + + + +
+ + + Title + + + {errors.title && ( + + {errors.title.message} + + )} + + + + + Content + + + {errors.content && ( + + {errors.content.message} + + )} + + + + + Banner image + + {/* */} + + + + + + + + Drop images here + + + or click to upload + + + + + + + + + {errors.image && ( + + {errors.image.message} + + )} + + Maximum limit of image is 5mb. + + + + + + +
+
+ + ); +}; + +export default AddPolicy; diff --git a/src/Pages/Policy/EditPolicy.jsx b/src/Pages/Policy/EditPolicy.jsx new file mode 100644 index 0000000..ebd6a58 --- /dev/null +++ b/src/Pages/Policy/EditPolicy.jsx @@ -0,0 +1,341 @@ +import React, { useEffect, useState } from "react"; +import Header from "../../Components/Header"; +import { + Box, + Button, + Divider, + FormControl, + FormHelperText, + FormLabel, + Heading, + Image, + Input, + Stack, + Text, + useToast, +} from "@chakra-ui/react"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import fallbackImage from "../../assets/ultp-fallback-img.webp"; +import { useNavigate, useParams } from "react-router-dom"; +import { + useGetPolicyByIdQuery, + useUpdatePolicyMutation, +} from "../../Services/api.service"; +import { useForm } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { TiWarning } from "react-icons/ti"; +import { addPolicy } from "../../Validations/Validations"; +import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders"; +import { AttachmentIcon } from "@chakra-ui/icons"; +import extractFilename from "../../Components/Functions/FileNameAlter"; +import Loader01 from "../../Components/Loaders/Loader01"; +import { motion } from "framer-motion"; +import ToastBox from "../../Components/ToastBox"; +import ReactQuill from "react-quill"; + +const EditPolicy = () => { + const { id } = useParams(); + const toast = useToast(); + const navigate = useNavigate(); + const { data, error, isLoading } = useGetPolicyByIdQuery(id); + const [isLoadingEdit, setIsLoadingEdit] = useState(false); + const [selectedImage, setSelectedImage] = useState(fallbackImage); + const [largeImageData, setLargeImageData] = useState(null); + const [updatePolicy] = useUpdatePolicyMutation(); + const [valueQuill, setValueQuill] = useState(data?.data?.content); + + console.log(valueQuill); + + const { + register, + handleSubmit, + reset, + formState: { errors }, + setValue, + } = useForm({ + resolver: yupResolver(addPolicy), + defaultValues: { + title: "", + content: "", + banner_image: null, + }, + }); + + const policyContent = data?.data; + // console.log(termContent); + + useEffect(() => { + if (data?.data) { + setSelectedImage( + `https://rubix.betadelivery.com/${data?.data?.banner_image}` + ); + setValue("title", data?.data?.title); + setValue("content", data?.data?.content); + setValue("banner_image", data?.data?.banner_image); + setValueQuill(data?.data?.content); + } + }, [data, setValue]); + + const handleImageChange = (e) => { + const file = e.target.files[0]; + setLargeImageData(file); + if (file) { + const reader = new FileReader(); + reader.onloadend = () => { + setSelectedImage(reader.result); + }; + reader.readAsDataURL(file); + } + }; + + const onSubmit = async (data) => { + console.log(data); + + setIsLoadingEdit(true); + const form = new FormData(); + form.append("title", data?.title); + form.append("content", valueQuill); + if (data?.banner_image[0]) { + form.append("banner_image", data?.image[0]); + } + + // Log formData entries + for (let [key, value] of form.entries()) { + console.log(`${key}: ${value}`); + } + + await updatePolicy({ id: id, data: form }) + .then((response) => { + // console.log(response?.error?.data?.error?.message); + if (response?.data?.statusCode === 200) { + setIsLoadingEdit(false); + toast({ + render: () => ( + + ), + }); + + reset(); + navigate("/policy"); + // setDeleteAlert(false); + } else { + setIsLoadingEdit(false); + toast({ + render: () => ( + + ), + }); + } + }) + .catch((error) => { + console.error("Error creating community:", error); + setIsLoadingEdit(false); + // setDeleteIsLoading(false); + // setDeleteAlert(false); + }); + }; + + console.log(errors); + if (isLoading) { + return ; + } + return ( + +
+ + + + + Selected Image + {selectedImage === fallbackImage || largeImageData === null ? ( + "" + ) : ( + + + {largeImageData && largeImageData?.name} + + + {largeImageData && + (largeImageData?.size / (1024 * 1024)).toFixed(2)}{" "} + mb + + + )} + + + + + + +
+ + + Title + + + {errors.title && ( + + {errors.title.message} + + )} + + + + + + + + + Display profile + + {/* */} + + + + + + + + Drop images here + + + or click to upload + + + + + + + + + {errors.image && ( + + {errors.image.message} + + )} + + Maximum limit of image should be 1mb to protect website from slow + loading. + + + + + + + + +
+ + ); +}; + +export default EditPolicy; diff --git a/src/Pages/Policy/Policy.jsx b/src/Pages/Policy/Policy.jsx new file mode 100644 index 0000000..f7e6a87 --- /dev/null +++ b/src/Pages/Policy/Policy.jsx @@ -0,0 +1,249 @@ +import { + Box, + Image, + Menu, + MenuButton, + MenuItem, + MenuList, + Portal, + Switch, + Text, + Tooltip, + useToast, +} from "@chakra-ui/react"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import { TABLE_PAGINATION } from "../../Constants/Paginations"; +import { + useCreatePolicyMutation, + useDeletePolicyMutation, + useGetPolicyQuery, + useUpdatePolicyStatusMutation, +} from "../../Services/api.service"; +import { useState } from "react"; +import TabularView from "../../Components/TabularView/TabularView"; +import CustomAlertDialog from "../../Components/CustomAlertDialog"; +import { HiDotsVertical } from "react-icons/hi"; +import { Link } from "react-router-dom"; +import { formatDate } from "../../Components/Functions/UTCConvertor"; +import ToastBox from "../../Components/ToastBox"; +import extractFilename from "../../Components/Functions/FileNameAlter"; + +const Policy = () => { + const toast = useToast(); + const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size); + const [currentPage, setCurrentPage] = useState(1); + const [searchTerm, setSearchTerm] = useState(""); + const [statusFilter, setStatusFilter] = useState("all"); + + const [deleteAlert, setDeleteAlert] = useState(false); + const [actionId, setActionId] = useState(null); + const [actionStatus, setActionStatus] = useState(null); + const [deleteIsLoading, setDeleteIsLoading] = useState(false); + + const policyPage = useCreatePolicyMutation({ + page: currentPage, + size: pageSize, + }); + + const policy = useGetPolicyQuery({ + page: currentPage, + size: pageSize, + }); + + const [deletePolicy] = useDeletePolicyMutation(); + const [updatePolicyStatus] = useUpdatePolicyStatusMutation(); + + const filteredData = policy?.data?.data?.rows?.filter((item) => { + // Filter by name (case insensitive) + const name = item.title; + const searchLower = searchTerm.toLowerCase(); + const nameMatches = name.toLowerCase().includes(searchLower); + + // Filter by status + const status = item.status; + + const statusMatches = + statusFilter === "all" || + (statusFilter === "active" && status === true) || + (statusFilter === "inactive" && status === false); + + return nameMatches && statusMatches; + }); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Title", + // "Content", + "Active", + "Created At", + ]; + + const extractedArray = filteredData?.map((item, index) => { + return { + Title: ( + + + + + {extractFilename(item?.title)} + + + + + ), + Active: ( + handleUpdateStatus(item.id, item?.status)} + isChecked={item.status} + // disabled={item.status} + /> + ), + "Created At": ( + + + {formatDate(item?.createdAt)} + + + + + + + + + Edit + + + View + + { + setActionId(item.id); + setDeleteAlert(true); + setActionStatus(item.status); + }} + className="web-text-medium" + > + Delete + + + + + + ), + }; + }); + + // ====================================================[Functions]=================================================================== + const handleDelete = async (communityId, status) => { + if (status) { + return toast({ + render: () => ( + + ), + }); + } + + try { + // Trigger the mutation + setDeleteIsLoading(true); + await deletePolicy(communityId) + .then((response) => { + // Handle the response here + console.log("Mutation response:", response?.data?.statusCode); + console.log("Mutation response:", response?.data?.message); + + if (response?.data?.statusCode === 201) { + setDeleteIsLoading(false); + setDeleteAlert(false); + toast({ + render: () => ( + + ), + }); + } + }) + .catch((error) => { + console.error("Error creating community:", error); + setDeleteIsLoading(false); + setDeleteAlert(false); + }); + } catch (error) { + // Handle errors + console.log("Error deleting community:", error); + } + }; + + const handleUpdateStatus = async (id) => { + try { + await updatePolicyStatus({ id }) + .then((response) => { + console.log(response?.data); + if (response?.data?.statusCode === 201) { + toast({ + render: () => ( + + ), + }); + + // whitePaper?.refetch() + } + }) + .catch((error) => { + console.log(error); + }); + } catch (error) { + // Handle errors + console.error("Error updating community status:", error); + } + }; + + return ( + <> + + setDeleteAlert(false)} + isOpen={deleteAlert} + alertHandler={() => handleDelete(actionId)} + message={"Are you sure you want to delete Policy?"} + isLoading={deleteIsLoading} + /> + + ); +}; + +export default Policy; diff --git a/src/Pages/Terms/ViewWhitePaper.jsx b/src/Pages/Policy/ViewPolicy.jsx similarity index 57% rename from src/Pages/Terms/ViewWhitePaper.jsx rename to src/Pages/Policy/ViewPolicy.jsx index 5e7f541..6d0c5f4 100644 --- a/src/Pages/Terms/ViewWhitePaper.jsx +++ b/src/Pages/Policy/ViewPolicy.jsx @@ -3,18 +3,21 @@ import { OPACITY_ON_LOAD } from "../../Layout/animations"; import { Box, Divider, Image, Tag, Text, useToast } from "@chakra-ui/react"; import { useNavigate, useParams } from "react-router-dom"; import Header from "../../Components/Header"; -import { useGetWhitepaperByIdQuery } from "../../Services/api.service"; +import { useGetPolicyByIdQuery } from "../../Services/api.service"; import { AttachmentIcon } from "@chakra-ui/icons"; import extractFilename from "../../Components/Functions/FileNameAlter"; import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders"; -import pdf from "../../assets/pdfscreen.png" +import pdf from "../../assets/pdfscreen.png"; -const ViewWhitePaper = () => { +const ViewPolicy = () => { const { id } = useParams(); const toast = useToast(); const navigate = useNavigate(); - const { data, error, isLoading } = useGetWhitepaperByIdQuery(id); - const whitepaper = data?.data?.data; + const { data, error, isLoading } = useGetPolicyByIdQuery(id); + const viewPolicy = data?.data; + + console.log(viewPolicy?.banner_image); + console.log(`https://rubix.betadelivery.com/${viewPolicy?.banner_image}`); if (isLoading) { return ; @@ -29,26 +32,14 @@ const ViewWhitePaper = () => { display={"flex"} flexDirection={"column"} > -
+
- - Whitepaper Info - - - Select the platform for which you need to create this campaign. - - - - - - Whitepaper banner image - - - Below is the profile that will be displayed on the community page. - - { objectFit="cover" w={500} h={240} - src={`https://rubix.betadelivery.com/${whitepaper?.bannerImage}`} + src={`https://rubix.betadelivery.com/${viewPolicy?.banner_image}`} alt="Selected Image" /> @@ -70,7 +61,7 @@ const ViewWhitePaper = () => { Status - {whitepaper?.status ? ( + {viewPolicy?.status ? ( Active @@ -83,27 +74,24 @@ const ViewWhitePaper = () => { Title - {whitepaper?.title} + + {viewPolicy?.title} + - - - Document - - {extractFilename(whitepaper?.document)} - + + Content + + + {viewPolicy?.content} + - - - - - - + ); }; -export default ViewWhitePaper; +export default ViewPolicy; diff --git a/src/Pages/Terms/AddTerms.jsx b/src/Pages/Terms/AddTerms.jsx index d7f4d67..dcfa9d9 100644 --- a/src/Pages/Terms/AddTerms.jsx +++ b/src/Pages/Terms/AddTerms.jsx @@ -16,14 +16,19 @@ import { OPACITY_ON_LOAD } from "../../Layout/animations"; import Header from "../../Components/Header"; import { useNavigate } from "react-router-dom"; import fallbackImage from "../../assets/ultp-fallback-img.webp"; -import { addWhitePapers } from "../../Validations/Validations"; +import { addTerms, addWhitePapers } from "../../Validations/Validations"; import { TiWarning } from "react-icons/ti"; import { yupResolver } from "@hookform/resolvers/yup"; import { useForm } from "react-hook-form"; import { motion } from "framer-motion"; import Loader01 from "../../Components/Loaders/Loader01"; -import { useCreateWhitepaperMutation } from "../../Services/api.service"; +import { + useCreateTermsMutation, + useCreateWhitepaperMutation, + useGetTermsByIdQuery, +} from "../../Services/api.service"; import ToastBox from "../../Components/ToastBox"; +import ReactQuill from "react-quill"; const AddTerms = () => { const toast = useToast(); @@ -31,21 +36,32 @@ const AddTerms = () => { const [isLoading, setIsLoading] = useState(false); const [selectedImage, setSelectedImage] = useState(fallbackImage); const [imageData, setImageData] = useState(null); + const [value, setValue] = useState(""); - const [createWhitepaper] = useCreateWhitepaperMutation(); + const [createTerms] = useCreateTermsMutation(); + + // const termContent = data?.data; const { register, handleSubmit, reset, + setValue: setYupFormValue, formState: { errors }, } = useForm({ - resolver: yupResolver(addWhitePapers), + resolver: yupResolver(addTerms), + defaultValues: { + title: "", + content: "", + banner_image: "", + }, }); + console.log(errors); const handleImageChange = (e) => { const file = e.target.files[0]; setImageData(file); + // setYupFormValue("banner_image", file); if (file) { const reader = new FileReader(); reader.onloadend = () => { @@ -56,22 +72,24 @@ const AddTerms = () => { }; const onSubmit = async (data) => { + setYupFormValue("content", value); try { setIsLoading(true); const formData = new FormData(); - formData.append("title", data.title); - if (data.image[0]) { - formData.append("image", data.image[0]); + formData.append("title", data?.title); + formData.append("content", data?.content); + if (selectedImage[0]) { + formData.append("banner_image", data?.image[0]); } - if (data.document[0]) { - formData.append("document", data.document[0]); + for (let [key, value] of formData.entries()) { + console.log(key, value); } // Trigger the mutation - createWhitepaper(formData) + createTerms(formData) .then((response) => { // Handle the response here - if (response?.data?.statusCode === 201) { + if (response?.data?.statusCode === 200) { setIsLoading(false); toast({ render: () => ( @@ -82,7 +100,7 @@ const AddTerms = () => { ), }); reset(); - navigate("/whitepaper"); + navigate("/terms"); } else if (response?.data?.statusCode === 500) { setIsLoading(false); toast({ @@ -93,6 +111,16 @@ const AddTerms = () => { /> ), }); + } else { + setIsLoading(false); + toast({ + render: () => ( + + ), + }); } }) .catch((error) => { @@ -117,27 +145,10 @@ const AddTerms = () => { display={"flex"} flexDirection={"column"} > -
+
- - Whitepaper Info - - - Select the platform for which you need to create this campaign. - - - - - - Whitepaper banner image - - - Below is the whitepaper banner image that will be whitepaper on the - community page. - - { - Document + Content - - {errors.document && ( + {errors.content && ( - {" "} - {errors.document.message} + {errors.content.message} )} diff --git a/src/Pages/Terms/EditTerms.jsx b/src/Pages/Terms/EditTerms.jsx index b83c83d..bee336e 100644 --- a/src/Pages/Terms/EditTerms.jsx +++ b/src/Pages/Terms/EditTerms.jsx @@ -96,7 +96,7 @@ const EditTerms = () => { setIsLoadingEdit(true); const form = new FormData(); form.append("title", data?.title); - form.append("content", data?.content); + form.append("content", valueQuill); if (data?.banner_image[0]) { form.append("banner_image", data?.image[0]); } diff --git a/src/Pages/Terms/Terms.jsx b/src/Pages/Terms/Terms.jsx index 18ef321..e9f8f99 100644 --- a/src/Pages/Terms/Terms.jsx +++ b/src/Pages/Terms/Terms.jsx @@ -83,7 +83,7 @@ const Terms = () => { const extractedArray = filteredData?.map((item, index) => { return { Title: ( - + { render: () => ( ), }); @@ -241,7 +241,7 @@ const Terms = () => { onClose={() => setDeleteAlert(false)} isOpen={deleteAlert} alertHandler={() => handleDelete(actionId)} - message={"Are you sure you want to delete video?"} + message={"Are you sure you want to delete Terms?"} isLoading={deleteIsLoading} /> diff --git a/src/Pages/Terms/ViewTerms.jsx b/src/Pages/Terms/ViewTerms.jsx new file mode 100644 index 0000000..d94c6d8 --- /dev/null +++ b/src/Pages/Terms/ViewTerms.jsx @@ -0,0 +1,97 @@ +import React from "react"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import { Box, Divider, Image, Tag, Text, useToast } from "@chakra-ui/react"; +import { useNavigate, useParams } from "react-router-dom"; +import Header from "../../Components/Header"; +import { useGetTermsByIdQuery } from "../../Services/api.service"; +import { AttachmentIcon } from "@chakra-ui/icons"; +import extractFilename from "../../Components/Functions/FileNameAlter"; +import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders"; +import pdf from "../../assets/pdfscreen.png"; + +const ViewTerms = () => { + const { id } = useParams(); + const toast = useToast(); + const navigate = useNavigate(); + const { data, error, isLoading } = useGetTermsByIdQuery(id); + const viewTerms = data?.data; + + console.log(viewTerms?.banner_image); + console.log(`https://rubix.betadelivery.com/${viewTerms?.banner_image}`); + + if (isLoading) { + return ; + } + + return ( + +
+ + + + + Selected Image + + + + + + + Status + + {viewTerms?.status ? ( + + Active + + ) : ( + + Inactive + + )} + + + + Title + + {viewTerms?.title} + + + + + Content + + + {viewTerms?.content} + + + + + + + + ); +}; + +export default ViewTerms; diff --git a/src/Routes/Nav.js b/src/Routes/Nav.js index 02aa9b2..1498615 100644 --- a/src/Routes/Nav.js +++ b/src/Routes/Nav.js @@ -9,6 +9,7 @@ import { CgCommunity } from "react-icons/cg"; import { AiOutlineIdcard } from "react-icons/ai"; import { LuMonitorPause } from "react-icons/lu"; import { MdOutlinePrivacyTip } from "react-icons/md"; +import { GrDocumentVerified } from "react-icons/gr"; export const nav = [ { @@ -63,6 +64,11 @@ export const nav = [ { title: "Terms & Conditions", path: "/terms", + Icon: GrDocumentVerified, + }, + { + title: "Privacy Policy", + path: "/policy", Icon: MdOutlinePrivacyTip, }, ]; diff --git a/src/Routes/Routes.js b/src/Routes/Routes.js index 49a4fc1..7d88fcc 100644 --- a/src/Routes/Routes.js +++ b/src/Routes/Routes.js @@ -53,12 +53,17 @@ import Usecase from "../Pages/Usecase/Usecase"; import AddUseCase from "../Pages/Usecase/AddUseCase"; import ViewUseCase from "../Pages/Usecase/ViewUseCase"; import EditUseCase from "../Pages/Usecase/EditUseCase"; -import Policy from "../Pages/Terms/Terms"; + import Whitepapers from "../Pages/Whitepapers/Whitepapers"; import WelcomePage from "../Pages/WelcomePage"; import AddTerms from "../Pages/Terms/AddTerms"; import Terms from "../Pages/Terms/Terms"; import EditTerms from "../Pages/Terms/EditTerms"; +import ViewTerms from "../Pages/Terms/ViewTerms"; +import AddPolicy from "../Pages/Policy/AddPolicy"; +import ViewPolicy from "../Pages/Policy/ViewPolicy"; +import EditPolicy from "../Pages/Policy/EditPolicy"; +import Policy from "../Pages/Policy/Policy"; export const RouteLink = [ { path: "/", Component: WelcomePage }, @@ -157,9 +162,15 @@ export const RouteLink = [ { path: "/usecase/edit/:id", Component: EditUseCase }, - // =============[ policy ]================ + // =============[ Terms ]================ { path: "/terms", Component: Terms }, { path: "/terms/add-terms", Component: AddTerms }, - { path: "/terms/view/:id", Component: UnderConstruction }, + { path: "/terms/view/:id", Component: ViewTerms }, { path: "/terms/edit/:id", Component: EditTerms }, + + // =============[ Policy ]================ + { path: "/policy", Component: Policy }, + { path: "/policy/add-policy", Component: AddPolicy }, + { path: "/policy/view/:id", Component: ViewPolicy }, + { path: "/policy/edit/:id", Component: EditPolicy }, ]; diff --git a/src/Services/api.service.js b/src/Services/api.service.js index 56de1a0..508d7db 100644 --- a/src/Services/api.service.js +++ b/src/Services/api.service.js @@ -35,7 +35,9 @@ export const rubixApi = createApi({ "getEcoBanner", "getUseCaseById", "getUseCase", - "getTerms" + "getTerms", + "getPolicy", + ], endpoints: (builder) => ({ // ===============[ Community cards endpoints ]======================= @@ -586,8 +588,8 @@ export const rubixApi = createApi({ invalidatesTags: ["getTerms"], }), createTerms: builder.mutation({ - query: ({ data }) => ({ - url: `/admin/term-condition/${data}`, + query: (data) => ({ + url: `/admin/term-condition`, method: "POST", body: data, }), @@ -612,6 +614,46 @@ export const rubixApi = createApi({ query: (id) => `/admin/term-condition/${id}`, providesTags: ["getTerms"], }), + + // ===============[ Terms endpoints ]======================= + getPolicy: builder.query({ + query: () => "/admin/policy", + providesTags: ["getPolicy"], + }), + deletePolicy: builder.mutation({ + query: (id) => ({ + url: `/admin/policy/${id}`, + method: "DELETE", + }), + invalidatesTags: ["getPolicy"], + }), + createPolicy: builder.mutation({ + query: (data) => ({ + url: `/admin/policy`, + method: "POST", + body: data, + }), + invalidatesTags: ["getPolicy"], + }), + updatePolicyStatus: builder.mutation({ + query: ({ id }) => ({ + url: `/admin/policy/change-visibility/${id}`, + method: "POST", + }), + invalidatesTags: ["getPolicy"], + }), + updatePolicy: builder.mutation({ + query: ({ id, data }) => ({ + url: `/admin/policy/${id}`, + method: "PUT", + body: data, // Include the data you want to send in the request body + }), + invalidatesTags: ["getPolicy"], + }), + getPolicyById: builder.query({ + query: (id) => `/admin/policy/${id}`, + providesTags: ["getPolicy"], + }), }), }); @@ -716,6 +758,13 @@ export const { useUpdateTermsMutation, useGetTermsByIdQuery, + useGetPolicyQuery, + useDeletePolicyMutation, + useCreatePolicyMutation, + useUpdatePolicyStatusMutation, + useUpdatePolicyMutation, + useGetPolicyByIdQuery, + diff --git a/src/Validations/Validations.js b/src/Validations/Validations.js index cbe0160..8007582 100644 --- a/src/Validations/Validations.js +++ b/src/Validations/Validations.js @@ -527,4 +527,52 @@ export const addTerms = Yup.object().shape({ // }) }); +export const addPolicy = Yup.object().shape({ + title: Yup.string().required("title is required"), + content: Yup.string(), + banner_image: Yup.mixed() + // .test("required", "You need to provide a file", (files) => { + // // return file && file.size <-- u can use this if you don't want to allow empty files to be uploaded; + // if (files) return true; + // return false; + // }) + // .test( + // "fileSize", + // " The maximum size of profile picture is 15MB.", + // (files) => { + // //if u want to allow only certain file sizes + // try { + // if (files.length !== 0) { + // return files[0].size <= 15000000; + // } + // return true; + // } catch (error) { + // return false; + // } + // } + // ) + .optional(), + // .test("file_formate", "Image file has unsupported format.", (files) => { + // // // console.log(files[0].type) + + // const SUPPORTED_FORMATS = [ + // "image/jpeg", + // "image/png", + // "image/jpg", + // "image/gif", + // "image/tiff", + // "image/svg+xml", + // ]; + // try { + // if (files.length !== 0) { + // setPreviewImage(URL.createObjectURL(files[0])); + // return files && SUPPORTED_FORMATS.includes(files[0].type); + // } + // return true; + // } catch (error) { + // return false; + // } + // }) +}); +