From 69ebf47cb52ef834d35972f2c4dad5bcafde4ca4 Mon Sep 17 00:00:00 2001 From: DispatchCommit Date: Sun, 4 Apr 2021 02:53:58 -0700 Subject: [PATCH] fix scrolling issue, limit length of chat history --- ui/component/livestreamComments/index.js | 2 +- ui/component/livestreamComments/view.jsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ui/component/livestreamComments/index.js b/ui/component/livestreamComments/index.js index 3c7b7a862..3e183e691 100644 --- a/ui/component/livestreamComments/index.js +++ b/ui/component/livestreamComments/index.js @@ -7,7 +7,7 @@ import LivestreamFeed from './view'; const select = (state, props) => ({ claim: makeSelectClaimForUri(props.uri)(state), - comments: makeSelectTopLevelCommentsForUri(props.uri)(state), + comments: makeSelectTopLevelCommentsForUri(props.uri)(state).slice(0, 25), fetchingComments: selectIsFetchingComments(state), }); diff --git a/ui/component/livestreamComments/view.jsx b/ui/component/livestreamComments/view.jsx index 2e20145f8..2cc7ef918 100644 --- a/ui/component/livestreamComments/view.jsx +++ b/ui/component/livestreamComments/view.jsx @@ -54,7 +54,7 @@ export default function LivestreamFeed(props: Props) { function handleScroll() { if (element) { const scrollHeight = element.scrollHeight - element.offsetHeight; - const isAtBottom = scrollHeight === element.scrollTop; + const isAtBottom = scrollHeight <= element.scrollTop + 100; if (!isAtBottom) { hasScrolledComments.current = true; @@ -71,7 +71,7 @@ export default function LivestreamFeed(props: Props) { // Only update comment scroll if the user hasn't scrolled up to view old comments // If they have, do nothing if (!hasScrolledComments.current || !performedInitialScroll) { - element.scrollTop = element.scrollHeight - element.offsetHeight; + setTimeout(() => (element.scrollTop = element.scrollHeight - element.offsetHeight + 100), 20); if (!performedInitialScroll) { setPerformedInitialScroll(true);