Hint which messages are compared in diff

This commit is contained in:
Thomas Nordquist
2019-03-04 18:23:53 +01:00
parent d1fb0026b6
commit f8a2af8554
4 changed files with 11 additions and 6 deletions

View File

@@ -1,5 +1,4 @@
import * as React from 'react' import * as React from 'react'
import CodeDiff from './components/CodeDiff'
import ConnectionSetup from './components/ConnectionSetup/ConnectionSetup' import ConnectionSetup from './components/ConnectionSetup/ConnectionSetup'
import CssBaseline from '@material-ui/core/CssBaseline' import CssBaseline from '@material-ui/core/CssBaseline'
import ErrorBoundary from './ErrorBoundary' import ErrorBoundary from './ErrorBoundary'

View File

@@ -1,13 +1,14 @@
import * as diff from 'diff' import * as diff from 'diff'
import * as Prism from 'prismjs' import * as Prism from 'prismjs'
import * as React from 'react' import * as React from 'react'
import { Badge, Theme, withStyles } from '@material-ui/core' import { Theme, withStyles } from '@material-ui/core'
import 'prismjs/components/prism-json' import 'prismjs/components/prism-json'
import 'prismjs/themes/prism-tomorrow.css' import 'prismjs/themes/prism-tomorrow.css'
interface Props { interface Props {
previous: string previous: string
current: string current: string
nameOfCompareMessage: string
language?: 'json' language?: 'json'
classes: any classes: any
} }
@@ -60,10 +61,14 @@ class CodeDiff extends React.Component<Props, {}> {
} }
return ( return (
<span style={{ display: 'block', textAlign: 'right' }}> <span style={{ display: 'block', marginBottom: '8px', float: 'right' }}>
Diff: <span className={this.props.classes.additions}>+ {additions} line{additions === 1 ? '' : 's'}</span> <span>
Comparing with <b>{this.props.nameOfCompareMessage}</b> message:&nbsp;
<span className={this.props.classes.additions}>+ {additions} line{additions === 1 ? '' : 's'}</span>
, <span className={this.props.classes.deletions}>- {deletions} line{deletions === 1 ? '' : 's'}</span> , <span className={this.props.classes.deletions}>- {deletions} line{deletions === 1 ? '' : 's'}</span>
</span> </span>
</span>
) )
} }

View File

@@ -70,6 +70,7 @@ class ValueRenderer extends React.Component<Props, State> {
previous={previous} previous={previous}
current={current} current={current}
language={language} language={language}
nameOfCompareMessage={this.props.compareWith ? 'selected' : 'previous'}
/> />
) )
} }

View File

@@ -1,6 +1,6 @@
{ {
"name": "MQTT-Explorer", "name": "MQTT-Explorer",
"version": "0.2.0", "version": "0.2.1-alpha4",
"description": "Explore your message queues", "description": "Explore your message queues",
"main": "dist/src/electron.js", "main": "dist/src/electron.js",
"scripts": { "scripts": {