How i can stop polling function for that particular API that runs background job

I have used This common polling function for running background jobs.


export const poll = ({
  fn = () => {},
  validate = (result) => !!result,
  interval = 1000,
  maxAttempts = 15,
}) => {
  let attempts = 1;
  // eslint-disable-next-line consistent-return
  const executePoll = async (resolve, reject) => {
    try {
      const result = await fn();
      attempts += 1;

      if (validate(result)) {
        return resolve(result);
      } else if (maxAttempts && attempts > maxAttempts) { // eslint-disable-line no-else-return
        return reject(new Error('Exceeded max attempts'));
      } else {
        setTimeout(executePoll, interval, resolve, reject);
      }
    } catch (error) {
      setTimeout(executePoll, interval, resolve, reject);
    }
  };

  return new Promise(executePoll);
};

I have called this fun on click of button for running polling

poll({
          fn: () =>  some API call ex. api.get(url),
          validate: (res) => !res?.data?.lesson_id,
          interval: 5000,
          maxAttempts: 30,
        })

The issue is that after running the above fun in UI I am showing a delete icon on clicking that delete icon I am removing the element for which the above background job is running.

So I want to stop the above polling function after successful deletion.

Note: I have the delete function on that same page so I have control over delete when it is successful.

Any suggestion on what can I change in my common polling function? Thanks.