[eslint-plugin-react-hooks] only allow capitalized component names (#25162)
- update naming rules to disallow _component - update eslint-plugin-react-hooks version
This commit is contained in:
parent
36c908a6c8
commit
2c2d9a1df0
|
@ -25,7 +25,7 @@ const ReactVersion = '18.3.0';
|
||||||
const nextChannelLabel = 'next';
|
const nextChannelLabel = 'next';
|
||||||
|
|
||||||
const stablePackages = {
|
const stablePackages = {
|
||||||
'eslint-plugin-react-hooks': '4.7.0',
|
'eslint-plugin-react-hooks': '5.0.0',
|
||||||
'jest-react': '0.15.0',
|
'jest-react': '0.15.0',
|
||||||
react: ReactVersion,
|
react: ReactVersion,
|
||||||
'react-art': ReactVersion,
|
'react-art': ReactVersion,
|
||||||
|
|
|
@ -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
|
## 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))
|
* Fix false positive error with large number of branches. ([@scyron6](https://github.com/scyron6) in [#24287](https://github.com/facebook/react/pull/24287))
|
||||||
|
|
|
@ -641,6 +641,21 @@ const tests = {
|
||||||
functionError('useHookInsideNormalFunction', 'normalFunctionWithHook'),
|
functionError('useHookInsideNormalFunction', 'normalFunctionWithHook'),
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
code: `
|
||||||
|
// These are neither functions nor hooks.
|
||||||
|
function _normalFunctionWithHook() {
|
||||||
|
useHookInsideNormalFunction();
|
||||||
|
}
|
||||||
|
function _useNotAHook() {
|
||||||
|
useHookInsideNormalFunction();
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
errors: [
|
||||||
|
functionError('useHookInsideNormalFunction', '_normalFunctionWithHook'),
|
||||||
|
functionError('useHookInsideNormalFunction', '_useNotAHook'),
|
||||||
|
],
|
||||||
|
},
|
||||||
{
|
{
|
||||||
code: `
|
code: `
|
||||||
// Invalid because it's dangerous and might not warn otherwise.
|
// Invalid because it's dangerous and might not warn otherwise.
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"name": "eslint-plugin-react-hooks",
|
"name": "eslint-plugin-react-hooks",
|
||||||
"description": "ESLint rules for React Hooks",
|
"description": "ESLint rules for React Hooks",
|
||||||
"version": "4.6.0",
|
"version": "5.0.0",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "https://github.com/facebook/react.git",
|
"url": "https://github.com/facebook/react.git",
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
function isHookName(s) {
|
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
|
* Checks if the node is a React component name. React component names must
|
||||||
* always start with a non-lowercase letter. So `MyComponent` or `_MyComponent`
|
* always start with an uppercase letter.
|
||||||
* are valid component names for instance.
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
function isComponentName(node) {
|
function isComponentName(node) {
|
||||||
if (node.type === 'Identifier') {
|
return node.type === 'Identifier' && /^[A-Z]/.test(node.name);
|
||||||
return !/^[a-z]/.test(node.name);
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function isReactFunction(node, functionName) {
|
function isReactFunction(node, functionName) {
|
||||||
|
|
Loading…
Reference in New Issue