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

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);