diff --git a/src/containers/home/index.js b/src/containers/home/index.js index 3a83e42e..5036f64d 100644 --- a/src/containers/home/index.js +++ b/src/containers/home/index.js @@ -1,29 +1,43 @@ -import React from 'react' -import { push } from 'connected-react-router' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' import { + decrement, + decrementAsync, increment, incrementAsync, - decrement, - decrementAsync } from '../../modules/counter' -const Home = props => ( +import React from 'react' +import { bindActionCreators } from 'redux' +import { connect } from 'react-redux' +import { push } from 'connected-react-router' + +const Home = (props) => (

Home

Count: {props.count}

+ {(props.isIncrementing || props.isDecrementing) &&
Loading ....
}

- - +

- - +

@@ -39,22 +53,19 @@ const Home = props => ( const mapStateToProps = ({ counter }) => ({ count: counter.count, isIncrementing: counter.isIncrementing, - isDecrementing: counter.isDecrementing + isDecrementing: counter.isDecrementing, }) -const mapDispatchToProps = dispatch => +const mapDispatchToProps = (dispatch) => bindActionCreators( { increment, incrementAsync, decrement, decrementAsync, - changePage: () => push('/about-us') + changePage: () => push('/about-us'), }, dispatch ) -export default connect( - mapStateToProps, - mapDispatchToProps -)(Home) +export default connect(mapStateToProps, mapDispatchToProps)(Home) diff --git a/src/modules/counter.js b/src/modules/counter.js index d2d14a46..7d53dfab 100644 --- a/src/modules/counter.js +++ b/src/modules/counter.js @@ -6,7 +6,7 @@ export const DECREMENT = 'counter/DECREMENT' const initialState = { count: 0, isIncrementing: false, - isDecrementing: false + isDecrementing: false, } export default (state = initialState, action) => { @@ -14,27 +14,27 @@ export default (state = initialState, action) => { case INCREMENT_REQUESTED: return { ...state, - isIncrementing: true + isIncrementing: true, } case INCREMENT: return { ...state, count: state.count + 1, - isIncrementing: !state.isIncrementing + isIncrementing: !state.isIncrementing, } case DECREMENT_REQUESTED: return { ...state, - isDecrementing: true + isDecrementing: true, } case DECREMENT: return { ...state, count: state.count - 1, - isDecrementing: !state.isDecrementing + isDecrementing: !state.isDecrementing, } default: @@ -43,52 +43,52 @@ export default (state = initialState, action) => { } export const increment = () => { - return dispatch => { + return (dispatch) => { dispatch({ - type: INCREMENT_REQUESTED + type: INCREMENT_REQUESTED, }) dispatch({ - type: INCREMENT + type: INCREMENT, }) } } export const incrementAsync = () => { - return dispatch => { + return (dispatch) => { dispatch({ - type: INCREMENT_REQUESTED + type: INCREMENT_REQUESTED, }) return setTimeout(() => { dispatch({ - type: INCREMENT + type: INCREMENT, }) }, 3000) } } export const decrement = () => { - return dispatch => { + return (dispatch) => { dispatch({ - type: DECREMENT_REQUESTED + type: DECREMENT_REQUESTED, }) dispatch({ - type: DECREMENT + type: DECREMENT, }) } } export const decrementAsync = () => { - return dispatch => { + return (dispatch) => { dispatch({ - type: DECREMENT_REQUESTED + type: DECREMENT_REQUESTED, }) return setTimeout(() => { dispatch({ - type: DECREMENT + type: DECREMENT, }) }, 3000) }