LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

WaitUntilOnPage: Debounce to fix false positives.

Browse source 
There are cases where `WaitUntilOnPage` will incorrectly render, such as at the beginning if the upper components hasn't expanded to full size, so `WaitUntilOnPage` would be briefly visible.

Added a 300ms debounce to fix this, which would also improve scrolling performance a bit by doing less. Hopefully 300ms is enough for the upper components to inflate to full size.
This commit is contained in:
infiinte-persistence 2020-07-25 15:06:25 +08:00 • committed by Sean Yesmunt
parent 2a5d87ee54
commit 1383b19817
1 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
ui/component/common/wait-until-on-page.jsx
View file

@ -1,5 +1,8 @@
// @flow
import React from 'react';
import debounce from 'util/debounce';
const DEBOUNCE_SCROLL_HANDLER_MS = 300;
type Props = {
children: any,
@ -10,7 +13,7 @@ export default function WaitUntilOnPage(props: Props) {
const [shouldRender, setShouldRender] = React.useState(false);
React.useEffect(() => {
function handleDisplayingRef() {
const handleDisplayingRef = debounce(e => {
const element = ref && ref.current;
if (element) {
const bounding = element.getBoundingClientRect();
@ -28,12 +31,9 @@ export default function WaitUntilOnPage(props: Props) {
if (element && !shouldRender) {
window.addEventListener('scroll', handleDisplayingRef);
return () => {
window.removeEventListener('scroll', handleDisplayingRef);
};
return () => window.removeEventListener('scroll', handleDisplayingRef);
}
}
}, DEBOUNCE_SCROLL_HANDLER_MS);
if (ref) {
handleDisplayingRef();