"use client"
import { Cart } from "@/Theme/Site/Components/Public/Cart";
import { Like } from "@/Theme/Site/Components/Public/Like";
import { View } from "@/Theme/Site/Components/Public/View";
import { Shuffle } from "@/Theme/Site/Components/Public/Shuffle";
import { Rating } from "@/Theme/Site/Components/Public/Rating";

export const ProductSlide = ({ item,mediaPath,local,Lang,assetsPath,href="/books/",mediaSrc="/books/" }) => {
	let displayPrice = <> </>
	let displayDiscount = <><li className="d-none"></li></>
	let displayFree = <><li>{Lang("public.free")}</li></>
	if(item?.original_price > 0)
	{
		displayPrice = <>{item?.original_price+"تومان"}</>
		displayFree = <><li className="d-none"></li></>
		if(item?.dis_precent > 0)
		{
			displayPrice = <> <li> {item?.discounted_price+"تومان"} </li> <li> <del>{item?.original_price+"تومان"}</del> </li> </>
			displayDiscount = <><li> {item?.dis_precent}% </li></>
		}
	}
	
    return(
		<>
			<div className="swiper-slide">
				<div className="shop-box-items style-2">
					<div className="book-thumb center">
						<a href="shop-details"><img src={mediaPath+mediaSrc+item?.image} alt="img" /></a>
						<ul className="post-box">
							{displayDiscount}
							{displayFree}
						</ul>
						{/* <ul className="shop-icon d-grid justify-content-center align-items-center">
							<Like bookId={item?.id} local={local} Lang={Lang} />
						</ul> */}
						<ul className="shop-icon d-grid justify-content-center align-items-center">
							{/* <Like bookId={item?.id} local={local} Lang={Lang} />
							<Shuffle bookId={item?.id} local={local} Lang={Lang} assetsPath={assetsPath} /> */}
							<View href={href} bookId={item?.id} local={local} Lang={Lang} />
						</ul>
					</div>
					<div className="shop-content">
						<h5>{item?.categories?.[0]?.name}</h5>
						<h3 className="book-title"><a href="shop-details.html">{item?.title}</a></h3>
						<ul className="price-list">{displayPrice}</ul>
						<ul className="author-post">
							<li className="authot-list">
								<span className="thumb">
									<img src={`${mediaPath}/users/${item?.author_id==0 ? "user.png" : item?.author?.photo}`} alt={"user"} width={"30px"} />
								</span>
								<span className="content">{item?.author_id==0 ? Lang('public.by_authors') : item?.author?.firstname+" "+item?.author?.lastname}</span>
							</li>
							{/* <Rating bookId={item?.id} local={local} Lang={Lang} type="slide" /> */}
						</ul>
					</div>
					{/* <Cart bookId={item?.id} local={local} Lang={Lang} /> */}
				</div>
			</div>
    	</>
	);
}