Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #862 from Stremio/fix/infinite-scroll-large-screens

Browse source 
Discover Page: Fix infinite scroll issue on large screens
This commit is contained in:
Timothy Z. 2025-04-02 14:03:35 +03:00 committed by GitHub
commit 438268639a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 11 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/routes/Discover/Discover.js
View file

@ -11,7 +11,7 @@ const useDiscover = require('./useDiscover');
const useSelectableInputs = require('./useSelectableInputs');
const styles = require('./styles');
const SCROLL_TO_BOTTOM_TRESHOLD = 400;
const SCROLL_TO_BOTTOM_THRESHOLD = 400;
const Discover = ({ urlParams, queryParams }) => {
const { core } = useServices();
@ -26,6 +26,15 @@ const Discover = ({ urlParams, queryParams }) => {
metasContainerRef.current.scrollTop = 0;
}
}, [discover.catalog]);
React.useEffect(() => {
if (hasNextPage && metasContainerRef.current) {
const containerHeight = metasContainerRef.current.scrollHeight;
const viewportHeight = metasContainerRef.current.clientHeight;
if (containerHeight <= viewportHeight + SCROLL_TO_BOTTOM_THRESHOLD) {
loadNextPage();
}
}
}, [hasNextPage, loadNextPage]);
const selectedMetaItem = React.useMemo(() => {
return discover.catalog !== null &&
discover.catalog.content.type === 'Ready' &&
@ -76,7 +85,7 @@ const Discover = ({ urlParams, queryParams }) => {
loadNextPage();
}
}, [hasNextPage, loadNextPage]);
const onScroll = useOnScrollToBottom(onScrollToBottom, SCROLL_TO_BOTTOM_TRESHOLD);
const onScroll = useOnScrollToBottom(onScrollToBottom, SCROLL_TO_BOTTOM_THRESHOLD);
React.useEffect(() => {
closeInputsModal();
closeAddonModal();