Axios AbortController not working for me in reactjs

I tried loading a page and immediately returns to the previous page. I expect it to abort but the api calls still pull through and fetch data successfully when I checked the network tab. Here is my code:

      useEffect(() => {
      const controller = new AbortController();
      
      const getPost = async () => {
       try{
          setIsLoading(true)
        const response = await axios.get(`${BASE_URL}/posts/${path}`, {signal: 
        controller.signal})
       
        setUsername(response.data.username)
        
        setIsLoading(false)
        
       }catch(err){
     
            if(err.response.data == 'ERR_ABORTED 400'){
                return console.log('request canceled')
            }
          setIsLoading(false)
        if(err.response.data === 'no post found'){
            return setgeneralFetchError(true)
        }
        
       }
       
        return ()=>{
    controller.abort()
  }
   };

   
  getPost()
   
 
}, [path]);

It is my first time of trying to do this. probably I am not doing it properly.