@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
27 lines (26 loc) • 1.42 kB
JavaScript
import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from 'react';
import InfiniteScroll from '../index';
export default function WindowInfiniteScrollComponent() {
const [data, setData] = useState(Array.from({ length: 30 }, (_, i) => i));
const next = () => {
setTimeout(() => {
const currentLength = data.length;
const newData = [...data, ...Array.from({ length: 5 }, (_, i) => i).map((i) => i + currentLength)];
setData(newData);
}, 500);
};
const previous = () => {
setTimeout(() => {
const currentLength = data[0];
const newData = [
...Array.from({ length: 5 }, (_, i) => i)
.map((i) => i * -1 + currentLength - 1)
.reverse(),
...data
];
setData(newData);
}, 500);
};
return (_jsx(_Fragment, { children: _jsx(InfiniteScroll, Object.assign({ hasMoreNext: true, next: next, hasMorePrevious: true, previous: previous, loaderNext: _jsx("h1", { children: "Loading next..." }), loaderPrevious: _jsx("h1", { children: "Loading prev..." }), dataLength: data.length, scrollThreshold: 1 }, { children: data.map((e) => (_jsxs("div", Object.assign({ style: { height: 200, margin: 4, border: '1px solid hotpink' } }, { children: ["#", e, " row"] }), e))) })) }));
}