Add additional messaging for RulesOfHooks lint error (#20692)

callmetwan · web-flow · commit c62986cfd8cb · 2021-02-22T19:17:13.000-05:00
* Add additional messaging for RulesOfHooks lint error

* Fix tests and spacing issue

* Prettify ESLintRulesOfHooks-test
diff --git a/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js b/packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
@@ -915,7 +915,8 @@ function functionError(hook, fn) {
     message:
       `React Hook "${hook}" is called in function "${fn}" that is neither ` +
       'a React function component nor a custom React Hook function.' +
-      ' React component names must start with an uppercase letter.',
+      ' React component names must start with an uppercase letter.' +
+      ' React Hook names must start with the word "use".',
   };
 }
 
diff --git a/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js b/packages/eslint-plugin-react-hooks/src/RulesOfHooks.js
@@ -482,7 +482,8 @@ export default {
                 `function "${context.getSource(codePathFunctionName)}" ` +
                 'that is neither a React function component nor a custom ' +
                 'React Hook function.' +
-                ' React component names must start with an uppercase letter.';
+                ' React component names must start with an uppercase letter.' +
+                ' React Hook names must start with the word "use".';
               context.report({node: hook, message});
             } else if (codePathNode.type === 'Program') {
               // These are dangerous if you have inline requires enabled.
