import Dialog from '@material-hu/components/design-system/Dialog';

import { useLokaliseTranslation } from 'src/utils/i18n';

import { CertificateAction, CertificateStatus } from '../../constants';
import { type CertificateStatusAction } from '../../types';
import { usePatchLearningCertificateStatus } from '../usePatchLearningCertificateStatus';

type CertificateStatusDialogProps = {
  certificateId: number;
  certificateName: string;
  action: CertificateStatusAction;
  onClose: () => void;
};

const CertificateStatusDialog = ({
  certificateId,
  certificateName,
  action,
  onClose,
}: CertificateStatusDialogProps) => {
  const { t } = useLokaliseTranslation('learning');
  const { mutate, isLoading } = usePatchLearningCertificateStatus();

  const handleConfirm = () => {
    mutate(
      {
        certificateId,
        certificateName,
        status:
          action === CertificateAction.ACTIVATE
            ? CertificateStatus.ACTIVE
            : CertificateStatus.INACTIVE,
      },
      { onSettled: onClose },
    );
  };

  return (
    <Dialog
      onClose={onClose}
      title={t(`settings.certificates.actions.${action}.confirm_title`, {
        certificateName,
      })}
      textBody={t(`settings.certificates.actions.${action}.confirm_body`)}
      primaryButtonProps={{
        children: t(`settings.certificates.actions.${action}.confirm_primary`),
        onClick: handleConfirm,
        loading: isLoading,
        disabled: isLoading,
      }}
      secondaryButtonProps={{
        children: t('general:cancel'),
        onClick: onClose,
        disabled: isLoading,
      }}
    />
  );
};

export default CertificateStatusDialog;