Cancelling a task causes cancelling of every forked task?

Hi, I’m still new to redux-saga and have the following problem:

I have a simple list of items in my UI (the “bookmarks” in the code below). When I delete one of them, I want to show an “undo” button and then wait 5 seconds for the the user’s action. If the user clicks on the undo button, the we dispatch the types.CANCEL_DELETE_BOOKMARK action, otherwise, the saga calls the API.

The issue I seem to have is that if I dispatch multiple types.DELETE_BOOKMARK in a quick succession, then a subsequent dispatching of types.CANCEL_DELETE_BOOKMARK cancels every performDelete, not just the one in the forked task.

function* performDelete(id) {
  try {
    yield call(delay, 5000);
    yield call(api.deleteBookmark, id);

    yield put({type: types.DELETE_BOOKMARK_SUCCESS, id});
  } catch(error) {
    yield put({type: types.DELETE_BOOKMARK_ERROR, error});
  }
}


function* deleteBookmark(act) {
  const { id } = act;
  yield put({type: types.REMOVE_BOOKMARK_FROM_UI, id});
  yield put({type: types.SHOW_UNDO, id});

  const { response, cancelDeleting } = yield race({
    delete: call(performDelete, id),
    cancelDeleting: take([types.CANCEL_DELETE_BOOKMARK, types.DELETE_BOOKMARK_ERROR])
  });

  if (cancelDeleting) {
    yield put({type: types.READD_BOOKMARK_TO_UI, id});
  }
  yield put({type: types.HIDE_UNDO, id});
}


export default function* rootSaga() {
  yield* takeEvery(types.DELETE_BOOKMARK, deleteBookmark)
}

I have also tried to fork and cancel the performDelete task, without the use of race, but that results in the same behavior.

[jrvidal]

You’re right the DELETE_BOOKMARK_ERROR action is not the issue. I noticed it first for that action for some reason, but the case is the same for CANCEL_DELETE_BOOKMARK.

What you probably need is something like:

const { response, cancelDeleting } = yield race({
  delete: call(performDelete, id),
  cancelDeleting: take(action => (
    (action.type === types.DELETE_BOOKMARK_ERROR || action.type === types.CANCEL_DELETE_BOOKMARK) &&
    action.id === id
  ))
});

Otherwise CANCEL_DELETE_BOOKMARK affects all your races. There is nothing in your take referring to the particular bookmark you are dealing with.

[michalczaplinski]

That makes sense! Thanks a lot! I somehow had a completely wrong mental model and just assumed that each task only listens on actions that affect it. Only my 2nd day using the library, though 😃 Perhaps this could be made more clear in the docs.