2017-09-20 12:30:53 +03:00
|
|
|
import React from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import forceArray from 'force-array';
|
2017-11-28 16:50:55 +02:00
|
|
|
import { Margin } from 'styled-components-spacing';
|
2017-09-20 12:30:53 +03:00
|
|
|
|
2017-10-18 05:29:47 +03:00
|
|
|
import { SectionList, SectionListItem, ViewContainer } from 'joyent-ui-toolkit';
|
2017-09-20 12:30:53 +03:00
|
|
|
|
|
|
|
const getMenuItems = (links = []) =>
|
|
|
|
links.map(({ pathname, name }) => (
|
2017-10-18 05:29:47 +03:00
|
|
|
<SectionListItem key={pathname} activeClassName="active" to={pathname}>
|
|
|
|
{name}
|
2017-09-20 12:30:53 +03:00
|
|
|
</SectionListItem>
|
|
|
|
));
|
|
|
|
|
|
|
|
const Menu = ({ links = [] }) => {
|
|
|
|
const _links = forceArray(links);
|
|
|
|
|
|
|
|
if (!_links.length) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<ViewContainer plain>
|
2017-11-28 16:50:55 +02:00
|
|
|
<Margin bottom={6}>
|
|
|
|
<SectionList>{getMenuItems(_links)}</SectionList>
|
|
|
|
</Margin>
|
2017-09-20 12:30:53 +03:00
|
|
|
</ViewContainer>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
Menu.propTypes = {
|
|
|
|
links: PropTypes.arrayOf(
|
|
|
|
PropTypes.shape({
|
|
|
|
name: PropTypes.string,
|
|
|
|
pathname: PropTypes.string
|
|
|
|
})
|
|
|
|
)
|
|
|
|
};
|
|
|
|
|
|
|
|
export default Menu;
|