build: add react-hooks linting (#11006)
Fixed a couple of criticle errors and left the warnings as is (mostly from react-hooks/exhaustive-deps). Let's fix the warnings in future PRs as sometimes unexhaustive deps are intentional.
This commit is contained in:
parent
a491b6db41
commit
220c410df4
|
|
@ -17,7 +17,12 @@
|
|||
* under the License.
|
||||
*/
|
||||
module.exports = {
|
||||
extends: ['airbnb', 'prettier', 'prettier/react'],
|
||||
extends: [
|
||||
'airbnb',
|
||||
'prettier',
|
||||
'prettier/react',
|
||||
'plugin:react-hooks/recommended',
|
||||
],
|
||||
parser: 'babel-eslint',
|
||||
parserOptions: {
|
||||
ecmaFeatures: {
|
||||
|
|
|
|||
|
|
@ -25879,9 +25879,9 @@
|
|||
}
|
||||
},
|
||||
"eslint-plugin-react-hooks": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.1.0.tgz",
|
||||
"integrity": "sha512-36zilUcDwDReiORXmcmTc6rRumu9JIM3WjSvV0nclHoUQ0CNrX866EwONvLR/UqaeqFutbAnVu8PEmctdo2SRQ==",
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.1.2.tgz",
|
||||
"integrity": "sha512-ykUeqkGyUGgwTtk78C0o8UG2fzwmgJ0qxBGPp2WqRKsTwcLuVf01kTDRAtOsd4u6whX2XOC8749n2vPydP82fg==",
|
||||
"dev": true
|
||||
},
|
||||
"eslint-scope": {
|
||||
|
|
|
|||
|
|
@ -246,7 +246,7 @@
|
|||
"eslint-plugin-no-only-tests": "^2.0.1",
|
||||
"eslint-plugin-prettier": "^3.1.3",
|
||||
"eslint-plugin-react": "^7.20.6",
|
||||
"eslint-plugin-react-hooks": "^4.1.0",
|
||||
"eslint-plugin-react-hooks": "^4.1.2",
|
||||
"exports-loader": "^0.7.0",
|
||||
"fetch-mock": "^7.7.3",
|
||||
"file-loader": "^6.0.0",
|
||||
|
|
|
|||
|
|
@ -21,8 +21,8 @@ import React, {
|
|||
useEffect,
|
||||
Component,
|
||||
FunctionComponent,
|
||||
RefObject,
|
||||
ReactElement,
|
||||
RefObject,
|
||||
} from 'react';
|
||||
import {
|
||||
ListChildComponentProps,
|
||||
|
|
@ -106,9 +106,11 @@ export default function WindowedMenuList<OptionType extends OptionTypeBase>({
|
|||
} = props;
|
||||
const {
|
||||
// Expose react-window VariableSizeList instance and HTML elements
|
||||
windowListRef = useRef(null),
|
||||
windowListRef: windowListRef_,
|
||||
windowListInnerRef,
|
||||
} = selectProps;
|
||||
const defaultWindowListRef = useRef<WindowedList>(null);
|
||||
const windowListRef = windowListRef_ || defaultWindowListRef;
|
||||
|
||||
// try get default option height from theme configs
|
||||
let { optionHeight } = selectProps;
|
||||
|
|
@ -118,7 +120,6 @@ export default function WindowedMenuList<OptionType extends OptionTypeBase>({
|
|||
|
||||
const itemCount = children.length;
|
||||
const totalHeight = optionHeight * itemCount;
|
||||
const listRef: RefObject<WindowedList> = windowListRef || useRef(null);
|
||||
|
||||
const Row: FunctionComponent<ListChildComponentProps> = ({
|
||||
data,
|
||||
|
|
@ -130,10 +131,10 @@ export default function WindowedMenuList<OptionType extends OptionTypeBase>({
|
|||
|
||||
useEffect(() => {
|
||||
const lastSelected = getLastSelected(children);
|
||||
if (listRef.current && lastSelected) {
|
||||
listRef.current.scrollToItem(lastSelected);
|
||||
if (windowListRef.current && lastSelected) {
|
||||
windowListRef.current.scrollToItem(lastSelected);
|
||||
}
|
||||
}, [children]);
|
||||
}, [children, windowListRef]);
|
||||
|
||||
return (
|
||||
<WindowedList
|
||||
|
|
@ -145,7 +146,7 @@ export default function WindowedMenuList<OptionType extends OptionTypeBase>({
|
|||
},
|
||||
className,
|
||||
)}
|
||||
ref={listRef}
|
||||
ref={windowListRef}
|
||||
outerRef={innerRef}
|
||||
innerRef={windowListInnerRef}
|
||||
height={Math.min(totalHeight, maxHeight)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue