[lint] treat React.use() the same as use()

facebook · Nov 30, 2023 · 790aab0 · 790aab0
1 parent b8be034
commit 790aab0
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js b/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
@@ -489,9 +489,12 @@ const tests = {
     },
     {
       code: normalizeIndent`
+        import * as React from 'react';
         function App() {
           if (shouldShowText) {
             const text = use(query);
+            const data = React.use(thing);
+            const data2 = react.use(thing2);
             return <Text text={text} />
           }
           return <Text text={shouldFetchBackupText ? use(backupQuery) : "Nothing to see here"} />

diff --git a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js
@@ -108,7 +108,17 @@ function isUseEffectEventIdentifier(node) {
 }
 
 function isUseIdentifier(node) {
-  return node.type === 'Identifier' && node.name === 'use';
+  switch (node.type) {
+    case 'Identifier':
+      return node.name === 'use';
+    case 'MemberExpression':
+      return (
+        (node.object.name === 'React' || node.object.name === 'react') &&
+        node.property.name === 'use'
+      );
+    default:
+      return false;
+  }
 }
 
 export default {