fix: add react-hooks lint rule
Luke Karrys committed
Sep 25, 2023 at 09:27 UTC
020558a887c9d4e787c60bc18e860c79f0009f49
4 files changed
+12
-7
package-lock.json
+1
@@ -32880,6 +32880,7 @@
32880
"eslint-plugin-jsx-a11y": "^6.6.1",
32881
"eslint-plugin-primer-react": "1.0.1",
32882
"eslint-plugin-react": "^7.31.11",
32883
+ "eslint-plugin-react-hooks": "^4.6.0",
32884
"jest": "^29.3.1",
32885
"jest-environment-jsdom": "^29.3.1",
32886
"prettier": "^2.8.3"
theme/.eslintrc.js
+1
@@ -17,6 +17,7 @@ module.exports = {
17
'plugin:github/react',
18
'plugin:primer-react/recommended',
19
'prettier',
20
+ 'plugin:react-hooks/recommended',
21
],
22
settings: {
23
react: {
theme/package.json
+1
@@ -81,6 +81,7 @@
81
"eslint-plugin-jsx-a11y": "^6.6.1",
82
"eslint-plugin-primer-react": "1.0.1",
83
"eslint-plugin-react": "^7.31.11",
84
+ "eslint-plugin-react-hooks": "^4.6.0",
85
"jest": "^29.3.1",
86
"jest-environment-jsdom": "^29.3.1",
87
"prettier": "^2.8.3"
theme/src/components/nav-drawer.js
+9
-7
@@ -18,13 +18,15 @@ export function useNavDrawerState(breakpoint) {
18
}
19
const [isOpen, setOpen] = React.useState(false)
20
21
- const onResize = React.useCallback(() => {
22
- if (window.innerWidth >= breakpoint) {
23
- setOpen(false)
24
- }
25
- }, [setOpen])
26
-
27
- const debouncedOnResize = React.useCallback(debounce(onResize, 250), [onResize])
21
+ const debouncedOnResize = React.useMemo(
22
+ () =>
23
+ debounce(() => {
24
+ if (window.innerWidth >= breakpoint) {
25
+ setOpen(false)
26
+ }
27
+ }, 250),
28
+ [breakpoint],
29
+ )
30
31
React.useEffect(() => {
32
if (isOpen) {