Test.jsx 1.34 KB
import React from 'react'
import { connect } from 'react-redux'

import Text from '../../components/text/Text'

import { increment, decrement } from '../../action/countersAction'

const App = ({ message, counter, dispatch }) => (
  <div className="container">
    <Text />

    {/* <div className="columns column is-12">
      <h1>Counter : {counter}</h1>
    </div> */}

    <div className="buttons">
      <button
        onClick={() => dispatch(increment(1))}
        className="button is-primary">
        +1
      </button>
      <button onClick={() => dispatch(increment(2))} className="button is-link">
        +2
      </button>
      <button onClick={() => dispatch(increment(3))} className="button is-info">
        +3
      </button>
    </div>

    <div className="buttons">
      <button
        onClick={() => dispatch(decrement(1))}
        className="button is-primary">
        -1
      </button>
      <button onClick={() => dispatch(decrement(2))} className="button is-link">
        -2
      </button>
      <button onClick={() => dispatch(decrement(3))} className="button is-info">
        -3
      </button>
    </div>
  </div>
)

const mapStateToProps = state => ({
  message: 'This is message from mapStateToProps',
  counter: state.countersReducers || 0,
})

const AppWithConnect = connect(mapStateToProps)(App)

export default AppWithConnect