I have a simple todo app in which i add my "todos" and if they are done i just simply click done. Although after clicking the state is updated and the payload is being printed to the console with proper actions "TODO_DONE", done field still remains false. my case for "TODO_DONE" in Reducer:

 case "TODO_DONE":
      return state.map((todo) => {
        if (todo.id === action.payload) {
          return {
            ...todo,
            done: true,
          };
        }
        return todo;
      });

i use it here:

<button onClick={() => doneTodo(todo)}>Done</button>

in the TodoList component:

import { deleteTodoAction, doneTodo } from "../actions/TodoActions";

import { connect } from "react-redux";
const TodoList = ({ todoss, deleteTodoAction, doneTodo }, props) => {
  return (
    <div>
      <h3>Director list</h3>
      {todoss.map((todo) => {
        return (
          <div>
            <div> {todo.name} </div>
            <button onClick={() => deleteTodoAction(todo)}>Usuń</button>
            <button onClick={() => doneTodo(todo)}>Done</button>
          </div>
        );
      })}
    </div>
  );
};

const mapStateToProps = (state) => {
  return {
    todoss: state.todoss,
  };
};

const mapDispatchToProps = {
  deleteTodoAction,
  doneTodo,
};

export default connect(mapStateToProps, mapDispatchToProps)(TodoList);

Ofc, the "done" value is my initial value inside TodoForm with Formik:

<Formik
        initialValues={{
          id: uuidv4(),
          name: "",
          date: "",
          done: false,
        }}
        onSubmit={(values) => handleSubmit(values)}
        enableReinitialize={true}
      >

Anyone knows why this doest not work?