import React from 'react';
import PropTypes from 'prop-types';
import Header from './Header';
import NavList from './NavList';
import NavItem from './NavItem';
import HeaderDetails from './HeaderDetails';

var ManagerSideNav = function ManagerSideNav(props) {
  var testSection = props.testSection,
      children = props.children;

  var renderChildrenByType = function renderChildrenByType(ComponentType) {
    return React.Children.toArray(children).filter(function (child) {
      return child.type === ComponentType;
    }).map(function (element) {
      return React.cloneElement(element);
    });
  };

  return React.createElement("div", {
    "data-ui-component": true,
    "data-test-section": testSection,
    className: 'oui-manager-side-nav stage__item__content--column'
  }, renderChildrenByType(Header), React.createElement("div", {
    className: "sidenav__body"
  }, renderChildrenByType(NavList)));
};

ManagerSideNav.propTypes = {
  // eslint-disable-next-line valid-jsdoc

  /* Allowed children are ManagerSideNav's Header and NavList*/
  children: function children(props, propName) {
    var prop = props[propName];
    var error = null;
    React.Children.forEach(prop, function (child) {
      if (child === null) {
        return;
      }

      if (![Header, NavList].includes(child.type)) {
        error = new Error('Children of ManagerSideNav should be of type Header or NavList.');
      }
    });
    return error;
  },

  /** Value used for testing via data-test-section attribute */
  testSection: PropTypes.string
};
ManagerSideNav.defaultProps = {
  testSection: ''
};
ManagerSideNav.Header = Header;
ManagerSideNav.HeaderDetails = HeaderDetails;
ManagerSideNav.NavList = NavList;
ManagerSideNav.NavItem = NavItem;
export default ManagerSideNav;