From 2c2d9a1df03f04d7aa7b37ec48d4e1e22b475dd8 Mon Sep 17 00:00:00 2001
From: Jan Kassens <jkassens@fb.com>
Date: Thu, 1 Sep 2022 10:07:31 -0400
Subject: [PATCH] [eslint-plugin-react-hooks] only allow capitalized component
 names (#25162)

- update naming rules to disallow _component
- update eslint-plugin-react-hooks version
---
 ReactVersions.js                                  |  2 +-
 packages/eslint-plugin-react-hooks/CHANGELOG.md   |  6 ++++++
 .../__tests__/ESLintRulesOfHooks-test.js          | 15 +++++++++++++++
 packages/eslint-plugin-react-hooks/package.json   |  2 +-
 .../eslint-plugin-react-hooks/src/RulesOfHooks.js | 11 +++--------
 5 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/ReactVersions.js b/ReactVersions.js
index acb76f56c4826..e8dffe7dee1b1 100644
--- a/ReactVersions.js
+++ b/ReactVersions.js
@@ -25,7 +25,7 @@ const ReactVersion = '18.3.0';
 const nextChannelLabel = 'next';
 
 const stablePackages = {
-  'eslint-plugin-react-hooks': '4.7.0',
+  'eslint-plugin-react-hooks': '5.0.0',
   'jest-react': '0.15.0',
   react: ReactVersion,
   'react-art': ReactVersion,
diff --git a/packages/eslint-plugin-react-hooks/CHANGELOG.md b/packages/eslint-plugin-react-hooks/CHANGELOG.md
index 8a0882d24ec40..589574ede95cb 100644
--- a/packages/eslint-plugin-react-hooks/CHANGELOG.md
+++ b/packages/eslint-plugin-react-hooks/CHANGELOG.md
@@ -1,3 +1,9 @@
+## 5.0.0 (next release)
+
+* **New Violations:** Component names now need to start with an uppercase letter instead of a non-lowercase letter. This means `_Button` or `_component` are no longer valid. ([@kassens](https://github.com/kassens)) in [#25162](https://github.com/facebook/react/pull/25162)
+
+## 4.6.0
+
 ## 4.5.0
 
 * Fix false positive error with large number of branches. ([@scyron6](https://github.com/scyron6) in [#24287](https://github.com/facebook/react/pull/24287))
diff --git a/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js b/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
index 044cc58f40c4c..ee220fa5dba3c 100644
--- a/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
+++ b/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
@@ -641,6 +641,21 @@ const tests = {
         functionError('useHookInsideNormalFunction', 'normalFunctionWithHook'),
       ],
     },
+    {
+      code: `
+        // These are neither functions nor hooks.
+        function _normalFunctionWithHook() {
+          useHookInsideNormalFunction();
+        }
+        function _useNotAHook() {
+          useHookInsideNormalFunction();
+        }
+      `,
+      errors: [
+        functionError('useHookInsideNormalFunction', '_normalFunctionWithHook'),
+        functionError('useHookInsideNormalFunction', '_useNotAHook'),
+      ],
+    },
     {
       code: `
         // Invalid because it's dangerous and might not warn otherwise.
diff --git a/packages/eslint-plugin-react-hooks/package.json b/packages/eslint-plugin-react-hooks/package.json
index 3f14cee365115..683d95dccf050 100644
--- a/packages/eslint-plugin-react-hooks/package.json
+++ b/packages/eslint-plugin-react-hooks/package.json
@@ -1,7 +1,7 @@
 {
   "name": "eslint-plugin-react-hooks",
   "description": "ESLint rules for React Hooks",
-  "version": "4.6.0",
+  "version": "5.0.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/facebook/react.git",
diff --git a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js
index 31d54e813ae65..1957d3ce199af 100644
--- a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js
+++ b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js
@@ -16,7 +16,7 @@
  */
 
 function isHookName(s) {
-  return /^use[A-Z0-9].*$/.test(s);
+  return /^use[A-Z0-9]/.test(s);
 }
 
 /**
@@ -42,16 +42,11 @@ function isHook(node) {
 
 /**
  * Checks if the node is a React component name. React component names must
- * always start with a non-lowercase letter. So `MyComponent` or `_MyComponent`
- * are valid component names for instance.
+ * always start with an uppercase letter.
  */
 
 function isComponentName(node) {
-  if (node.type === 'Identifier') {
-    return !/^[a-z]/.test(node.name);
-  } else {
-    return false;
-  }
+  return node.type === 'Identifier' && /^[A-Z]/.test(node.name);
 }
 
 function isReactFunction(node, functionName) {