You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.3 KiB
53 lines
1.3 KiB
import React, { useEffect } from "react"; |
|
import { useSelector, connect } from "react-redux"; |
|
import Carousel from "react-elastic-carousel"; |
|
import Book from "./Book/index"; |
|
import { book } from "../../../redux/actions"; |
|
import "./index.scss"; |
|
|
|
function Books({list, number}: any) { |
|
const slideNumberHandler = () => { |
|
if (window.innerWidth >= 1440) { |
|
return 5; |
|
} else if (window.innerWidth >= 1008 && window.innerWidth < 1440) { |
|
return 5; |
|
} else if (window.innerWidth > 640 && window.innerWidth < 1008) { |
|
return 4; |
|
} else { |
|
return 2; |
|
} |
|
}; |
|
|
|
|
|
return ( |
|
<section |
|
className="home-books d-flex flex-column" |
|
> |
|
{window.innerWidth > 1007 ? ( |
|
<Carousel |
|
itemsToShow={slideNumberHandler()} |
|
isRTL={true} |
|
enableTilt={false} |
|
showArrows={true} |
|
pagination={false} |
|
> |
|
{list?.map((item: Object, i: Number) => ( |
|
<Book data={item} key={i} /> |
|
))} |
|
</Carousel> |
|
) : ( |
|
<div className="home-books__list d-flex"> |
|
{list?.map((item: Object, i: Number) => ( |
|
<Book data={item} key={i} /> |
|
))} |
|
</div> |
|
)} |
|
</section> |
|
); |
|
} |
|
|
|
export default connect( |
|
( state : any) => ({ |
|
}), |
|
{ } |
|
)(Books);
|
|
|