58 lines
1.5 KiB
JavaScript
58 lines
1.5 KiB
JavaScript
import { Divider, Space, Tag, Timeline } from "antd";
|
|
import moment from "moment";
|
|
import React from "react";
|
|
import { connect } from "react-redux";
|
|
import { createStructuredSelector } from "reselect";
|
|
import {
|
|
setBreadcrumbs,
|
|
setSelectedHeader,
|
|
} from "../../redux/application/application.actions";
|
|
import { selectBodyshop } from "../../redux/user/user.selectors";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
bodyshop: selectBodyshop,
|
|
});
|
|
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
|
|
setSelectedHeader: (key) => dispatch(setSelectedHeader(key)),
|
|
});
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(DmsLogEvents);
|
|
|
|
export function DmsLogEvents({ socket, logs, bodyshop }) {
|
|
return (
|
|
<Timeline pending
|
|
reverse={true}
|
|
>
|
|
{logs.map((log, idx) => (
|
|
<Timeline.Item key={idx} color={LogLevelHierarchy(log.level)}>
|
|
<Space wrap align="start" style={{}}>
|
|
<Tag color={LogLevelHierarchy(log.level)}>{log.level}</Tag>
|
|
<span>{moment(log.timestamp).format("MM/DD/YYYY HH:mm:ss")}</span>
|
|
<Divider type="vertical" />
|
|
<span>{log.message}</span>
|
|
</Space>
|
|
</Timeline.Item>
|
|
))}
|
|
</Timeline>
|
|
);
|
|
}
|
|
|
|
function LogLevelHierarchy(level) {
|
|
switch (level) {
|
|
case "TRACE":
|
|
return "pink";
|
|
case "DEBUG":
|
|
return "orange";
|
|
case "INFO":
|
|
return "blue";
|
|
case "WARNING":
|
|
return "yellow";
|
|
case "ERROR":
|
|
return "red";
|
|
default:
|
|
return 0;
|
|
}
|
|
}
|