Added clear message for functional component starting with lowercase (#18881)

Author: roheat

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

@@ -916,7 +916,8 @@ function functionError(hook, fn) {
   return {
     message:
       `React Hook "${hook}" is called in function "${fn}" that is neither ` +
-      'a React function component nor a custom React Hook function.',
+      'a React function component nor a custom React Hook function.' +
+      ' React component names must start with an uppercase letter.',
   };
 }
 

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

@@ -481,7 +481,8 @@ export default {
                 `React Hook "${context.getSource(hook)}" is called in ` +
                 `function "${context.getSource(codePathFunctionName)}" ` +
                 'that is neither a React function component nor a custom ' +
-                'React Hook function.';
+                'React Hook function.' +
+                ' React component names must start with an uppercase letter.';
               context.report({node: hook, message});
             } else if (codePathNode.type === 'Program') {
               // These are dangerous if you have inline requires enabled.