Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-10-01 15:48:23 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

show 6 on page (infinite scroller)

Browse Source
This commit is contained in:
Kalle (Sendou)
2020-11-28 13:23:34 +02:00
parent 643bb16550
commit 43b13b992c
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/common/MyInfiniteScroller.tsx
View File

@@ -5,8 +5,10 @@ import { Flex } from "@chakra-ui/react";
import { ReactElement, ReactNodeArray, useState } from "react";
import InfiniteScroll from "react-infinite-scroller";
const ON_PAGE = 6;
const MyInfiniteScroller: React.FC = ({ children }) => {
const [elementsToShow, setElementsToShow] = useState(12);
const [elementsToShow, setElementsToShow] = useState(ON_PAGE);
if (!Array.isArray(children))
throw Error("children for MyInfiniteScroller is not an array");
@@ -14,7 +16,7 @@ const MyInfiniteScroller: React.FC = ({ children }) => {
return (
<InfiniteScroll
pageStart={1}
loadMore={(page) => setElementsToShow(page * 12)}
loadMore={(page) => setElementsToShow(page * ON_PAGE)}
hasMore={elementsToShow < children.length}
>
<Flex flexWrap="wrap" justifyContent="center" mt={4}>