import React from 'react';
import PropTypes from 'prop-types';
class NavSidebarUserPanel extends React.Component {
render() {
return (
<div className="user-panel">
{this.props.img ? (
<div className="pull-left image">
<img src={this.props.img} className="img-circle" alt={`${this.props.name ? `${this.props.name}'s '` : ''}Profile Avatar`} />
</div>
) : ''}
<div className="pull-left info">
<p>{this.props.name}</p>
<a
href={this.props.link}
onClick={this.props.onLinkClick ? e => {
e.preventDefault();
e.stopPropagation();
this.props.onLinkClick();
} : () => {}}
>
<span>
<i className={`fa fa-circle ${this.props.isOnline ? 'text-success' : 'text-danger'}`} />
{this.props.isOnline ? 'Online' : 'Offline'}
</span>
</a>
</div>
</div>
);
}
}
NavSidebarUserPanel.propTypes = {
name: PropTypes.string,
img: PropTypes.string,
link: PropTypes.string,
onLinkClick: PropTypes.func,
isOnline: PropTypes.bool
};
NavSidebarUserPanel.defaultProps = {
name: '',
isOnline: false
};
export default NavSidebarUserPanel;
|