50 lines
1.3 KiB
JavaScript
50 lines
1.3 KiB
JavaScript
import { h, Component } from 'preact';
|
|
import PropTypes from 'prop-types';
|
|
import { userPropTypes } from '../common-prop-types';
|
|
|
|
class SidebarUser extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.onClick = this.onClick.bind(this);
|
|
}
|
|
|
|
onClick() {
|
|
const { followUser, user } = this.props;
|
|
followUser(user);
|
|
}
|
|
|
|
render() {
|
|
const { user } = this.props;
|
|
return (
|
|
<div className="widget-list-item__suggestions">
|
|
<a href={`/${user.username}`} className="widget-list-item__avatar">
|
|
<img
|
|
src={user.profile_image_url}
|
|
alt={user.name}
|
|
className="widget-list-item__profile-pic"
|
|
/>
|
|
</a>
|
|
<div className="widget-list-item__content">
|
|
<h5>
|
|
<a href={`/${user.username}`}>{user.name}</a>
|
|
</h5>
|
|
<button
|
|
className="widget-list-item__follow-button"
|
|
type="button"
|
|
onClick={this.onClick}
|
|
id={`widget-list-item__follow-button-${user.username}`}
|
|
>
|
|
{user.following ? '✓ FOLLOWING' : '+ FOLLOW'}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
SidebarUser.propTypes = {
|
|
followUser: PropTypes.func.isRequired,
|
|
user: PropTypes.objectOf(userPropTypes).isRequired,
|
|
};
|
|
|
|
export default SidebarUser;
|