import { useModal } from '@material-hu/hooks/useModal';

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

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

type UseMultipleAssignmentConfirmModalParams = {
  count: number;
  selectedAgentFullName: string;
  onConfirm: () => void;
  onClose: () => void;
  isLoading: boolean;
};

export const useMultipleAssignmentConfirmModal = ({
  count,
  selectedAgentFullName,
  onConfirm,
  onClose,
  isLoading,
}: UseMultipleAssignmentConfirmModalParams) => {
  const { t } = useLokaliseTranslation('service_management');

  const {
    modal: multipleAssignmentConfirmationModal,
    showModal: openMultipleAssignmentConfirmationModal,
    closeModal: closeMultipleAssignmentConfirmationModal,
  } = useModal(
    () => (
      <HuDialog
        title={t('confirm_reassignment_title', {
          count,
          agentName: selectedAgentFullName,
        })}
        textBody={t('confirm_reassignment_body')}
        primaryButtonProps={{
          color: 'primary',
          children: t('assign'),
          onClick: onConfirm,
          loading: isLoading,
        }}
        secondaryButtonProps={{
          color: 'primary',
          children: t('cancel'),
          onClick: onClose,
          disabled: isLoading,
        }}
        onClose={onClose}
      />
    ),
    { fullWidth: true },
  );

  return {
    multipleAssignmentConfirmationModal,
    openMultipleAssignmentConfirmationModal,
    closeMultipleAssignmentConfirmationModal,
  };
};
