1
import { ReactNode, useEffect, useState } from "react";
2
import useIsMountedRef from "@cocalc/frontend/app-framework/is-mounted-hook";
3

4
interface Props {
5
  delayMs: number;
6
  children?: ReactNode;
7
}
8

9
export default function Delay({ children, delayMs }: Props) {
10
  const [show, setShow] = useState<boolean>(false);
11

12
  const isMountedRef = useIsMountedRef();
13

14
  useEffect(() => {
15
    setTimeout(() => {
16
      if (!isMountedRef.current) return;
17
      setShow(true);
18
    }, delayMs);
19
  }, []);
20

21
  return show ? <>{children}</> : <></>;
22
}
23

24