diff --git a/CHANGELOG.md b/CHANGELOG.md index dc66106ce7..1e467dc470 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,10 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel * [`no-unused-class-component-methods`]: Handle unused class component methods ([#2166][] @jakeleventhal @pawelnvk) * add [`no-arrow-function-lifecycle`] ([#1980][] @ngtan) +### Fixed +* [`propTypes`]: add `VoidFunctionComponent` to react generic list ([#3092][] @vedadeepta) + +[#3092]: https://github.com/yannickcr/eslint-plugin-react/pull/3092 [#2166]: https://github.com/yannickcr/eslint-plugin-react/pull/2166 [#1980]: https://github.com/yannickcr/eslint-plugin-react/pull/1980 diff --git a/lib/util/propTypes.js b/lib/util/propTypes.js index b9e397deb7..cf355150a6 100644 --- a/lib/util/propTypes.js +++ b/lib/util/propTypes.js @@ -100,7 +100,7 @@ module.exports = function propTypesInstructions(context, components, utils) { const defaults = {customValidators: []}; const configuration = Object.assign({}, defaults, context.options[0] || {}); const customValidators = configuration.customValidators; - const allowedGenericTypes = new Set(['PropsWithChildren', 'SFC', 'StatelessComponent', 'FunctionComponent', 'FC']); + const allowedGenericTypes = new Set(['VoidFunctionComponent', 'PropsWithChildren', 'SFC', 'StatelessComponent', 'FunctionComponent', 'FC']); const genericReactTypesImport = new Set(); /** diff --git a/tests/lib/rules/prop-types.js b/tests/lib/rules/prop-types.js index b23e95eecd..f369b36d0f 100644 --- a/tests/lib/rules/prop-types.js +++ b/tests/lib/rules/prop-types.js @@ -3317,6 +3317,36 @@ ruleTester.run('prop-types', rule, { }; `, parser: parsers['@TYPESCRIPT_ESLINT'] + }, + { + code: ` + import React, { VoidFunctionComponent } from 'react' + + interface Props { + age: number + } + const Hello: VoidFunctionComponent = function Hello(props) { + const { age } = props; + + return
Hello {age}
; + } + `, + parser: parsers['@TYPESCRIPT_ESLINT'] + }, + { + code: ` + import React from 'react' + + interface Props { + age: number + } + const Hello: React.VoidFunctionComponent = function Hello(props) { + const { age } = props; + + return
Hello {age}
; + } + `, + parser: parsers['@TYPESCRIPT_ESLINT'] } ]), { @@ -6896,6 +6926,48 @@ ruleTester.run('prop-types', rule, { } ], parser: parsers['@TYPESCRIPT_ESLINT'] + }, + { + code: ` + import React, { VoidFunctionComponent } from 'react' + + interface Props { + age: number + } + const Hello: VoidFunctionComponent = function Hello(props) { + const { test } = props; + + return
Hello {name}
; + } + `, + errors: [ + { + messageId: 'missingPropType', + data: {name: 'test'} + } + ], + parser: parsers['@TYPESCRIPT_ESLINT'] + }, + { + code: ` + import React from 'react' + + interface Props { + age: number + } + const Hello: React.VoidFunctionComponent = function Hello(props) { + const { test } = props; + + return
Hello {name}
; + } + `, + errors: [ + { + messageId: 'missingPropType', + data: {name: 'test'} + } + ], + parser: parsers['@TYPESCRIPT_ESLINT'] } ]) )