diff --git a/components/AppsComponent/ProductData/page.jsx b/components/AppsComponent/ProductData/page.jsx index 86d28ee..2ab12c4 100644 --- a/components/AppsComponent/ProductData/page.jsx +++ b/components/AppsComponent/ProductData/page.jsx @@ -2,7 +2,7 @@ import Footer from "@comp/Footer/page"; import Navbar from "@comp/Navbar/page"; import GalleryBox from "plugins/Gallery/page"; -import { useEffect, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import AddToCart from "@comp/Cards/Components/AddToCart/page"; import Image from "next/image"; @@ -12,14 +12,22 @@ import moment from "jalali-moment"; import Chapar from "plugins/Chapar"; import { toast } from "react-toastify"; import { useRouter } from "next/navigation"; +import InfiniteScroll from "react-infinite-scroll-component"; +import BottomSheetComment from "plugins/bottomSheet/BottomSheetComment"; +import AppContext from "@ctx/AppContext"; const ProductData = ({ params, data }) => { console.log("data", data); + + const CTX = useContext(AppContext); const [product, setProduct] = useState([]); const [review, setReview] = useState([]); const [specificationsHeader, setSpecificationsHeader] = useState([]); const [productBarDetail, setProductBarDetail] = useState(0); - const [comment, setComment] = useState(""); + const [content, setContent] = useState(""); + const [rate, setRate] = useState(4); + const [page, setPage] = useState(0); + const [hasMore, setHasMore] = useState(true); const router = useRouter(); @@ -29,26 +37,40 @@ const ProductData = ({ params, data }) => { setProduct(post.product); }; - const fetchReview = async (id) => { + const fetchReview = async (id, currentPage, afterCreatReview) => { try { const res = await fetch( - `${process.env.NEXT_PUBLIC_API_URL}/product/${id}/review?page=0` + `${process.env.NEXT_PUBLIC_API_URL}/product/${id}/comment?page=${currentPage}&count=10` ); - // Check if the response is OK and has JSON content if (!res.ok) { throw new Error(`HTTP error! status: ${res.status}`); } - const post = await res.json(); + const data = await res.json(); - console.log("post test comment", post); - setReview(post); + // 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 review:", 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 displaySpecifications = (specs) => { let data = []; if (specs?.length > 3) { @@ -81,20 +103,21 @@ const ProductData = ({ params, data }) => { const createProductReview = async () => { const body = { - title: `${data.product?.persianName}نظر کاربر برای محصول`, - comment, + title: ` نظر کاربر برای محصول {" "}${data.product?.persianName}`, + content, rate: 1, productId: params.id[0], + rate, }; try { const data = await Chapar.post( - `${process.env.NEXT_PUBLIC_API_URL}/product/review`, + `${process.env.NEXT_PUBLIC_API_URL}/comment`, body ); - setComment(""); + setContent(""); - fetchReview(params.id[0]); + fetchReview(params.id[0], 0); } catch ({ error, status }) { toast.error(`${error?.response?.data?.message}`, { position: "bottom-right", @@ -113,9 +136,13 @@ const ProductData = ({ params, data }) => { } }; + const handleStarClick = (value) => { + setRate(value); + }; + useEffect(() => { fetchPost(params.id[0]); - fetchReview(params.id[0]); + fetchReview(params.id[0], 0); }, []); useEffect(() => { @@ -185,9 +212,7 @@ const ProductData = ({ params, data }) => { {specificationsHeader.map((e, index) => (
  • -

    - {e} -

    +

    {e}

    • ))} @@ -373,9 +398,7 @@ const ProductData = ({ params, data }) => {
    -

    - نقد و برسی{" "} -

    +

    نقد و برسی

    {!!data?.product?.expertCheck ? (
    @@ -403,150 +426,97 @@ const ProductData = ({ params, data }) => {
    - {review?.length > 0 ? ( - <> - {review?.map((e) => ( -
    -
    -
    - - - -
    + + {review.length > 0 ? ( + review.map((e) => ( + <> +
    +
    +
    + {/* SVG Icon */} + + {/* SVG Path */} + + +
    -
    -

    {e?.userFullName}

    -

    - -

    +
    +

    {e?.userFullName}

    +

    + +

    -

    - {e?.comment}{" "} -

    +

    + {e?.content} +

    +
    -
    - ))} -
    - - ) : ( -
    -
    - چیزی یافت نشد -
    -
    - )} + {e?.children && e.children?.length > 0 && ( +
    +
    +
    +
    + Logo +
    +
    - {/*
    -
    -
    - - - -
    +
    +

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

    +

    + +

    -
    -

    محدثه سروری پور

    -

    - -

    - -

    - لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت - چاپ و با استفاده از طراحان گرافیک است -

    -
    -
    -
    - -
    -
    -
    -
    - +

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

    +
    +
    +
    + )} + + )) + ) : ( +
    +
    + چیزی یافت نشد
    + )} + -
    -

    - پشتیبانی فروشگاه وسمه - آقای حیدریان -

    -

    - -

    - -

    - لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت - چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون - بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و - برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع - با هدف بهبود ابزارهای کاربردی می باشد -

    -
    -
    -
    */} - -
    -

    دیدگاه خود را وارد کنید

    {" "} -