/* eslint-disable no-return-assign */
/* eslint-disable no-plusplus */
/* eslint-disable no-var */
import React, { useRef } from 'react';
import PropTypes from 'prop-types';
import LazyImage from '~hooks/lazy-image';

const Disclaimer = ({ dmcaImage, imgWidth = 100, imgHeight = 33, loading = 'eager' }) => {
  const anchorElement = useRef(null);

  function dmca() {
    document.addEventListener(
      'click',
      () => {
        const element = anchorElement.current;
        if (element.getAttribute('href').indexOf('refurl') < 0) {
          element.href = `${`${
            element.href + (element.href.indexOf('?') === -1 ? '?' : '&')
          }refurl`}=${document.location.href.replace(/\/$/, '')}`;
        }
      },
      false
    );
  }

  return (
    <a
      ref={anchorElement}
      onClick={dmca}
      href={`//www.dmca.com/Protection/Status.aspx?ID=${process.env.DMCA_PROTECTION_ID}`}
      title="DMCA.com Protection Status"
      target="_blank"
      rel="noreferrer"
    >
      <LazyImage
        alt="DMCA.com Protection Status"
        width={imgWidth}
        height={imgHeight}
        src={dmcaImage}
        loading={loading}
      />
    </a>
  );
};

export default Disclaimer;

Disclaimer.propTypes = {
  dmcaImage: PropTypes.string,
  imgWidth: PropTypes.number,
  imgHeight: PropTypes.number,
  loading: PropTypes.string,
};
