Skip to content

Commit 6a590b6

Browse files
committed
Shouldn't use useId in async Components
1 parent 9916265 commit 6a590b6

File tree

2 files changed

+21
-31
lines changed

2 files changed

+21
-31
lines changed

packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -550,21 +550,6 @@ const tests = {
550550
// TODO: this should error but doesn't.
551551
// errors: [genericError('useState')],
552552
},
553-
{
554-
code: normalizeIndent`
555-
async function Page() {
556-
useId();
557-
React.useId();
558-
}
559-
`,
560-
},
561-
{
562-
code: normalizeIndent`
563-
async function useAsyncHook() {
564-
useId();
565-
}
566-
`,
567-
},
568553
],
569554
invalid: [
570555
{
@@ -1144,6 +1129,26 @@ const tests = {
11441129
`,
11451130
errors: [asyncComponentHookError('useState')],
11461131
},
1132+
{
1133+
code: normalizeIndent`
1134+
async function Page() {
1135+
useId();
1136+
React.useId();
1137+
}
1138+
`,
1139+
errors: [
1140+
asyncComponentHookError('useId'),
1141+
asyncComponentHookError('React.useId'),
1142+
],
1143+
},
1144+
{
1145+
code: normalizeIndent`
1146+
async function useAsyncHook() {
1147+
useId();
1148+
}
1149+
`,
1150+
errors: [asyncComponentHookError('useId')],
1151+
},
11471152
{
11481153
code: normalizeIndent`
11491154
async function notAHook() {

packages/eslint-plugin-react-hooks/src/RulesOfHooks.js

Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -40,21 +40,6 @@ function isHook(node) {
4040
}
4141
}
4242

43-
const serverComponentHooks = new Set(['useId']);
44-
function isServerComponentHook(node) {
45-
if (node.type === 'Identifier') {
46-
return serverComponentHooks.has(node.name);
47-
} else if (
48-
node.type === 'MemberExpression' &&
49-
!node.computed &&
50-
node.property.type === 'Identifier'
51-
) {
52-
return serverComponentHooks.has(node.property.name);
53-
} else {
54-
return false;
55-
}
56-
}
57-
5843
/**
5944
* Checks if the node is a React component name. React component names must
6045
* always start with an uppercase letter.
@@ -519,7 +504,7 @@ export default {
519504
if (isDirectlyInsideComponentOrHook) {
520505
// Report an error if the hook is called inside an async function.
521506
const isAsyncFunction = codePathNode.async;
522-
if (isAsyncFunction && !isServerComponentHook(hook)) {
507+
if (isAsyncFunction) {
523508
context.report({
524509
node: hook,
525510
message:

0 commit comments

Comments
 (0)