Perhaps full reducer/actions are overkill for 90% of our component state needs?

1. component.js

export function Component({state, increment}) {
  return (
    <div>
      {state.count} hits!
      <button onClick={increment}>Hit me!</button>
    </div>
  );
}

2. reducer.js

const A_INCREMENT = 'A_INCREMENT';

function reducer(state, action) {
  switch(action.type) {
    case A_INCREMENT:
        return {...state, count: state.count + 1};
    default:
      return state;
  }
}

@withReducer('state', 'dispatch', reducer, {count: 0})
@mapProps(props => ({
  increment: () => props.dispatch({type: A_INCREMENT}),
  ...props
}))
Component

3. withProxiedState.js

const increment = state => ({...state, count: state.count + 1});

@withProxiedState('state', {count: 0}, {increment})
Component

(Ignore terrible name withProxiedState)