Как правильно совместить debounce и cancel token?

Question

[lexstile]

Есть вариант с cancel token, который работает:

useEffect(() => {
    const asyncEnrollment = async () => {
      const data = { userId, filter };
      setLoading(true);
      await initialEnrollment(dispatch, data);
      setLoading(false);
    };

    asyncEnrollment();
  }, [dispatch, userId, filter]);

Есть вариант с debounce, который тоже работает, но не работает cancel token:

const loadEnrollment = useRef(
  debounce(async (data) => {
    setLoading(true);
    await initialEnrollment(dispatch, data);
    setLoading(false);
  }, 4000)
);

useEffect(() => {
  const data = { userId, filter };
  loadEnrollment.current(data);
}, [userId, filter]);

По отдельности работают, вместе - нет.
Как их совместить?