github.com/replicatedhq/ship@v0.55.0/web/init/src/components/shared/SidebarItem.jsx (about) 1 import * as React from "react"; 2 import { Link } from "react-router-dom"; 3 import { HashLink } from "react-router-hash-link"; 4 5 const stopPropagation = (e) => e.stopPropagation(); 6 export default class SidebarItem extends React.Component { 7 static defaultProps = { 8 className: "", 9 linkClassName: "", 10 onClick: () => { return; }, 11 }; 12 13 render() { 14 const { 15 isActive, 16 label, 17 className, 18 linkClassName, 19 linkTo, 20 subItemLinkTo, 21 onClick, 22 } = this.props; 23 24 return ( 25 <div 26 className={`SidebarItem-wrapper u-position--relative ${isActive ? "is-active" : ""} ${className || ""}`} 27 onClick={(e) => { 28 onClick(e); 29 stopPropagation(e); 30 }} 31 > 32 <div className="SidebarItem"> 33 {linkTo ? 34 <Link className={linkClassName} to={linkTo} tabIndex="-1">{label}</Link> 35 : subItemLinkTo ? 36 <HashLink className="SubItem-label" to={subItemLinkTo} scroll={el => el.scrollIntoView({ behavior: "smooth", block: "start" })} tabIndex="-1">{label}</HashLink> 37 : 38 <span className="SubItem-label">{label}</span> 39 } 40 </div> 41 </div> 42 ); 43 } 44 }