diff --git a/.eslintrc.js b/.eslintrc.js index 677ca3d98..3cc83ee1f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -23,6 +23,7 @@ module.exports = { '@metamask/eslint-config/config/nodejs', '@metamask/eslint-config/config/mocha', 'plugin:react/recommended', + 'plugin:react-hooks/recommended', ], plugins: [ diff --git a/package.json b/package.json index 1d27a3913..6199e332f 100644 --- a/package.json +++ b/package.json @@ -223,6 +223,7 @@ "eslint-plugin-json": "^1.2.0", "eslint-plugin-mocha": "^6.2.2", "eslint-plugin-react": "^7.18.3", + "eslint-plugin-react-hooks": "^4.0.4", "fancy-log": "^1.3.3", "fast-glob": "^3.2.2", "file-loader": "^1.1.11", diff --git a/test/unit/app/controllers/permissions/permissions-log-controller-test.js b/test/unit/app/controllers/permissions/permissions-log-controller-test.js index ea99fcd2d..fa2e32889 100644 --- a/test/unit/app/controllers/permissions/permissions-log-controller-test.js +++ b/test/unit/app/controllers/permissions/permissions-log-controller-test.js @@ -58,6 +58,8 @@ const initMiddleware = (permLog) => { } const initClock = () => { + // useFakeTimers, is in fact, not a react-hook + // eslint-disable-next-line clock = useFakeTimers(1) } diff --git a/ui/app/components/app/transaction-list-item/transaction-list-item.component.js b/ui/app/components/app/transaction-list-item/transaction-list-item.component.js index e22345916..bbeb777e8 100644 --- a/ui/app/components/app/transaction-list-item/transaction-list-item.component.js +++ b/ui/app/components/app/transaction-list-item/transaction-list-item.component.js @@ -106,7 +106,7 @@ export default function TransactionListItem ({ transactionGroup, isEarliestNonce return } setShowDetails((prev) => !prev) - }, [isUnapproved, id]) + }, [isUnapproved, history, id]) const cancelButton = useMemo(() => { const cancelButton = ( @@ -131,7 +131,7 @@ export default function TransactionListItem ({ transactionGroup, isEarliestNonce ) : cancelButton - }, [cancelEnabled, cancelTransaction, hasCancelled]) + }, [isPending, t, isUnapproved, cancelEnabled, cancelTransaction, hasCancelled]) const speedUpButton = useMemo(() => { if (!shouldShowSpeedUp || !isPending || isUnapproved) { @@ -147,7 +147,7 @@ export default function TransactionListItem ({ transactionGroup, isEarliestNonce { t('speedUp') } ) - }, [shouldShowSpeedUp, isPending, retryTransaction]) + }, [shouldShowSpeedUp, isUnapproved, t, isPending, retryTransaction]) return ( <> diff --git a/ui/app/components/ui/identicon/blockieIdenticon/blockieIdenticon.component.js b/ui/app/components/ui/identicon/blockieIdenticon/blockieIdenticon.component.js index 7ed0d00e1..ae75e5474 100644 --- a/ui/app/components/ui/identicon/blockieIdenticon/blockieIdenticon.component.js +++ b/ui/app/components/ui/identicon/blockieIdenticon/blockieIdenticon.component.js @@ -14,7 +14,7 @@ const BlockieIdenticon = ({ address, diameter }) => { if (updatedDataUrl !== dataUrl) { setDataUrl(updatedDataUrl) } - }) + }, [dataUrl, address]) return ( <> diff --git a/ui/app/components/ui/menu/menu.stories.js b/ui/app/components/ui/menu/menu.stories.js index ec8822d62..c3071c798 100644 --- a/ui/app/components/ui/menu/menu.stories.js +++ b/ui/app/components/ui/menu/menu.stories.js @@ -6,7 +6,7 @@ export default { title: 'Menu', } -export const basic = () => { +export const Basic = () => { return (