useRefinementList: eslint fails with error "Avoid referencing unbound methods which may cause unintentional scoping of this"
VitaliyPotapov opened this issue · comments
🐛 Current behavior
When using useRefinementList as per documentation there is @typescript-eslint error:
Avoid referencing unbound methods which may cause unintentional scoping of `this`
🔍 Steps to reproduce
- enable @typescript-eslint/recommended-requiring-type-checking in the project
- use the following code:
const { refine } = useRefinementList({ attribute: 'brand' });
- run eslint and see output:
Error: Avoid referencing unbound methods which may cause unintentional scoping of `this`. If your function does not access `this`, you can annotate it with `this: void`, or consider using an arrow function instead. @typescript-eslint/unbound-method
Live reproduction
https://codesandbox.io/embed/heuristic-chihiro-f2nv7x?fontsize=14&hidenavigation=1&theme=dark
💭 Expected behavior
Eslint check pass
Package version
algoliasearch 4.16.0 react-instantsearch-hooks-web 6.42.0
Operating system
macOS 13.1
Browser
Chrome/112.0.0.0
Code of Conduct
- I agree to follow this project's Code of Conduct
The sandbox you shared doesn't have eslint configured, and is also not using useRefinementList as far as I can tell.
Could you share this somewhere it actually reproduces please? Thanks!
Our methods can safely be restructured, so I'm guessing this is somehow a false positive, although I'm not suer what we'd need to change to avoid typescript-eslint thinking the method loses its binding.
@Haroenv I've updated sandbox to demonstrate an issue: https://codesandbox.io/p/sandbox/heuristic-chihiro-f2nv7x?file=%2Fpackage.json&selection=%5B%7B%22endColumn%22%3A25%2C%22endLineNumber%22%3A6%2C%22startColumn%22%3A25%2C%22startLineNumber%22%3A6%7D%5D
After running in terminal npm run lint I get the following error:
Took me some time though other projects, but #5611 is the solution for this