import React, { Component } from 'react';
import PropTypes from 'prop-types';
import './index.scss';

const propTypes = {
  resume: PropTypes.string,
  email: PropTypes.string,
  phone_number: PropTypes.string
};

class ContactLinks extends Component {
  displayLink (prop, icon, title) {
    if (prop) {
      return (
        <li className='contact-links__link'>
          <a
            className='row-start'
            href={prop}
          >
            <i className={`fa fa-${icon} contact-links__icon`}></i>
            <p className='contact-links__title'>{title}</p>
          </a>
        </li>
      );
    }

    return null;
  }

  render () {
    return (
      <ul className='contact-links'>
        {this.displayLink(
          `mailto:${this.props.email}`,
          'envelope',
          this.props.email
        )}
        {this.displayLink(
          `tel:${this.props.phone_number}`,
          'phone',
          this.props.phone_number
        )}
      </ul>
    );
  }
}

ContactLinks.propTypes = propTypes;

export default ContactLinks;

@@ -831,143 +831,8 @@
  )%7D%0A
-        %7Bthis.displayLink(%0A          %60tel:$%7Bthis.props.phone_number%7D%60,%0A          'phone',%0A          this.props.phone_number%0A        )%7D%0A
     

no phone number