Closed
Description
- [ x ] I have tried restarting my IDE and the issue persists.
- [ x ] I have updated to the latest version of the packages.
- [ x ] I have read the FAQ and my problem is not listed.
Repro
When using generic react components a warning about the generic type is fired about dependency arrays. It only fires when the parser is a version 4 or higher - this did not occur with version 3.8
React Hook React.useCallback has a missing dependency: 'T'. Either include it or remove the dependency array
{
"rules": {
"@typescript-eslint/explicit-module-boundary-types": "off",
"react-hooks/exhaustive-deps": "warn",
}
}// Libraries
import * as React from 'react'
type EntityWithId = { id: string }
export interface Props<T extends EntityWithId> {
entities: T[]
toggleSelected: (entity: T) => void
}
function EntityTable<T extends EntityWithId>({
entities,
toggleSelected,
}: Props<T>) {
const toggleSelection = React.useCallback(
(entity: T) => {
toggleSelected(entity)
},
[toggleSelected]
)
return (
<>
{entities.map((entity) => (
<button key={entity.id} onClick={() => toggleSelection(entity)}>
Toggle Me
</button>
))}
</>
)
}
export default EntityTable"compilerOptions": {
"allowJs": true,
"jsx": "react",
"target": "es2019",
"module": "esnext",
"moduleResolution": "Node",
"esModuleInterop": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true,
"importsNotUsedAsValues": "error",
"noImplicitAny": false,
"noImplicitThis": true,
"alwaysStrict": true,
"strictBindCallApply": true,
"strictFunctionTypes": true,
"strictNullChecks": false,
"strictPropertyInitialization": false,
}Expected Result
No warning
Actual Result
19:5 warning React Hook React.useCallback has a missing dependency: 'T'. Either include it or remove the dependency array react-hooks/exhaustive-deps
Additional Info
Versions
| package | version |
|---|---|
@typescript-eslint/eslint-plugin |
4.1.0 |
@typescript-eslint/parser |
4.1.0 |
TypeScript |
4.0.2 |
ESLint |
7.8.1 |
node |
14.4.0 |