Arquitetura baseada em modulos React Redux

actionsLogin.js

import * as constantsLogin from "../constants/constantsLogin"

export const login({email, passaword}) {
  return {
    type: constantsLogin.LOGIN,
    payload: true
  }
}

export const logout() {
  return {
    type: constantsLogin.LOGOUT,
    payload: false
  }
}

app.jsx

import React from 'react';
import { connect } from 'react-redux';
import { Switch, Route, HashRouter } from 'react-router-dom';

import Home from './modules/home/components';
import Login from './modules/login/components';

const App = props =>
    <HashRouter>
      <Switch>
        <Route exact path="/" component={props.logged ? Home : Login} />
      </Switch>
    </HashRouter>
  ));

const mapStateToProps = ({reducerLogin) => ({ logged: reducerLogin.logged });

export default connect(mapStateToProps)(App);

constantsLogin.js

export const LOGIN = "LOGIN"
export const LOGOUT = "LOGOUT"

HomeController.jsx

import React, {Component} from "react"
import * as actionsLogin from "../../login/actions/actionsLogin"
import HomeControllerView from "./HomeControllerView"

class HomeController extends Component {
  constructor() {
    super()
    this.state = {}
  }
  
  render() {
    return <HomeControllerView {...this.props} />
  }
}

export default connect(({reducerLogin}) => {...reducerLogin}, {...actionsLogin})(LoginController)

HomeControllerView.jsx

import React from "react"

const HomeControllerView = (props) => {
  const {logout} = props;
  return (
    <div>
      <div>
        <button onClick={logout} >
          Sair
        </button>
       </div>
       <p>Bem vindo</p>
    </div>
  )
}

export default HomeControllerView

index.js

import view from "./user/LoginControllerView"
import login from "./user/LoginController"

const LoginController = login
export default LoginController
export const LoginControllerView = view

index.jsx

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import App from './App';
import store from './store';

ReactDOM.render(
  <Provider store={store}>
     <App />
  </Provider>,
  document.getElementById('root'),
);

indexHome.js

import view from "./user/HomeControllerView"
import login from "./user/HomeController"

const HomeController = login
export default HomeController
export const HomeControllerView = view

LoginController.jsx

import React, {Component} from "react"
import * as actionsLogin from "../actions/actionsLogin"
import LoginControllerView from "./LoginControllerView"

class LoginController extends Component {
  constructor() {
    super()
    this.state = {}
  }
  
  onChange = evt => {
    this.setState({[evt.target.name]: evt.target.value})
  }
  
  render() {
    return <LoginControllerView {...this.props} {...this.state} onChange={this.onChange} />
  }
}

export default connect(({reducerLogin}) => {...reducerLogin}, {...actionsLogin})(LoginController)

LoginControllerView.jsx

import React from "react"

const LoginControllerView = (props) => {
  const {email, password, onChange} = props;
  return (
    <div>
      <div>
        <label>Email</label>
        <input type="email" name="email" placeholder="Digite seu email" onChange={onChange} value={email} />
      </div>
      <div>
        <label>Senha</label>
        <input type="password" name="paswword" placeholder="********" onChange={onChange} value={password} />
      </div>
    </div>
  )
}

export default LoginControllerView

reducerLogin.js

import * as constantsLogin from "../constants/constantsLogin"

const reducerLogin = (state={logged:false}, action) => {
  switch(action.type) {
    case constantsLogin.LOGIN:
      return {...state, logged: action.payload}
    case constantsLogin.LOGOUT:
      return {...state, logged: action.payload}
     default
      return state
  }
}

export default reducerLogin

store.js

import { applyMiddleware, createStore, combineReducers } from 'redux';
import thunk from 'redux-thunk';
import reducerLogin from '../modules/login/reducer';
import reducerHome from '../modules/home/reducer';

const rootReducer = combineReducers({
  reducerLogin,
  reducerHome
});

const store = createStore(
  rootReducer,
  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
  applyMiddleware(thunk),
);

export default store;