diff --git a/src/react/LogMonitor.js b/src/react/LogMonitor.js index 01307916..5365af09 100644 --- a/src/react/LogMonitor.js +++ b/src/react/LogMonitor.js @@ -1,7 +1,7 @@ import React, { PropTypes, findDOMNode } from 'react'; import LogMonitorEntry from './LogMonitorEntry'; import LogMonitorButton from './LogMonitorButton'; -import * as themes from "./themes"; +import * as themes from './themes'; const styles = { container: { @@ -17,7 +17,7 @@ const styles = { buttonBar: { paddingLeft: 2 } -} +}; export default class LogMonitor { constructor() { @@ -116,10 +116,10 @@ export default class LogMonitor { let theme; if (typeof this.props.theme === 'string') { if (typeof themes[this.props.theme] !== 'undefined') { - theme = themes[this.props.theme] + theme = themes[this.props.theme]; } else { console.warn('DevTools theme ' + this.props.theme + ' not found, defaulting to ocean'); - theme = themes.ocean + theme = themes.ocean; } } else { theme = this.props.theme; diff --git a/src/react/LogMonitorButton.js b/src/react/LogMonitorButton.js index 6ad9119a..81714bfc 100644 --- a/src/react/LogMonitorButton.js +++ b/src/react/LogMonitorButton.js @@ -8,9 +8,9 @@ const styles = { paddingRight: 6, marginTop: 2, display: 'inline-block', - fontSize: "0.8em" + fontSize: '0.8em' } -} +}; export default class LogMonitorButton extends React.Component { constructor(props) { @@ -18,7 +18,7 @@ export default class LogMonitorButton extends React.Component { this.state = { hovered: false, active: false - } + }; } handleMouseEnter() { @@ -39,7 +39,7 @@ export default class LogMonitorButton extends React.Component { render() { let style = { - ...styles.base, + ...styles.base }; if (this.state.hovered) { style = { diff --git a/src/react/LogMonitorEntry.js b/src/react/LogMonitorEntry.js index adcd2e20..c516656d 100644 --- a/src/react/LogMonitorEntry.js +++ b/src/react/LogMonitorEntry.js @@ -1,11 +1,11 @@ import React, { PropTypes } from 'react'; import JSONTree from './JSONTree'; -import LogMonitorEntryAction from "./LogMonitorEntryAction"; +import LogMonitorEntryAction from './LogMonitorEntryAction'; function colorFromString(theme, token) { const splitToken = token.split(''); const finalToken = splitToken.concat(splitToken.reverse()); - const number = (parseInt(finalToken, 36) + finalToken.length) % 8; + const number = (parseInt(finalToken, 36) + finalToken.length) % 8; const themeNumber = 'base0' + (number + 8).toString(16).toUpperCase(); return theme[themeNumber]; } @@ -32,7 +32,7 @@ export default class LogMonitorEntry { let errorText = error; if (!errorText) { try { - return + return ; } catch (err) { errorText = 'Error selecting state.'; } @@ -55,28 +55,28 @@ export default class LogMonitorEntry { } render() { - const { index, error, action, state, collapsed } = this.props; - const styleEntry = { - opacity: collapsed ? 0.5 : 1, - color: colorFromString(this.props.theme, action.type), - cursor: (index > 0) ? 'pointer' : 'default' - }; - return ( -
- - {!collapsed && -
- {this.printState(state, error)} -
- } + const { index, error, action, state, collapsed } = this.props; + const styleEntry = { + opacity: collapsed ? 0.5 : 1, + color: colorFromString(this.props.theme, action.type), + cursor: (index > 0) ? 'pointer' : 'default' + }; + return ( +
+ + {!collapsed && +
+ {this.printState(state, error)} +
+ }
); } diff --git a/src/react/LogMonitorEntryAction.js b/src/react/LogMonitorEntryAction.js index 680dc0f9..c22d64a5 100644 --- a/src/react/LogMonitorEntryAction.js +++ b/src/react/LogMonitorEntryAction.js @@ -1,4 +1,4 @@ -import React from "react"; +import React from 'react'; import JSONTree from './JSONTree'; const styles = { @@ -6,7 +6,7 @@ const styles = { borderTopWidth: 1, borderBottomWidth: 1, borderTopStyle: 'solid', - borderBottomStyle: 'solid', + borderBottomStyle: 'solid' }, actionBar: { paddingTop: 4, @@ -18,15 +18,18 @@ const styles = { backgroundColor: '#252c33', paddingLeft: 15 } -} +}; + export default class LogMonitorAction extends React.Component { + renderPayload(payload) { return (
- { Object.keys(payload).length > 0 ? : "" } + { Object.keys(payload).length > 0 ? : '' }
); } + render() { const { type, ...payload } = this.props.action; return ( @@ -42,4 +45,4 @@ export default class LogMonitorAction extends React.Component {
); } -} \ No newline at end of file +} diff --git a/src/react/themes/index.js b/src/react/themes/index.js index c8d51ad4..f54bc639 100644 --- a/src/react/themes/index.js +++ b/src/react/themes/index.js @@ -1,2 +1,2 @@ -export { default as ocean } from "./ocean"; -export { default as monokai } from "./monokai"; +export { default as ocean } from './ocean'; +export { default as monokai } from './monokai'; diff --git a/src/react/themes/monokai.js b/src/react/themes/monokai.js index 3350e5a6..654e49df 100644 --- a/src/react/themes/monokai.js +++ b/src/react/themes/monokai.js @@ -1,20 +1,20 @@ export default { - scheme: "Monokai", - author: "Wimer Hazenberg (http://www.monokai.nl)", - base00: "#272822", - base01: "#383830", - base02: "#49483e", - base03: "#75715e", - base04: "#a59f85", - base05: "#f8f8f2", - base06: "#f5f4f1", - base07: "#f9f8f5", - base08: "#f92672", - base09: "#fd971f", - base0A: "#f4bf75", - base0B: "#a6e22e", - base0C: "#a1efe4", - base0D: "#66d9ef", - base0E: "#ae81ff", - base0F: "#cc6633" + scheme: 'Monokai', + author: 'Wimer Hazenberg (http://www.monokai.nl)', + base00: '#272822', + base01: '#383830', + base02: '#49483e', + base03: '#75715e', + base04: '#a59f85', + base05: '#f8f8f2', + base06: '#f5f4f1', + base07: '#f9f8f5', + base08: '#f92672', + base09: '#fd971f', + base0A: '#f4bf75', + base0B: '#a6e22e', + base0C: '#a1efe4', + base0D: '#66d9ef', + base0E: '#ae81ff', + base0F: '#cc6633' }; diff --git a/src/react/themes/ocean.js b/src/react/themes/ocean.js index e67bd93f..67da4c04 100644 --- a/src/react/themes/ocean.js +++ b/src/react/themes/ocean.js @@ -17,4 +17,4 @@ export default { base0D: '#8fa1b3', base0E: '#b48ead', base0F: '#ab7967' -} +};