From 7f655f8e1198fe95773702d72e976a9f725891b8 Mon Sep 17 00:00:00 2001 From: Roman Gusev Date: Thu, 8 Jun 2023 11:04:34 +0200 Subject: [PATCH] Revert "[Fix] `destructuring-assignment`: Handle destructuring of useContext in SFC" - [Tests] `destructuring-assignment`: Add more modern context cases This reverts commit 523db20c11e8a52c32d173e46950ac01f95dc96b / #2797 Fixes #3536. --- CHANGELOG.md | 2 + lib/rules/destructuring-assignment.js | 43 ++-------------- tests/lib/rules/destructuring-assignment.js | 56 +++++++++------------ 3 files changed, 30 insertions(+), 71 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0380eb8836..00fb84de19 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,11 +20,13 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange * [`display-name`], [`prop-types`]: when checking for a capitalized name, ignore underscores entirely ([#3560][] @ljharb) * [`no-unused-state`]: avoid crashing on a class field function with destructured state ([#3568][] @ljharb) * [`no-unused-prop-types`]: allow using spread with object expression in jsx ([#3570][] @akulsr0) +* Revert "[`destructuring-assignment`]: Handle destructuring of useContext in SFC" ([#3583][] [#2797][] @102) ### Changed * [Docs] [`jsx-newline`], [`no-unsafe`], [`static-property-placement`]: Fix code syntax highlighting ([#3563][] @nbsp1221) * [readme] resore configuration URL ([#3582][] @gokaygurcan) +[#3583]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3583 [#3582]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3582 [#3570]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3570 [#3568]: https://github.com/jsx-eslint/eslint-plugin-react/issues/3568 diff --git a/lib/rules/destructuring-assignment.js b/lib/rules/destructuring-assignment.js index 730828619e..e4abdaede9 100644 --- a/lib/rules/destructuring-assignment.js +++ b/lib/rules/destructuring-assignment.js @@ -8,7 +8,6 @@ const Components = require('../util/Components'); const docsUrl = require('../util/docsUrl'); const isAssignmentLHS = require('../util/ast').isAssignmentLHS; const report = require('../util/report'); -const testReactVersion = require('../util/version').testReactVersion; const DEFAULT_OPTION = 'always'; @@ -95,8 +94,6 @@ module.exports = { const destructureInSignature = (context.options[1] && context.options[1].destructureInSignature) || 'ignore'; const sfcParams = createSFCParams(); - // set to save renamed var of useContext - const contextSet = new Set(); /** * @param {ASTNode} node We expect either an ArrowFunctionExpression, * FunctionDeclaration, or FunctionExpression @@ -131,7 +128,7 @@ module.exports = { function handleSFCUsage(node) { const propsName = sfcParams.propsName(); const contextName = sfcParams.contextName(); - // props.aProp + // props.aProp || context.aProp const isPropUsed = ( (propsName && node.object.name === propsName) || (contextName && node.object.name === contextName) @@ -145,21 +142,6 @@ module.exports = { }, }); } - - // const foo = useContext(aContext); - // foo.aProp - const isContextUsed = contextSet.has(node.object.name) && !isAssignmentLHS(node); - const optional = node.optional - // the below is for the old typescript-eslint parser - || context.getSourceCode().getText(node).slice(node.object.range[1] - node.range[0], node.object.range[1] - node.range[0] + 1) === '?'; - if (isContextUsed && configuration === 'always' && !optional) { - report(context, messages.useDestructAssignment, 'useDestructAssignment', { - node, - data: { - type: node.object.name, - }, - }); - } } function isInClassProperty(node) { @@ -194,9 +176,8 @@ module.exports = { } } - const hasHooks = testReactVersion(context, '>= 16.9'); - return { + FunctionDeclaration: handleStatelessComponent, ArrowFunctionExpression: handleStatelessComponent, @@ -231,31 +212,13 @@ module.exports = { const SFCComponent = components.get(context.getScope(node).block); const destructuring = (node.init && node.id && node.id.type === 'ObjectPattern'); - const identifier = (node.init && node.id && node.id.type === 'Identifier'); // let {foo} = props; - const destructuringSFC = destructuring && node.init.name === 'props'; - // let {foo} = useContext(aContext); - const destructuringUseContext = hasHooks && destructuring && node.init.callee && node.init.callee.name === 'useContext'; - // let foo = useContext(aContext); - const assignUseContext = hasHooks && identifier && node.init.callee && node.init.callee.name === 'useContext'; + const destructuringSFC = destructuring && (node.init.name === 'props' || node.init.name === 'context'); // let {foo} = this.props; const destructuringClass = destructuring && node.init.object && node.init.object.type === 'ThisExpression' && ( node.init.property.name === 'props' || node.init.property.name === 'context' || node.init.property.name === 'state' ); - if (SFCComponent && assignUseContext) { - contextSet.add(node.id.name); - } - - if (SFCComponent && destructuringUseContext && configuration === 'never') { - report(context, messages.noDestructAssignment, 'noDestructAssignment', { - node, - data: { - type: node.init.callee.name, - }, - }); - } - if (SFCComponent && destructuringSFC && configuration === 'never') { report(context, messages.noDestructAssignment, 'noDestructAssignment', { node, diff --git a/tests/lib/rules/destructuring-assignment.js b/tests/lib/rules/destructuring-assignment.js index b578fd0293..9c740dc7b5 100644 --- a/tests/lib/rules/destructuring-assignment.js +++ b/tests/lib/rules/destructuring-assignment.js @@ -374,6 +374,18 @@ ruleTester.run('destructuring-assignment', rule, { code: ` import { useContext } from 'react'; + const MyComponent = (props) => { + const {foo} = useContext(aContext); + return
{foo}
+ }; + `, + options: ['always'], + settings: { react: { version: '16.9.0' } }, + }, + { + code: ` + import { useContext } from 'react'; + const MyComponent = (props) => { const foo = useContext(aContext); return
{foo.test}
@@ -382,6 +394,18 @@ ruleTester.run('destructuring-assignment', rule, { options: ['never'], settings: { react: { version: '16.9.0' } }, }, + { + code: ` + import { useContext } from 'react'; + + const MyComponent = (props) => { + const foo = useContext(aContext); + return
{foo.test}
+ }; + `, + options: ['always'], + settings: { react: { version: '16.9.0' } }, + }, { code: ` const MyComponent = (props) => { @@ -860,36 +884,6 @@ ruleTester.run('destructuring-assignment', rule, { `, features: ['ts', 'no-babel'], }, - ] : [], - { - code: ` - import { useContext } from 'react'; - - const MyComponent = (props) => { - const foo = useContext(aContext); - return
{foo.test}
- }; - `, - options: ['always'], - settings: { react: { version: '16.9.0' } }, - errors: [ - { message: 'Must use destructuring foo assignment' }, - ], - }, - { - code: ` - import { useContext } from 'react'; - - const MyComponent = (props) => { - const {foo} = useContext(aContext); - return
{foo}
- }; - `, - options: ['never'], - settings: { react: { version: '16.9.0' } }, - errors: [ - { message: 'Must never use destructuring useContext assignment' }, - ], - } + ] : [] )), });