console-feed-modern
Version:
A React component that displays console logs from the current page, an iframe or transported across a server
50 lines • 4.38 kB
JavaScript
import * as React from 'react';
import { render } from 'react-dom';
import update from 'immutability-helper';
import { Hook, Console, Decode } from '../../src';
const iframe = document.createElement('iframe');
iframe.src = './iframe.html';
document.body.appendChild(iframe);
class App extends React.Component {
constructor() {
super(...arguments);
this.state = {
logs: [
{
method: 'result',
data: ['Result']
},
{
method: 'command',
data: ['Command']
}
],
filter: [],
searchKeywords: ''
};
this.switch = () => {
const filter = this.state.filter.length === 0 ? ['log'] : [];
this.setState({
filter
});
};
this.handleKeywordsChange = ({ target: { value: searchKeywords } }) => {
this.setState({ searchKeywords });
};
}
componentDidMount() {
Hook(iframe.contentWindow.console, log => {
const decoded = Decode(log);
this.setState(state => update(state, { logs: { $push: [decoded] } }));
});
}
render() {
return (React.createElement("div", { style: { backgroundColor: '#242424' } },
React.createElement("div", null,
React.createElement("button", { onClick: this.switch.bind(this) }, "Show only logs"),
React.createElement("input", { placeholder: "search", onChange: this.handleKeywordsChange })),
React.createElement(Console, { logs: this.state.logs, variant: "dark", filter: this.state.filter, searchKeywords: this.state.searchKeywords })));
}
}
render(React.createElement(App, null), document.querySelector('#demo'));
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9kZW1vL3NyYy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNsQyxPQUFPLE1BQU0sTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFakQsTUFBTSxNQUFNLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxRQUFRLENBQUMsQ0FBQTtBQUMvQyxNQUFNLENBQUMsR0FBRyxHQUFHLGVBQWUsQ0FBQTtBQUM1QixRQUFRLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsQ0FBQTtBQUVqQyxNQUFNLEdBQUksU0FBUSxLQUFLLENBQUMsU0FBUztJQUFqQzs7UUFDRSxVQUFLLEdBQUc7WUFDTixJQUFJLEVBQUU7Z0JBQ0o7b0JBQ0UsTUFBTSxFQUFFLFFBQVE7b0JBQ2hCLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQztpQkFDakI7Z0JBQ0Q7b0JBQ0UsTUFBTSxFQUFFLFNBQVM7b0JBQ2pCLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQztpQkFDbEI7YUFDTztZQUNWLE1BQU0sRUFBRSxFQUFFO1lBQ1YsY0FBYyxFQUFFLEVBQUU7U0FDbkIsQ0FBQTtRQVNELFdBQU0sR0FBRyxHQUFHLEVBQUU7WUFDWixNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxNQUFNLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUE7WUFDNUQsSUFBSSxDQUFDLFFBQVEsQ0FBQztnQkFDWixNQUFNO2FBQ1AsQ0FBQyxDQUFBO1FBQ0osQ0FBQyxDQUFBO1FBRUQseUJBQW9CLEdBQUcsQ0FBQyxFQUFFLE1BQU0sRUFBRSxFQUFFLEtBQUssRUFBRSxjQUFjLEVBQUUsRUFBRSxFQUFFLEVBQUU7WUFDL0QsSUFBSSxDQUFDLFFBQVEsQ0FBQyxFQUFFLGNBQWMsRUFBRSxDQUFDLENBQUE7UUFDbkMsQ0FBQyxDQUFBO0lBbUJILENBQUM7SUFuQ0MsaUJBQWlCO1FBQ2YsSUFBSSxDQUFFLE1BQU0sQ0FBQyxhQUFxQixDQUFDLE9BQU8sRUFBRSxHQUFHLENBQUMsRUFBRTtZQUNoRCxNQUFNLE9BQU8sR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFDLENBQUE7WUFDM0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsRUFBRSxJQUFJLEVBQUUsRUFBRSxLQUFLLEVBQUUsQ0FBQyxPQUFPLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFBO1FBQ3ZFLENBQUMsQ0FBQyxDQUFBO0lBQ0osQ0FBQztJQWFELE1BQU07UUFDSixPQUFPLENBQ0wsNkJBQUssS0FBSyxFQUFFLEVBQUUsZUFBZSxFQUFFLFNBQVMsRUFBRTtZQUN4QztnQkFDRSxnQ0FBUSxPQUFPLEVBQUUsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLHFCQUF5QjtnQkFDaEUsK0JBQU8sV0FBVyxFQUFDLFFBQVEsRUFBQyxRQUFRLEVBQUUsSUFBSSxDQUFDLG9CQUFvQixHQUFJLENBQy9EO1lBRU4sb0JBQUMsT0FBTyxJQUNOLElBQUksRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksRUFDckIsT0FBTyxFQUFDLE1BQU0sRUFDZCxNQUFNLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQ3pCLGNBQWMsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLGNBQWMsR0FDekMsQ0FDRSxDQUNQLENBQUE7SUFDSCxDQUFDO0NBQ0Y7QUFFRCxNQUFNLENBQUMsb0JBQUMsR0FBRyxPQUFHLEVBQUUsUUFBUSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFBIn0=