pdf-reader-web/containers/AutoSave.tsx

import React, { useEffect } from 'react';
import { useSnackbar } from 'notistack';
import { useTranslation } from '../i18n';

import useAutoSave from '../hooks/useAutoSave';
import Icon from '../components/Icon';

const index: React.FC = () => {
  const { t } = useTranslation('toast');
  const [isSaved, isSaving] = useAutoSave();
  const { enqueueSnackbar, closeSnackbar } = useSnackbar();

  useEffect(() => {
    if (isSaving) {
      enqueueSnackbar(t('saving'), {
        variant: 'info',
        action: key => (
          <Icon glyph="close" onClick={(): void => { closeSnackbar(key); }} />
        ),
      });
    }
    if (!isSaving && isSaved) {
      enqueueSnackbar(t('saved'), {
        variant: 'success',
        action: key => (
          <Icon glyph="close" onClick={(): void => { closeSnackbar(key); }} />
        ),
      });
    }
  }, [isSaved, isSaving]);

  return (
    <>
    </>
  );
};

export default index;