import { lazy } from 'react';

import { useLazyModal } from '@material-hu/hooks/useLazyModal';
import { IconTrash } from '@material-hu/icons/tabler';

import { type Article } from 'src/pages/dashboard/HuLibraries/types';
import { useLokaliseTranslation } from 'src/utils/i18n';

const DeleteArticleModal = lazy(
  () => import('../components/DeleteArticleModal'),
);

export const useDeleteActions = (
  article: Article,
  disableUnsavedWarning: () => void,
  resetUnsavedWarning: () => void,
) => {
  const { t } = useLokaliseTranslation('libraries');

  const { modal: deleteArticleModal, showModal: showDeleteArticleModal } =
    useLazyModal(DeleteArticleModal);

  const handleDeleteArticle = () =>
    showDeleteArticleModal({
      article,
      disableUnsavedWarning,
      resetUnsavedWarning,
    });

  const actions = [
    {
      when: true,
      action: {
        key: 'delete-article',
        title: t('article.delete.title'),
        onClick: handleDeleteArticle,
        avatar: { Icon: IconTrash },
      },
    },
  ];

  return {
    actions,
    components: deleteArticleModal,
  };
};
