Import React, { Component } from 'react'; import { Link }

from 'react-router-dom';

export default class Contact extends Component {
state= {
showContactInfo: false
};

onShowClick = () => {
this.setState({
showContactInfo: !this.state.showContactInfo
});
};

render() {
const {showContactInfo} = this.state;

return (
<div className="card card-body mb-3">
<h4>
{this.props.name} {this.props.id} {' '}
<i
onClick={this.onShowClick}
className="fas fa-sort-down"
style={{ cursor: 'pointer' }}
></i>
<Link to="/">
<i
className="fas fa-pencil-alt"
style={{
cursor: 'pointer',
float: 'right',
marginRight: '1rem'
}}
></i>
</Link>
</h4>
{showContactInfo ? (
<ul className="list-group">
<li className="list-group-item">Email: {this.props.email}</li>
<li className="list-group-item">Phone: {this.props.phone}</li>
</ul>
) : null}
</div>

)
}
}

у тебя в консоли ошибки насчет Link нету?