prevstate and nextstate are the same in redux

Question

I tried to create todo list app with react and redux but when I use "CheckTodoItem" action and log with logger, my prevstate and nextstate are same.

TodoList Action :

const AddTodoItem = ( todo ) =>{
    return{
        type: "ADD_TODO_ITEM",
        payload: todo
    }
}

const CheckTodoItem = ( todo ) =>{
    return{ 
        type: "CHECK_TODO_ITEM",
        payload: todo 
    }
}

const DeleteTodoItem = ( todo ) =>{
    return{ 
        type: "DELETE_TODO_ITEM",
        payload: todo 
    }
}

export { AddTodoItem, CheckTodoItem, DeleteTodoItem }

TodoLIst Reducer:

const initialState = {
    todoList: [
        { todo: "workout" , isCheck: false},
        { todo: "home work" , isCheck: false},
        { todo: "pay bils" , isCheck: false},
        { todo: "visit ali" , isCheck: false},
        { todo: "Buying household items" , isCheck: false},
    ],
}

const todoListReducer = ( state = initialState , action ) => {
    switch ( action.type ) {
        case "ADD_TODO_ITEM":
            const Todo = {
                todo: action.payload,
                isCheck: false,
            };
            state.todoList.push( Todo );
            return{
                ...state
            }

        case "DELETE_TODO_ITEM":
            const newTodoList = state.todoList.filter( item => item.todo !== action.payload)
            return {
                ...state,
                todoList: newTodoList,
            }

        case "CHECK_TODO_ITEM":
            const objIndex = state.todoList.findIndex(( obj => obj.todo === action.payload ));
            state.todoList[objIndex].isCheck = true
            return{
                ...state,
            }

        default : 
            return state
    }
}

export default todoListReducer

logger : enter image description here

I've tried everything I can but I don't know why it's not working properly

Answer 1

I edit your reducer function with map :

case "CHECK_TODO_ITEM":
    const todoList = state.todoList.map((todoItem)=>{
        if(todoItem.todo===action.payload){
            return {
                ...todoItem,
                isCheck:true,
            }else{
                return todoItem
            }
        }
    });

    return{
        ...state,
        todoList
    }