41 lines
941 B
JavaScript
41 lines
941 B
JavaScript
import React from 'react';
|
|
import paramCase from 'param-case';
|
|
import get from 'lodash.get';
|
|
import { Link } from 'react-router-dom';
|
|
import { Margin } from 'styled-components-spacing';
|
|
|
|
import { Breadcrumb, BreadcrumbItem } from 'joyent-ui-toolkit';
|
|
|
|
export default ({ match }) => {
|
|
const serviceGroupId = get(match, 'params.sg');
|
|
|
|
const links = [
|
|
{
|
|
name: 'Compute',
|
|
pathname: '/'
|
|
},
|
|
{
|
|
name: 'Service Groups',
|
|
pathname: '/service-groups'
|
|
}
|
|
]
|
|
.concat(
|
|
serviceGroupId && [
|
|
{
|
|
name: paramCase(serviceGroupId),
|
|
pathname: `/service-groups/${serviceGroupId}`
|
|
}
|
|
]
|
|
)
|
|
.filter(Boolean)
|
|
.map(({ name, pathname }) => (
|
|
<BreadcrumbItem key={name} to={pathname} component={Link}>
|
|
<Margin horizontal="1" vertical="3">
|
|
{name}
|
|
</Margin>
|
|
</BreadcrumbItem>
|
|
));
|
|
|
|
return <Breadcrumb>{links}</Breadcrumb>;
|
|
};
|