Reputation: 1492
I'm currently working on application that has the following:
My coursesAction file has an action function for fetching a single course from the server and another action function for fetching all courses from the server. Should I use a seperate reducer for handling a list of courses vs a single course since my initialState is an empty array (meant for a list of course objects)? rather than an empty object(meant for a course object)?:
let initialState = [];
export default function courseReducer(state = initialState, action){
switch(action.type){
case types.LOAD_COURSES_SUCCESS:
return action.courses;
default:
return state;
}
}
Or should I instead retrieve all courses from the server and then when navigating to my 'course' page query the course I'm looking for from the store??
Upvotes: 1
Views: 2123
Reputation: 713
Well create two reducers for two different actions is not a bad idea but if you just want to separate it due to initial state datatype problem then you do not need to make it separate. Both can be handled in a single way. Use immutable, which is also a good practice if you are using react + rediux
Import immutable
import {Record} from 'immutable'
Make initial state object as follow
const Initialstate = new Record({
course: {},
courses: []
})
Your reducer be like
export default function courseReducer(state = new Initialstate(), action = {}){
switch(action.type){
case types.LOAD_COURSES_SUCCESS:
return action.courses;
case types.LOAD_COURSE_SUCCESS:
return action.course;
default:
return state;
}
}
Also, you can change state in reducer like below, if require in future.
case types.LOAD_CUSTOM:
return state.set("customPhase", "success")
Upvotes: 4