Norbert de Langen 7964734eb6 IMPROVE docs
2017-05-26 18:24:53 +02:00

63 lines
1.8 KiB
JavaScript

import PropTypes from 'prop-types';
import React from 'react';
import Nav from '../Nav';
import NavDropdown from '../Nav/dropdown';
import Content from '../Content';
import './style.css';
class Container extends React.Component {
render() {
const { sections, selectedItem, selectedSectionId, selectedItemId } = this.props;
const gitHubRepoUrl = 'https://github.com/storybooks/storybook';
const docPath = `${selectedSectionId}/${selectedItemId}`;
const gitHubRepoDocUrl = `${gitHubRepoUrl}/tree/master/docs/pages/${docPath}/index.md`;
return (
<div id="docs-container" className="row">
<div className="nav col-sm-3 col-md-3 hidden-xs">
<Nav
sections={sections}
selectedSection={selectedItem.section}
selectedItem={selectedItem.id}
selectedSectionId={selectedSectionId}
selectedItemId={selectedItemId}
/>
</div>
<div className="content col-xs-12 col-sm-9 col-md-9 col-lg-9">
<div className="nav-dropdown">
<NavDropdown
sections={sections}
selectedSection={selectedItem.section}
selectedItem={selectedItem.id}
/>
</div>
<Content
title={selectedItem.title}
content={selectedItem.content}
editUrl={gitHubRepoDocUrl}
/>
<div className="nav-dropdown">
<NavDropdown
sections={sections}
selectedSection={selectedItem.section}
selectedItem={selectedItem.id}
/>
</div>
</div>
</div>
);
}
}
Container.propTypes = {
sections: PropTypes.array,
selectedItem: PropTypes.object,
selectedSectionId: PropTypes.string,
selectedItemId: PropTypes.string,
};
export default Container;