dubdiff/src/components/Main.js
2016-11-28 12:47:47 -05:00

55 lines
1.5 KiB
JavaScript

import React from 'react'
import {connect} from 'react-redux'
import * as Actions from '../actions'
import * as Selectors from '../selectors'
import Header from './Header'
import MainControls from './MainControls'
const mapStateToProps = (state) => ({
input: state.input,
safeInput: Selectors.safeInput(state),
})
const mapDispatchToProps = dispatch => ({
onChangeOriginal: (text) => dispatch(Actions.updateOriginalInput(text)),
onChangeFinal: (text) => dispatch(Actions.updateFinalInput(text)),
})
class Main extends React.Component {
constructor() {
super()
}
render () {
return (
<div>
<Header/>
<div className="container">
<form className="row">
<div className="col-md-2 col-sm-12">
<MainControls/>
</div>
<div className="col-lg-5 col-sm-12 form-group">
<label htmlFor="docA">Original</label>
<textarea id="docA" value={this.props.input.original} onChange={event => this.props.onChangeOriginal(event.target.value)} className="form-control"></textarea>
</div>
<div className="col-lg-5 col-sm-12 form-group">
<label htmlFor="docB">Final</label>
<textarea id="docB" value={this.props.input.final} onChange={event => this.props.onChangeFinal(event.target.value)} className="form-control"></textarea>
</div>
</form>
</div>
</div>
)
}
}
export default connect(mapStateToProps, mapDispatchToProps)(Main)