convert ansi colors to spans

This commit is contained in:
Jonathan Rainville 2018-09-05 13:08:13 -04:00 committed by Pascal Precht
parent 1e721fa4f6
commit 426f71fd98
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
2 changed files with 5 additions and 2 deletions

View File

@ -4,6 +4,7 @@
"private": true, "private": true,
"dependencies": { "dependencies": {
"ace-mode-solidity": "^0.1.0", "ace-mode-solidity": "^0.1.0",
"ansi-to-html": "^0.6.6",
"axios": "^0.18.0", "axios": "^0.18.0",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"connected-react-router": "^4.3.0", "connected-react-router": "^4.3.0",

View File

@ -1,16 +1,18 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import {Page} from "tabler-react"; import {Page} from "tabler-react";
import Convert from 'ansi-to-html';
const convert = new Convert();
class Process extends Component { class Process extends Component {
render() { render() {
const {processLogs, process}= this.props; const {processLogs, process}= this.props;
return ( return (
<Page.Content className="text-capitalize" title={process.name}> <Page.Content title={process.name}>
<p className="text-capitalize">State: {process.state}</p> <p className="text-capitalize">State: {process.state}</p>
<div className="logs"> <div className="logs">
{ {
processLogs.map((item, i) => <p key={i} className={item.logLevel}>{item.msg_clear || item.msg}</p>) processLogs.map((item, i) => <p key={i} className={item.logLevel} dangerouslySetInnerHTML={{__html: convert.toHtml(item.msg)}}></p>)
} }
</div> </div>
</Page.Content> </Page.Content>