1
import { useEffect, useState } from "react";
2
import useIsMountedRef from "@cocalc/frontend/app-framework/is-mounted-hook";
3
import { Progress } from "antd";
4
import { delay } from "awaiting";
5

6
const DELAY = 2;
7

8
export default function FakeProgress({ time }) {
9
  const [percent, setPercent] = useState<number>(0);
10
  const isMountedRef = useIsMountedRef();
11

12
  useEffect(() => {
13
    (async () => {
14
      let t0 = 0;
15
      while (t0 <= time) {
16
        await delay(DELAY);
17
        if (!isMountedRef.current) return;
18
        t0 += DELAY;
19
        setPercent(Math.round((t0 * 100) / time));
20
      }
21
    })();
22
  }, []);
23

24
  return (
25
    <Progress
26
      type="circle"
27
      format={() => null}
28
      percent={percent}
29
      strokeColor={{ "0%": "#108ee9", "100%": "#87d068" }}
30
    />
31
  );
32
}
33

34