import React from 'react';
import {useTranslation} from 'react-i18next';
import {Typography} from '@components';
import {Dialog} from '@shared/components/_HuGo/Dialog';

export interface Props {
  isVisible: boolean;
  onClose: () => void;
  onExit: () => void;
}

function SignBottomModal({isVisible, onClose, onExit}: Props) {
  const {t} = useTranslation();

  return (
    <Dialog
      onClose={onClose}
      isVisible={isVisible}
      title={t('general.attention')}
      withCloseButton={false}
      footer={{
        primaryButton: {
          text: t('learning.course.signature.sign_now'),
          onPress: onClose,
        },
        secondaryButton: {
          text: t('learning.common.exit_anyway'),
          onPress: onExit,
        },
      }}>
      <Typography align="center">
        {t('learning.course.signature.close_description')}
      </Typography>
    </Dialog>
  );
}

export default SignBottomModal;