Bug: eslint-plugin-react-hooks disallows the use of useId in async component even though it works

[axeleroy]

In #27045 the eslint-plugin-react-hooks has been modified to disallow the use of any hooks in async components, justified by this sentence:

Hooks cannot be called in async functions, on either the client or the server.

However, some hooks can be called in async components, namely useId. Or at least the documentation does not mention it[^1].

[^1]: The documentation for React 19 does not mention it as well.

React version: 18.3.1 eslint-plugin-react-hooks: 5.0.0

Steps To Reproduce

1. Create an async component that uses useId

   export default async function Component() {
   const id = useId();
   return null;
   }

2. ESLint will throw the following error:

   Error: React Hook "useId" cannot be called in an async function.  react-hooks/rules-of-hooks

The current behavior

ESLint throws an error when an async component uses useId.

The expected behavior

No ESLint error.

[eps1lon]

Had some further discussions internally.

Or at least the documentation does not mention it1.

No Hook can be called in async Components. You can call it in a sync Component that is used in the Server environment i.e. useId can be used in shared Components.

[axeleroy]

I don't understand the logic for preventing any hooks that can run in a Server Component to be called in async components, especially for a hook as benign as useId :thinking:

An explanation would be welcome, I might have missed something here.