title: react redux-thunk wraps state inside another state
body: <p>Im new to react, now Im creating a simple app using redux and redux-thunk which calls an API asynchronously. Here is my game <strong>gameAction:</strong></p>
  <pre><code>export const fetchGamesStartAsync = () =&gt; {
  return dispatch =&gt; {
      dispatch(fetchGamesStart());
      axiosGenCfg.post('/game/get',{
          &quot;page&quot; : 1,
          &quot;size&quot; : 10
      })
          .then(({ res }) =&gt; {
              dispatch(fetchGamesSuccess(res));
          })
          .catch(err =&gt; {
              dispatch(fetchGamesFailure(err.message));
          });
  }
  };
  
  
  const fetchGamesStart = () =&gt; ({
      type: gameActionTypes.FETCH_GAMES_START,
  });
  
  const fetchGamesFailure = () =&gt; ({
      type: gameActionTypes.FETCH_GAMES_FAILURE,
  });
  
  const fetchGamesSuccess = (games) =&gt; ({
      type: gameActionTypes.FETCH_GAMES_SUCCESS,
      payload:{
          ...games
      }
  });
  </code></pre>
  <p>and this is my <strong>gameReducer:</strong></p>
  <pre><code>const INITIAL_STATE= {
      gamesList : null,
      isFetching: false,
      errorMessage : undefined
  };
  
  const gameReducer = (state = INITIAL_STATE, action) =&gt; {
      switch (action.type) {
          case gameActionTypes.FETCH_GAMES_START:
              return{
                  ...state,
                  isFetching: true
              };
          case gameActionTypes.FETCH_GAMES_SUCCESS:
              return{
                  ...state,
                  isFetching: false,
                  gamesList: action.payload
              };
          case gameActionTypes.FETCH_GAMES_FAILURE:
              return{
                  ...state,
                  isFetching: false,
                  errorMessage: action.payload
              };
          default:
              return {
                  state
              };
      }
  };
  </code></pre>
  <p>and in <strong>rootReducer</strong></p>
  <pre><code>export default combineReducers({
      admin : adminReducer,
      game: gameReducer,
  
  })
  </code></pre>
  <p>I also added redux-logger to check state and this is what i get in <strong>console</strong>
  <a href="https://i.stack.imgur.com/VsjIY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VsjIY.png" alt="enter image description here" /></a></p>
  <p>So why there are 2 levels of state in my game object? and also the same with admin object. before i add redux-thunk to project, I didn't have this problem.  before adding redux-thunk <code>currentAdmin</code> was direct child of  <code>admin</code>. But now there is a state object between.</p>