import { notification } from 'antd';
import { useRef } from 'react';

export const useProgressNotification = ({
  key,
  title,
  makeDescription,
}: {
  key: string;
  title: string;
  makeDescription: (seconds: number) => string;
}): {
  activateProgressMessage: () => void;
  stopProgressMessage: () => void;
} => {
  // NOTE:
  // useRef здесь используется потому что в отличие от useState он не вызывает
  // повторный рендер компонента, в котором используется

  const intervalId = useRef<number>();

  const seconds = useRef<number>(0);

  const activateProgressMessage = (): void => {
    seconds.current = 0;
    intervalId.current = window.setInterval(() => {
      seconds.current = seconds.current + 1;
      notification.info({
        key,
        message: title,
        description: makeDescription(seconds.current),
        duration: 0,
      });
    }, 1000);
  };

  const stopProgressMessage = (): void => {
    notification.close(key);
    window.clearInterval(intervalId.current);
    intervalId.current = undefined;
    seconds.current = 0;
  };

  return {
    activateProgressMessage,
    stopProgressMessage,
  };
};
