import React from 'react';
import { Box, Text } from '@nova-hf/ui';
import { useRouter } from 'next/router';
import ChangePayDate from '../../../change-pay-date/ChangePayDate';
import { useTranslation } from 'utils/i18n';

const Endurvirkja = () => {
  const router = useRouter();
  const subscriptionId = router.query.subscriptionId ?? '';
  const { t } = useTranslation('subscription');
  return (
    <Box>
      <Box margin={2}>
        <Text variant="h4">{t('reActivate.title')}</Text>
        <Text>{t('reActivate.description')}</Text>
        <Box marginTop={10}>
          <ChangePayDate subscriptionId={subscriptionId.toString()} />
        </Box>
      </Box>
    </Box>
  );
};

export default Endurvirkja;