import React from 'react' import { makeStyles } from '@material-ui/styles' import Breadcrumbs from '@material-ui/core/Breadcrumbs'; import Link from '@material-ui/core/Link'; import Typography from '@material-ui/core/Typography'; const useStyles = makeStyles({ root: { alignItems: 'center', display: 'flex', flexFlow: 'row', marginBottom: 20, width: '100%', }, context: { flex: '1 0 auto', }, actions: { flex: '0 0 auto', }, }); const Header = (props) => { const classes = useStyles() const { title, breadcrumbs } = props return (
{title && {props.title}} {breadcrumbs && breadcrumbs.length > 0 && ( {breadcrumbs.slice(0, breadcrumbs.length-1).map(b => ( {b.name} ))} {breadcrumbs[breadcrumbs.length-1].name} )}
{props.children}
) } export default Header