title: React Redux + redux persist : only part of the data persists
body: <p>it's a react-native app (redux-pattern) using redux-persist, to persist the data for time when user doesn't have internet connection.</p>
  
  <p>Problem is only part of the data is being persisted. See the screenshot bellow. <code>auth</code> is persisted and loaded from <code>AsyncStorage</code> without any problems. but others <code>courses</code> , <code>evaluations</code>, ... are persisted partly.
  for example courses/courses includes the userId of 1, but it's an empty object.</p>
  
  <p><a href="https://i.stack.imgur.com/AaN0i.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AaN0i.png" alt="enter image description here"></a></p>
  
  <p>****UPDATE new screenshot, auto-rehydrate with logs on:
  <a href="https://i.stack.imgur.com/lbC0d.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/lbC0d.png" alt="enter image description here"></a>
  Store.js :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { persistStore, autoRehydrate } from "redux-persist";
  import { applyMiddleware, createStore, compose } from "redux";
  import { AsyncStorage } from "react-native";
  import thunk from "redux-thunk";
  import createLogger from "redux-logger";
  import rootReducer from "./rootReducer";
  
  const logger = createLogger();
  
  const store = createStore(rootReducer, compose(
   applyMiddleware(thunk, logger),
   autoRehydrate()
  ));
  
  persistStore(store, {storage: AsyncStorage});
  
  export default store;</code></pre>
  </div>
  </div>
  </p>
  
  <p>auth.reducer.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import * as types from "./auth.actions";
  export const INITIAL_STATE = {
   token: null,
   users: {}
  };
  
  export default function auth(state = INITIAL_STATE, action) {
   const {users, token} = state;
   switch (action.type) {
    case types.AUTH_LOGIN:
    users[action.payload.userId] = {
     token: action.payload.token,
     ///.... continues
    };
    return Object.assign({}, state, {
     loading: false,
     token: action.payload.token,
     user: action.payload.userId,
     users: users
    });
    case types.AUTH_LOGIN_FAILED:
    return Object.assign({}, state, {
     users,
     token
    });
    case types.AUTH_LOGOUT:
    return Object.assign({}, state, {
     token: "",
     user: "",
     users: {}
    });
    default:
     return state;
   }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>There are few more components, for example see the codes for Courses :</p>
  
  <p>courses.reducer.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import * as types from "./courses.actions";
  
  export const INITIAL_STATE = {
    courses: {}
  };
  
  export default function courses(state = INITIAL_STATE, action){
    const {courses, lectures, schedule, events, discussion} = state;
    switch(action.type){
      case types.GET_COURSES:
      return Object.assign({}, state, {
        courses: action.payload.courses,
        lectures: action.payload.lectures,
        schedule: action.payload.schedule,
        events: action.payload.events,
        discussion: action.payload.discussion
    });
      case types.GET_COURSES_FAILED:
      return state;
      case types.BOOK_COURSE:
      return state;
      case types.UNBOOK_COURSE:
      return state;
      case types.BOOK_COURSE_FAILED:
      return state;
      case types.UNBOOK_COURSE_FAILED:
      return state;
      default:
      return state;
    }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any solutions please?</p>
  
  <p>*** UPDATE (requested by petsome)
  courses.actions.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export const GET_COURSES = 'GET_COURSES';
  export const GET_COURSES_FAILED = 'GET_COURSES_FAILED';
  export const BOOK_COURSE = 'BOOK_COURSE';
  export const UNBOOK_COURSE = 'UNBOOK_COURSE';
  export const BOOK_COURSE_FAILED = 'BOOK_COURSE_FAILED';
  export const UNBOOK_COURSE_FAILED = 'UNBOOK_COURSE_FAILED';
  
  import Functions from '../common/Functions';
  
  export const getCourses = (users) =&gt; {
    return dispatch =&gt; {
      Functions.getCoursesAPI(users)
      .then((data)=&gt;{
        const {courseList, lectureList, schedule, eventList, discussion, coursesArray} = data;
        return dispatch(coursesSuccess(courseList, lectureList, schedule, eventList, discussion, coursesArray));
        //return dispatch(coursesFailed('e'));
      })
      .catch((e)=&gt;{
        return dispatch(coursesFailed(e));
      });
    };
  };
  
  export const bookCourse = (user, courseId, callback) =&gt; {
    return dispatch =&gt; {
      Functions.bookCourse(user, courseId, callback)
      .then((data)=&gt;{
          return dispatch(bookCourseSuccess(data));
      })
      .catch((e)=&gt;{
        return dispatch(bookCourseSuccessFailed(e));
      });
    };
  };
  
  export const unbookCourse = (user, courseId, callback) =&gt; {
    return dispatch =&gt; {
      Functions.unbookCourse(user, courseId, callback)
      .then((data)=&gt;{
          return dispatch(unbookCourseSuccess(data));
      })
      .catch((e)=&gt;{
        return dispatch(unbookCourseSuccessFailed(e));
      });
    };
  };
  
  const coursesSuccess = (courses, lectures, schedule, eventList, discussion, coursesArray) =&gt; {
    return {
      type: GET_COURSES,
      payload: {
        courses: courses,
        lectures: lectures,
        schedule: schedule,
        events: eventList,
        discussion: discussion,
        coursesArray: coursesArray
      }
    }
  };
  
  const coursesFailed = (e) =&gt; {
    return {
      type: GET_COURSES_FAILED,
      payload: {
        error: e
      }
    }
  };
  
  const unbookCourseSuccess = (data) =&gt; {
    return {
      type: UNBOOK_COURSE,
      payload: {
        data: data
      }
    };
  };
  
  const unbookCourseSuccessFailed = (e) =&gt; {
    return {
      type: UNBOOK_COURSE_FAILED,
      payload: {
        error: e
      }
    };
  };
  
  const bookCourseSuccess = (data) =&gt; {
    return {
      type: BOOK_COURSE,
      payload: {
        data: data
      }
    };
  };
  
  const bookCourseSuccessFailed = (e) =&gt; {
    return {
      type: BOOK_COURSE_FAILED,
      payload: {
        error: e
      }
    };
  };</code></pre>
  </div>
  </div>
  </p>