Can't perform state update on an unmounted component

[mfasanya]

I am in a situation where I have a getCurrentUser query which is called from a few different protected routes. Based on this I will then redirect the user if they don't have the relevant permissions

const { data, loading } = useGetCurrentUserQuery()

  const user = data?.getCurrentUser

  return (
    <Route
      {...rest}
      render={(props) =>
        loading ? (
          <LoadingScreen />
        ) : user && !user.signupComplete ? (
          <Redirect to="/complete_signup" />
        ) : user?.signupComplete ? (
          children
        ) : (
          <Redirect to="/login" />
        )
      }
    />
  )

This is all great. However, I also need to call getCurrentUser from other components within the children. If for some reason the currentUser object is updated and this protected route redirects you the browser throws a warning:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

I assume this is because the currentUser changes propagate through the app and apollo doesn't know it have unmounted.

"@apollo/client": "3.0.0-rc.6", "@apollo/link-error": "^2.0.0-beta.3",