cancelling by id

[zdila]

Our usecase is that we add toasts with payload { "type": "TOASTS_ADD", "payload" { "id": <toast_unique_id>, "timeout": <optional_timeout>, "message": <message> } } and remove them with payload { "type": "TOASTS_REMOVE", "payload": <toast_unique_id>}. Removal is done manually or on timeout.

If it is done manually then we would like to cancel logic (waiting on toast timeout) by <toast_unique_id>. From API it seems that only type can be used for cancellation, without any payload support.

Therefore we've created "workaround":

const clearTimeoutMap = new Map();

const logic1 = createLogic({
  type: 'TOASTS_ADD',
  process({ action: { payload: { timeout, id } } }, dispatch, done) {
    if (typeof timeout === 'number') {
      const to = setTimeout(() => {
        clearTimeoutMap.delete(id);
        dispatch(toastsRemove(id));
        done();
      }, timeout);

      clearTimeoutMap.set(id, () => {
        clearTimeoutMap.delete(id);
        clearTimeout(to);
        done();
      });
    } else {
      done();
    }
  },
});

const logic2 = createLogic({
  type: 'TOASTS_REMOVE',
  process({ action: { payload: id } }) {
    const ct = clearTimeoutMap.get(id);
    if (ct) {
      ct();
    }
  },
});

Is this approach OK?

[zdila]

Just in case, here is the full implementation with additional features:

• logic: https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/logic/toastsLogic.js
• reducer: https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/reducers/toastsReducer.js
• actions: https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/actions/toastsActions.js
• components: https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/components/Toasts.js and https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/components/Toast.js

And one of the usages: https://github.com/FreemapSlovakia/freemap-v3-react/blob/master/src/components/DistanceMeasurementResult.js#L153

[jeffbski]

Thanks @zdila I had the basics started in my notification example, but you have taken it much further. Thanks for sharing.