/*! * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express * or implied. See the License for the specific language governing * permissions and limitations under the License. */ import React from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; import Collapse from 'react-bootstrap/lib/Collapse.js'; class NavigationSideBar extends React.Component { static PropTypes = { activeItemId: PropTypes.string.isRequired, onSelect: PropTypes.func, onToggle: PropTypes.func, groups: PropTypes.array }; constructor(props) { super(props); this.state = { activeItemId: null }; this.handleItemClicked = this.handleItemClicked.bind(this); } render() { let {groups, activeItemId} = this.props; return (
{groups.map(group => ( ))}
); } handleItemClicked(event, item) { event.stopPropagation(); if(this.props.onToggle) { this.props.onToggle(this.props.groups, item.id); } if(item.onSelect) { item.onSelect(); } if(this.props.onSelect) { this.props.onSelect(item); } } } class NavigationMenu extends React.Component { static PropTypes = { activeItemId: PropTypes.string.isRequired, onNavigationItemClick: PropTypes.func, menu: PropTypes.array }; render() { const {menu, activeItemId, onNavigationItemClick} = this.props; return (
); } } function NavigationMenuHeader(props) { return
{props.title}
; } function getItemDataTestId(itemId) { return itemId.split('|')[0]; } function NavigationMenuItems(props) { const {items, activeItemId, onNavigationItemClick} = props; return (
{ items && items.map(item => ()) }
); } function NavigationMenuItem(props) { const {onNavigationItemClick, item, activeItemId} = props; const isGroup = item.items && item.items.length > 0; return (
{isGroup &&
{item.items.map(subItem => ()) }
}
); } function NavigationLink(props) { const {item, activeItemId, onClick} = props; // todo should this be button return (
onClick(event, item)} data-test-id={'navbar-group-item-' + getItemDataTestId(item.id)}> {item.name}
); } export default NavigationSideBar;