28 lines
1.0 KiB
JavaScript
28 lines
1.0 KiB
JavaScript
import { Carousel } from "react-bootstrap";
|
|
import { Link } from "react-router-dom";
|
|
import FeaturedImage from "./FeaturedImage";
|
|
|
|
const FeaturedList = ({ products }) => {
|
|
if (products === null)
|
|
return (<></>);
|
|
return (
|
|
<Carousel variant="dark" className="featured-lst">
|
|
{products.map((product) => (
|
|
|
|
<Carousel.Item key={product.id} className="featured-itm">
|
|
<Link key={product.id} to={`/morceaux/${product.id}`}>
|
|
<FeaturedImage productId={product.id}/>
|
|
<Carousel.Caption className="featured-info">
|
|
<h3>{product.title}</h3>
|
|
<p>{(product.description).substring(0,100)}...</p>
|
|
<h5>Seulement</h5>
|
|
<h4 className="featured-prc">{product.promoPrice} $ CA</h4>
|
|
</Carousel.Caption>
|
|
</Link>
|
|
</Carousel.Item>
|
|
))}
|
|
</Carousel>
|
|
);
|
|
}
|
|
|
|
export default FeaturedList; |