client.unsubscribe() not working in useEffect cleanup

I am using useEffect to get a new refresh token and access token when any component is mounted, in App.js, but on each unmount I get the useEffect error “clean async tasks and subscriptions in your useEffect cleanup function” , so I have added this return ()=>client.unsubscribe(), which does not solve the problem and throws an error. How can I solve this ? Thank you !

The useEffect in question:

 let unMounted=useRef(false)

    React.useEffect(() => {

        //We refresh the access token every time the page is changed
        fetch('http://localhost:8000/refresh_token', {
            method: 'POST',
            credentials: 'include',
        }).then(async x => {
            const { accessToken } = await x.json()

            setAccessToken(accessToken)
            setLoading(false)

            
        })

        return ()=>{
            unMounted.current=true
            client.unsubscribe()
        }
    }, [])

[dylanwulf]

@vpaul18 I think your problem is actually that you’re trying to set state after the component is unmounted. Maybe try something like this?

 let unMounted=useRef(false)

    React.useEffect(() => {

        //We refresh the access token every time the page is changed
        fetch('http://localhost:8000/refresh_token', {
            method: 'POST',
            credentials: 'include',
        }).then(async x => {
            const { accessToken } = await x.json()

+          if (!unMounted.current) {
                setAccessToken(accessToken)
                setLoading(false)
+          }

            
        })

        return ()=>{
            unMounted.current=true
            client.unsubscribe()
        }
    }, [])

[brainkim]

Thanks @dylanwulf!