62 lines
No EOL
1.3 KiB
TypeScript
62 lines
No EOL
1.3 KiB
TypeScript
import React from 'react';
|
|
import { NoContent } from 'UI';
|
|
import { Styles, Table } from '../../common';
|
|
import { List } from 'immutable';
|
|
|
|
import Chart from './Chart';
|
|
import ResourceInfo from './ResourceInfo';
|
|
import CopyPath from './CopyPath';
|
|
|
|
const cols = [
|
|
{
|
|
key: 'resource',
|
|
title: 'Resource',
|
|
Component: ResourceInfo,
|
|
width: '40%',
|
|
},
|
|
{
|
|
key: 'sessions',
|
|
title: 'Sessions',
|
|
toText: count => `${ count > 1000 ? Math.trunc(count / 1000) : count }${ count > 1000 ? 'k' : '' }`,
|
|
width: '20%',
|
|
},
|
|
{
|
|
key: 'trend',
|
|
title: 'Trend',
|
|
Component: Chart,
|
|
width: '20%',
|
|
},
|
|
{
|
|
key: 'copy-path',
|
|
title: '',
|
|
Component: CopyPath,
|
|
cellClass: 'invisible group-hover:visible text-right',
|
|
width: '20%',
|
|
}
|
|
];
|
|
|
|
interface Props {
|
|
data: any
|
|
}
|
|
function MissingResources(props: Props) {
|
|
const { data } = props;
|
|
|
|
return (
|
|
<NoContent
|
|
title="No resources missing."
|
|
size="small"
|
|
show={ data.chart.length === 0 }
|
|
>
|
|
<div style={{ height: '240px'}}>
|
|
<Table
|
|
small
|
|
cols={ cols }
|
|
rows={ List(data.chart) }
|
|
rowClass="group"
|
|
/>
|
|
</div>
|
|
</NoContent>
|
|
);
|
|
}
|
|
|
|
export default MissingResources; |