openreplay/frontend/app/components/Dashboard/Widgets/ApplicationActivity.js
2021-05-01 15:12:01 +05:30

42 lines
1.2 KiB
JavaScript

import { Loader } from 'UI';
import { msToSec } from 'App/date';
import { CountBadge, Divider, widgetHOC } from './common';
@widgetHOC('applicationActivity')
export default class ApplicationActivity extends React.PureComponent {
render() {
const { data, loading } = this.props;
return (
<div className="flex-1 flex-shrink-0 flex justify-around items-center">
<Loader loading={ loading } size="small">
<CountBadge
title="Avg. Page Load Time"
unit="s"
icon="window"
count={ msToSec(data.avgPageLoad) }
change={ data.avgPageLoadProgress }
oppositeColors
/>
<Divider />
<CountBadge
title="Avg. Image Load Time"
unit="ms"
icon="eye"
count={ data.avgImgLoad }
change={ data.avgImgLoadProgress }
oppositeColors
/>
<Divider />
<CountBadge
title="Avg. Request Load"
unit="ms"
icon="clock"
count={ data.avgReqLoad }
change={ data.avgReqLoadProgress }
oppositeColors
/>
</Loader>
</div>
);
}
}