import {connect} from 'react-redux'
import _ from 'lodash/fp'

const DistortButton = (props) => {
  const {dispatch, distorted} = props
  const distort = () => {
    if (distorted) {
      dispatch({type: 'TOGGLE_DISTORT', value: false})
      return
    }
    dispatch({type: 'TOGGLE_DISTORT', value: true})

  }
  return <div className="distortion-button"><button className="button" onClick={distort}>Distort</button></div>
}

export default connect(_.pick(['distorted']))(DistortButton)
