abortRequest.tsx

import { unAuthed } from '@utils/http';
import axios, { CancelTokenSource } from 'axios'
import { useState } from 'react';


export function AxiosAbortTest(){
  let source: CancelTokenSource | undefined;
  async function requestResource(){
    if (source){
      source.cancel('Operation canceled due to new request.');
    }

    source = axios.CancelToken.source();
    unAuthed('/', {cancelToken:  source.token}).catch(e => {
      console.log(e);      
    })
  }

  return (
    <a href="" onClick={async (e) =>{ 
      e.preventDefault();
      await requestResource() 
    }}>Send Request</a>
  ) 
}