From ef57b68fbd8f0065c2df95440284313f94a47a42 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D8=AD=D8=B3=DB=8C=D9=86=20=D9=85=D8=B9=D8=B5=D9=88=D9=85?= =?UTF-8?q?=DB=8C=20=D9=BE=D9=88=D8=B1?= Date: Fri, 27 Sep 2024 18:18:58 +0330 Subject: [PATCH] comment in bottom sheet --- components/AppsComponent/ProductData/page.jsx | 141 +++++++------ components/Blog/BlogData/page.jsx | 192 +++++++++++++++++- src/app/blogs/[...id]/page.jsx | 2 +- 3 files changed, 260 insertions(+), 75 deletions(-) diff --git a/components/AppsComponent/ProductData/page.jsx b/components/AppsComponent/ProductData/page.jsx index 2ab12c4..662246c 100644 --- a/components/AppsComponent/ProductData/page.jsx +++ b/components/AppsComponent/ProductData/page.jsx @@ -103,7 +103,7 @@ const ProductData = ({ params, data }) => { const createProductReview = async () => { const body = { - title: ` نظر کاربر برای محصول {" "}${data.product?.persianName}`, + title: ` نظر کاربر برای محصول ${data.product?.persianName}`, content, rate: 1, productId: params.id[0], @@ -115,8 +115,8 @@ const ProductData = ({ params, data }) => { body ); + CTX.setBottomSheetCommentOpen(false); setContent(""); - fetchReview(params.id[0], 0); } catch ({ error, status }) { toast.error(`${error?.response?.data?.message}`, { @@ -149,7 +149,7 @@ const ProductData = ({ params, data }) => { displaySpecifications(product?.specifications); }, [product]); - console.log("review", review); + console.log("review", data); return ( <> @@ -431,90 +431,87 @@ const ProductData = ({ params, data }) => { next={fetchMoreData} hasMore={hasMore} > - {review.length > 0 ? ( - review.map((e) => ( - <> -
+ {review.map((e) => ( + <> +
+
+
+ {/* SVG Icon */} + + {/* SVG Path */} + + +
+ +
+

{e?.userFullName}

+

+ +

+ +

+ {e?.content} +

+
+
+
+ {e?.children && e.children?.length > 0 && ( +
-
- {/* SVG Icon */} - - {/* SVG Path */} - - +
+
+ Logo +
-

{e?.userFullName}

-

+

+ پشتیبانی فروشگاه وسمه +

+

- {e?.content} + {e?.children[0]?.content}

- {e?.children && e.children?.length > 0 && ( -
-
-
-
- Logo -
-
- -
-

- پشتیبانی فروشگاه وسمه -

-

- -

- -

- {e?.children[0]?.content} -

-
-
-
- )} - - )) - ) : ( -
-
- چیزی یافت نشد -
-
- )} + )} + + ))} -
CTX.setBottomSheetCommentOpen(true)}> - باز شدن +
+
CTX.setBottomSheetCommentOpen(true)} + > + افزودن دیدگاه +{" "} +
diff --git a/components/Blog/BlogData/page.jsx b/components/Blog/BlogData/page.jsx index 945905c..c06a890 100644 --- a/components/Blog/BlogData/page.jsx +++ b/components/Blog/BlogData/page.jsx @@ -10,16 +10,100 @@ import TimerDownBlog from "@comp/TimerDown/TimerDown"; import PersianNumber from "plugins/PersianNumber"; import SliderProductsOffer from "../BlogComponents/SliderProductsOffer/page"; import AppContext from "@ctx/AppContext"; -const BlogData = ({ data }) => { - const CTX = useContext(AppContext); +import InfiniteScroll from "react-infinite-scroll-component"; +import BottomSheetComment from "plugins/bottomSheet/BottomSheetComment"; +import { toast } from "react-toastify"; +import Chapar from "plugins/Chapar"; +const BlogData = ({ params, data }) => { + const CTX = useContext(AppContext); + const [review, setReview] = useState([]); + const [content, setContent] = useState(""); + const [rate, setRate] = useState(4); + const [page, setPage] = useState(0); + const [hasMore, setHasMore] = useState(true); const specialOfferData = CTX.state.specialOfferData; + const fetchReview = async (id, currentPage, afterCreatReview) => { + try { + const res = await fetch( + `${process.env.NEXT_PUBLIC_API_URL}/product/${id}/comment?page=${currentPage}&count=10` + ); + + if (!res.ok) { + throw new Error(`HTTP error! status: ${res.status}`); + } + + const data = await res.json(); + + // Assuming the API returns an array of reviews and a total count or indication if more data is available + if (data.length < 10) { + setHasMore(false); + } + + if (afterCreatReview) { + setReview((prevReview) => [...prevReview, ...data]); + } else { + setReview(data); + } + } catch (error) { + console.error("Error fetching reviews:", error); + setHasMore(false); // Stop further fetches on error + } + }; + + const fetchMoreData = () => { + const nextPage = page + 1; + fetchReview(params.id[0], nextPage); + setPage(nextPage); + }; + + const createProductReview = async () => { + const body = { + title: ` نظر کاربر برای {" "}${data.product?.persianName}`, + content, + rate: 1, + blogId: params.id[0], + rate, + }; + try { + const data = await Chapar.post( + `${process.env.NEXT_PUBLIC_API_URL}/comment`, + body + ); + + setContent(""); + + fetchReview(params.id[0], 0); + } catch ({ error, status }) { + toast.error(`${error?.response?.data?.message}`, { + position: "bottom-right", + closeOnClick: true, + }); + } + }; + + const handleCreateReview = () => { + const token = localStorage.getItem("token"); + + if (token) { + createProductReview(); + } else { + router.push("/login"); + } + }; + + const handleStarClick = (value) => { + setRate(value); + }; + useEffect(() => { if (specialOfferData.length <= 0) { CTX.fetchSpecialOffer(); } + fetchReview(params.id[0], 0); }, []); + return (
@@ -49,8 +133,112 @@ const BlogData = ({ data }) => {
+ +
+
+

دیدگاه مخاطبان

+
+
+ + {review.map((e) => ( + <> +
+
+
+ {/* SVG Icon */} + + {/* SVG Path */} + + +
+ +
+

{e?.userFullName}

+

+ +

+ +

+ {e?.content} +

+
+
+
+ {e?.children && e.children?.length > 0 && ( +
+
+
+
+ Logo +
+
+ +
+

+ پشتیبانی فروشگاه وسمه +

+

+ +

+ +

+ {e?.children[0]?.content} +

+
+
+
+ )} + + ))} + + +
+
CTX.setBottomSheetCommentOpen(true)} + > + افزودن دیدگاه +{" "} +
+
+
+
+ +