title: Proper way to delete particular property from main state of Redux which uses combineReducers - React Redux
body: <p>I have an app where I want to implement authorization (registration, login, logout). I must use redux for that.
  So far registration and login is working great, but I'm getting problems when I should delete data of the logged user when the user clicks the logout button.</p>
  <p>I tried to put the login and logout cases in the same reducer, but when a user was logged I can't get access to the user's data, and instead of just take the old users data object and return the empty one it just adds an empty object to the user's data.</p>
  <p><strong>My redux state before login:</strong></p>
  <p><a href="https://i.stack.imgur.com/hJw81.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hJw81.png" alt="enter image description here" /></a></p>
  <p><strong>My redux state after login:</strong></p>
  <p><a href="https://i.stack.imgur.com/M7HlO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/M7HlO.png" alt="enter image description here" /></a></p>
  <p><strong>My redux state after logout</strong></p>
  <p><a href="https://i.stack.imgur.com/0KKKU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0KKKU.png" alt="enter image description here" /></a></p>
  <p><strong>Here is my actions for login and logout:</strong></p>
  <pre><code>export function userLoginSuccess(user) {
      return {
          type: 'USER_LOGIN_SUCCESS',
          user
      }
  }
  
  export function userLogout() {
      return {
          type: 'USER_LOGOUT'
      }
  }
  </code></pre>
  <p><strong>Here is the reducer:</strong></p>
  <pre><code>export function userLogin(state = {}, action) {
      switch (action.type) {
          case 'USER_LOGIN_SUCCESS':
              localStorage.setItem('userToken', action.user.token);
              return action.user;
          case 'USER_LOGOUT':
              localStorage.removeItem('userToken');
              return {
                  ...state,
                  userLogin: {}
              }
          default:
              return state;
      }
  }
  </code></pre>
  <p><strong>Here is the store initialization with <code>combineReducers</code>:</strong></p>
  <pre><code>import { userLogin, companies, dataHaveError, dataIsLoading } from './redux/reducers';
  
  const rootReducer = combineReducers({
    companies,
    userLogin,
    dataHaveError,
    dataIsLoading
  })
  
  const enhancer = applyMiddleware(thunk);
  
  const store = createStore(rootReducer, {}, composeWithDevTools(enhancer));
  </code></pre>
  <p>I was trying to find a solution, but all that I find was without <code>combineReducers</code> and they were using initialState for solving this kind of problems, but in this case, how I understood, <code>combineReducers</code> is creating a state property for each reducer so I don't know how to handle this particular problem.</p>