fix: Improved loading jank fix, new DelayedMount component

This commit is contained in:
Tom Moor
2020-08-10 21:30:12 -07:00
parent 5ddc4000d0
commit 6e61df0729
3 changed files with 43 additions and 22 deletions

View File

@@ -0,0 +1,24 @@
// @flow
import * as React from "react";
type Props = {
delay?: number,
children: React.Node,
};
export default function DelayedMount({ delay = 150, children }: Props) {
const [isShowing, setShowing] = React.useState(false);
React.useEffect(() => {
const timeout = setTimeout(() => setShowing(true), delay);
return () => {
clearTimeout(timeout);
};
}, []);
if (!isShowing) {
return null;
}
return children;
}