mirror of https://github.com/linkerd/linkerd2.git
115 lines
2.8 KiB
JavaScript
115 lines
2.8 KiB
JavaScript
import { directionColumn, extractDisplayName, srcDstColumn, tapLink } from './util/TapUtils.jsx';
|
|
import { formatLatencySec, toShortResourceName } from './util/Utils.js';
|
|
|
|
import BaseTable from './BaseTable.jsx';
|
|
import PropTypes from 'prop-types';
|
|
import React from 'react';
|
|
import SuccessRateMiniChart from './util/SuccessRateMiniChart.jsx';
|
|
import _isEmpty from 'lodash/isEmpty';
|
|
import _isNil from 'lodash/isNil';
|
|
import { withContext } from './util/AppContext.jsx';
|
|
|
|
const topColumns = (resourceType, ResourceLink, PrefixedLink) => [
|
|
{
|
|
title: ' ',
|
|
dataIndex: 'direction',
|
|
render: d => directionColumn(d.direction),
|
|
},
|
|
{
|
|
title: 'Name',
|
|
filter: d => {
|
|
const [labels, display] = extractDisplayName(d);
|
|
return _isEmpty(labels[resourceType]) ?
|
|
display.str :
|
|
`${toShortResourceName(resourceType)}/${labels[resourceType]}`;
|
|
},
|
|
key: 'src-dst',
|
|
render: d => srcDstColumn(d, resourceType, ResourceLink),
|
|
},
|
|
{
|
|
title: 'Method',
|
|
dataIndex: 'httpMethod',
|
|
filter: d => d.httpMethod,
|
|
sorter: d => d.httpMethod,
|
|
},
|
|
{
|
|
title: 'Path',
|
|
dataIndex: 'path',
|
|
filter: d => d.path,
|
|
sorter: d => d.path,
|
|
},
|
|
{
|
|
title: 'Count',
|
|
dataIndex: 'count',
|
|
isNumeric: true,
|
|
defaultSortOrder: 'desc',
|
|
sorter: d => d.count,
|
|
},
|
|
{
|
|
title: 'Best',
|
|
dataIndex: 'best',
|
|
isNumeric: true,
|
|
render: d => formatLatencySec(d.best),
|
|
sorter: d => d.best,
|
|
},
|
|
{
|
|
title: 'Worst',
|
|
dataIndex: 'worst',
|
|
isNumeric: true,
|
|
defaultSortOrder: 'desc',
|
|
render: d => formatLatencySec(d.worst),
|
|
sorter: d => d.worst,
|
|
},
|
|
{
|
|
title: 'Last',
|
|
dataIndex: 'last',
|
|
isNumeric: true,
|
|
render: d => formatLatencySec(d.last),
|
|
sorter: d => d.last,
|
|
},
|
|
{
|
|
title: 'Success Rate',
|
|
dataIndex: 'successRate',
|
|
isNumeric: true,
|
|
render: d => _isNil(d) || _isNil(d.successRate) ? '---' :
|
|
<SuccessRateMiniChart sr={d.successRate.get()} />,
|
|
sorter: d => d.successRate.get(),
|
|
},
|
|
{
|
|
title: 'Tap',
|
|
key: 'tap',
|
|
isNumeric: true,
|
|
render: d => tapLink(d, resourceType, PrefixedLink),
|
|
},
|
|
];
|
|
|
|
const TopEventTable = ({ tableRows, resourceType, api }) => {
|
|
const columns = topColumns(resourceType, api.ResourceLink, api.PrefixedLink);
|
|
|
|
return (
|
|
<BaseTable
|
|
enableFilter
|
|
tableRows={tableRows}
|
|
tableColumns={columns}
|
|
tableClassName="metric-table"
|
|
defaultOrderBy="count"
|
|
defaultOrder="desc"
|
|
padding="dense" />
|
|
);
|
|
};
|
|
|
|
TopEventTable.propTypes = {
|
|
api: PropTypes.shape({
|
|
PrefixedLink: PropTypes.func.isRequired,
|
|
ResourceLink: PropTypes.func.isRequired,
|
|
}).isRequired,
|
|
resourceType: PropTypes.string.isRequired,
|
|
tableRows: PropTypes.arrayOf(PropTypes.shape({})),
|
|
};
|
|
|
|
TopEventTable.defaultProps = {
|
|
tableRows: [],
|
|
};
|
|
|
|
export default withContext(TopEventTable);
|