import {useTranslation} from 'react-i18next';
import {Dialog, Typography} from '@components';

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

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

  return (
    <Dialog
      footer={{
        primaryButton: {
          text: t('time_tracker.go_back'),
          onPress: onClose,
        },
      }}
      isVisible={isVisible}
      onClose={onClose}
      title={t('time_tracker.no_connection_title')}>
      <Typography>{t('time_tracker.no_connection_description')}</Typography>
    </Dialog>
  );
}

export default NoConnectionDialog;