import React, { FC } from 'react';
import { useTranslation } from 'react-i18next';
import { Link as RouterLink } from 'react-router-dom';
import { ButtonProps, Button } from '@chakra-ui/react';

import { URLs } from '../../../__data__/urls';

export const CtaButton: FC<ButtonProps> = (props) => {
  const { t } = useTranslation('~', { keyPrefix: 'dry-wash.landing' });

  return (
    <Button
      as={RouterLink}
      to={URLs.orderCreate.getUrl()}
      colorScheme='primary'
      {...props}
    >
      {t('make-order-button')}
    </Button>
  );
};
