29 lines
838 B
JavaScript
29 lines
838 B
JavaScript
import React from 'react';
|
|
import '../styles/sidebar.css';
|
|
import BookCard from './bookcard';
|
|
import SortByDropdown, { FIELDS_TO_SORT_BY, compareFunctions } from './sortByDropdown';
|
|
|
|
export default ({ data, limit }) => {
|
|
const [sortBy, setSortBy] = React.useState(FIELDS_TO_SORT_BY[0]);
|
|
|
|
const sortedBooks = React.useMemo(() => [...data.allBooksJson.edges]
|
|
.sort(compareFunctions[sortBy.value]),
|
|
[sortBy]);
|
|
|
|
return (
|
|
<>
|
|
<SortByDropdown sortBy={sortBy.label} onSortByItemClick={setSortBy} />
|
|
{sortedBooks.map((x, index) => {
|
|
const book = x.node;
|
|
if (!limit || index < limit) {
|
|
if (!book.description || book.description.length < 10) {
|
|
return null;
|
|
}
|
|
return <BookCard book={book} key={book.id} />;
|
|
}
|
|
return null;
|
|
})}
|
|
</>
|
|
);
|
|
};
|