diff options
Diffstat (limited to 'webapp/components/admin_console/admin_sidebar_section.jsx')
-rw-r--r-- | webapp/components/admin_console/admin_sidebar_section.jsx | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/webapp/components/admin_console/admin_sidebar_section.jsx b/webapp/components/admin_console/admin_sidebar_section.jsx new file mode 100644 index 000000000..0492745ca --- /dev/null +++ b/webapp/components/admin_console/admin_sidebar_section.jsx @@ -0,0 +1,80 @@ +// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import React from 'react'; + +import {Link} from 'react-router'; + +export default class AdminSidebarSection extends React.Component { + static get propTypes() { + return { + name: React.PropTypes.string.isRequired, + title: React.PropTypes.node.isRequired, + parentLink: React.PropTypes.string, + subsection: React.PropTypes.bool, + children: React.PropTypes.arrayOf(React.PropTypes.element), + action: React.PropTypes.node, + onlyActiveOnIndex: React.PropTypes.bool + }; + } + + static get defaultProps() { + return { + parentLink: '', + subsection: false, + children: [], + onlyActiveOnIndex: true + }; + } + + getLink() { + return this.props.parentLink + '/' + this.props.name; + } + + render() { + const link = this.getLink(); + + let clonedChildren = null; + if (this.props.children.length > 0) { + clonedChildren = ( + <ul className='nav nav__sub-menu subsections'> + { + React.Children.map(this.props.children, (child) => { + if (child === null) { + return null; + } + + return React.cloneElement(child, { + parentLink: link, + subsection: true + }); + }) + } + </ul> + ); + } + + let className = 'sidebar-section'; + if (this.props.subsection) { + className += ' sidebar-subsection'; + } + + return ( + <li className={className}> + <Link + className={`${className}-title`} + activeClassName={`${className}-title ${className}-title--active`} + onlyActiveOnIndex={this.props.onlyActiveOnIndex} + onClick={this.handleClick} + to={link} + > + <span className={`${className}-title__text`}> + {this.props.title} + </span> + {this.props.action} + </Link> + {clonedChildren} + </li> + ); + } +} |