import React, { Component } from 'react';
import PropTypes from 'prop-types';

import classnames from 'classnames';

class Link extends Component {
  static propTypes = {
    children: PropTypes.any.isRequired,
    to: PropTypes.string.isRequired,
    modifier: PropTypes.oneOf(['block']),
    variant: PropTypes.oneOf(['blue', 'white', 'dark']),
  };
  static defaultProps = {
    modifier: null,
    variant: 'blue',
  };

  render() {
    const { to, modifier, children, variant, ...rest } = this.props;
    const className = classnames('Link', {
      [`Link--${modifier}`]: modifier,
      [`Link--${variant}`]: variant,
    });
    return (
      <a
        className={className}
        href={to}
        target={to.indexOf('http') === 0 ? '_blank' : '_self'}
        rel="noopener noreferrer"
        {...rest}
      >
        {children}
      </a>
    );
  }
}

export default Link;