Function useTimedAnimation

packages/shared/src/hooks/useTimedAnimation.ts:24–138

({
  autoEndAnimation = true,
  outAnimationDuration = OUT_ANIMATION_DURATION,
  onAnimationEnd,
}: UseTimedAnimationProps)

const MANUAL_DISMISS_ANIMATION_ID = 1;

export const useTimedAnimation = ({
  autoEndAnimation = true,
  outAnimationDuration = OUT_ANIMATION_DURATION,
  onAnimationEnd,
}: UseTimedAnimationProps): UseTimedAnimation => {
  const [timer, setTimer] = useState(0);
  const interval = useRef<number>();
  const hasStartedAnimation = useRef(false);
  const [animationEnd] = useDebounceFn(
    onAnimationEnd ?? (() => undefined),
    outAnimationDuration,
  );

  const clearInterval = () => {
    if (!interval?.current) {
      return;
    }

    window.clearInterval(interval.current);
    interval.current = undefined;
  };

  const endAnimation = useCallback(() => {
    // Guard on hasStartedAnimation (not interval.current): hover-pause clears
    // the interval, so an interval check would make dismiss/undo a no-op while
    // the pointer is over the toast. A started-but-paused animation must still
    // be endable.
    if (!hasStartedAnimation.current) {
      return;
    }

    setTimer(0);
  }, []);

  const runTick = useCallback(() => {
    interval.current = window.setInterval(
      () =>
        setTimer((current) =>
          PROGRESS_INTERVAL >= current ? 0 : current - PROGRESS_INTERVAL,
        ),
      PROGRESS_INTERVAL,
    );
  }, []);

  const startAnimation = useCallback(
    (duration: number) => {
      if (interval.current) {
        clearInterval();
      }

      setTimer(duration);

      if (isNullOrUndefined(duration) || duration <= 0) {
        return;
      }

      hasStartedAnimation.current = true;