import React, { useContext } from 'react';
import PropTypes from 'prop-types';
import { Context } from 'gatsby-core-theme/src/context/MainProvider';
import { translate } from 'gatsby-core-theme/src/helpers/getters';
import Link from 'gatsby-core-theme/src/hooks/link';

const ReviewLink = ({
  template,
  pageName,
  operatorName,
  reviewPath,
  className,
  isComparisonTable = false,
}) => {
  let isBonusTemplate = false;
  const { translations } = useContext(Context) || {};

  if (['free_bonuses', 'bonus_pages', 'casino_bonus'].includes(template)) {
    isBonusTemplate = true;
  }

  return (
    <Link className={className || ''} to={reviewPath}>{`${
      isBonusTemplate
        ? translate(translations, 'bonus', '[operator_name] Bonus').replace(
            '[operator_name]',
            pageName || operatorName
          )
        : translate(
            translations,
            isComparisonTable ? 'read_review_comparison' : 'read_review',
            (pageName && '[operator_name]') || (operatorName && '[operator_name] Review')
          ).replace('[operator_name]', pageName || operatorName)
    }`}</Link>
  );
};

ReviewLink.propTypes = {
  template: PropTypes.string,
  pageName: PropTypes.string,
  operatorName: PropTypes.string,
  reviewPath: PropTypes.string,
  className: PropTypes.string,
  isComparisonTable: PropTypes.bool,
};

export default ReviewLink;
