2016-08-24 15:09:42 +02:00
|
|
|
/**
|
2017-03-18 17:34:00 +01:00
|
|
|
*
|
|
|
|
* LeftMenuLink
|
|
|
|
*
|
|
|
|
*/
|
2016-08-24 15:09:42 +02:00
|
|
|
|
|
|
|
import React from 'react';
|
|
|
|
import styles from './styles.scss';
|
2016-08-25 10:47:15 +02:00
|
|
|
import { Link } from 'react-router';
|
2017-07-21 18:15:43 +02:00
|
|
|
import _ from 'lodash';
|
2016-08-24 15:09:42 +02:00
|
|
|
|
|
|
|
class LeftMenuLink extends React.Component { // eslint-disable-line react/prefer-stateless-function
|
|
|
|
render() {
|
2017-07-21 18:15:43 +02:00
|
|
|
// We need to create our own active url checker,
|
|
|
|
// because of the two levels router.
|
|
|
|
const isLinkActive = _.startsWith(window.location.pathname.replace('/admin', ''), this.props.destination);
|
|
|
|
|
2016-08-24 15:09:42 +02:00
|
|
|
return (
|
2017-03-15 11:48:56 +01:00
|
|
|
<li>
|
2017-07-21 18:15:43 +02:00
|
|
|
<Link className={`${styles.link} ${isLinkActive ? styles.linkActive : ''}`} to={this.props.destination}>
|
|
|
|
<i className={`${styles.linkIcon} fa-${this.props.icon} fa`}></i>
|
2016-08-24 15:09:42 +02:00
|
|
|
<span className={styles.linkLabel}>{this.props.label}</span>
|
2016-08-25 10:47:15 +02:00
|
|
|
</Link>
|
2016-08-24 15:09:42 +02:00
|
|
|
</li>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
LeftMenuLink.propTypes = {
|
|
|
|
icon: React.PropTypes.string,
|
|
|
|
label: React.PropTypes.string,
|
|
|
|
destination: React.PropTypes.string,
|
2016-08-30 10:53:03 +02:00
|
|
|
isActive: React.PropTypes.bool,
|
2017-08-14 17:09:34 +02:00
|
|
|
leftMenuSections: React.PropTypes.object,
|
2016-08-24 15:09:42 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
export default LeftMenuLink;
|