How to useDispatch async multiple times?

Question

I am using useDispatch two times to change my todos and then change my login status. Both work seperately but when put after each other the second dispatch overwrites my list of todos to an empty object []. How would I make this work?

Axios Post

axios
      .post("http://localhost:3333/user/login", newUser)
      .then((response) => {
        //do stuff
        dispatch(changeTodos(stuff));
        dispatch(login());
      });

Actions

export const login = (data) => {
  return {
    type: "LOGIN",
    data: data,
  };
};

export const changeTodos = (data) => {
  return {
    type: "CHANGETODOS",
    data: data,
  };
};

Reducer

const loggedReducer = (state = false, action) => {
  switch (action.type) {
    case "LOGIN":
      return true;

    case "LOGOUT":
      return false;

    default:
      return false;
  }
};

export default loggedReducer;

const todosReducer = (state = [], action) => {
  switch (action.type) {
    case "CHANGETODOS":
      return action.data;

    default:
      return [];
  }
};

export default todosReducer;

Answer 1

For your default you need to return state otherwise it's gonna hit the default when it doesn't match the action type. For example, LOGIN is will make your TodosReducer return [] which is why it's being cleared out.

    default:
      return state;