diff --git a/CHANGELOG.md b/CHANGELOG.md index c6a7fe5..392ea97 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,19 @@ # Changelog +## v2.1.0 (2019-04-19) + +- Describe a workaround for ambiguous function expressions in the README +- Detect and allow using hooks inside named function expressions + + ```tsx + const withHoc = (Component: ComponentType) => + function WrappedComponent(props: TProps) { + // Naming the function expression allows using hooks + const [state] = useState(); + return ; + }; + ``` + ## v2.0.0 (2019-03-12) - Report violations whenever a React hook is used after an early return. diff --git a/README.md b/README.md index 516d3c6..b9187f7 100644 --- a/README.md +++ b/README.md @@ -48,6 +48,34 @@ Then, enable the rule by modifying `tslint.json`: To use report rule violations as warnings intead of errors, set it to `"warning"`. +## Workarounds + +For some arrow functions/function expressions, the rule has no way to determine whether those are a +component, a hook, both of which could contain hook calls, or a regular function that should not +contain hook calls. + +```ts +const withHoc = (Component: ComponentType) => ( + props: TProps, +) => { + const [state] = useState(); + return ; +}; +``` + +The workaround in those cases is to use a **named function expression**: + +```ts +const withHoc = (Component: ComponentType) => + function WrappedComponent(props: TProps) { + const [state] = useState(); + return ; + }; +``` + +Naming the function like a component (in _PascalCase_) unambiguously let's the rule treat the +function as a component. + ## False positives and not-covered cases There are some cases that seem hard to analyze and may result in false positives or false negatives. diff --git a/package-lock.json b/package-lock.json index d551c25..31867ee 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "tslint-react-hooks", - "version": "2.0.0", + "version": "2.1.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index b1ab7c3..9eb5580 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tslint-react-hooks", - "version": "2.0.0", + "version": "2.1.0", "description": "TSLint rule that enforces the Rules of Hooks", "main": "tslint-react-hooks.json", "scripts": {