[React + Typescript] Definition for rule 'react-hooks/exhaustive-deps' was not found

[tasoskakour]

My package.json

{
    "name": "app",
    "version": "1.0.0",
    "main": "src/index.js",
    "license": "MIT",
    "scripts": {
        "dev": "react-scripts start",
    },
    "xo": {
        "prettier": true,
        "extends": [
            "xo-react"
        ],
        "envs": [
            "jest",
            "browser"
        ],
        "rules": {
            "react/prop-types": "off",
            "node/no-unsupported-features/es-syntax": "off",
            "import/extensions": [
                "error",
                {
                    "js": "never",
                    "json": "never",
                    "css": "always",
                    "png": "always"
                }
            ],
            "node/file-extension-in-import": "off",
            "no-unused-vars": "off",
            "@typescript-eslint/no-unused-vars": [
                "warn",
                {
                    "args": "all",
                    "argsIgnorePattern": "(^_$)|(^__)|(req)|(res)|(next)",
                    "varsIgnorePattern": "(^_$)|(^__)"
                }
            ]
        }
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    },
    "dependencies": {
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-scripts": "^4.0.3"
    },
    "devDependencies": {
        "@types/node": "^15.0.1",
        "@types/react": "^17.0.4",
        "@types/react-dom": "^17.0.3",
        "@typescript-eslint/eslint-plugin": "^4.22.0",
        "@typescript-eslint/parser": "^4.22.0",
        "eslint-config-xo-react": "^0.25.0",
        "eslint-plugin-react": "^7.23.2",
        "eslint-plugin-react-hooks": "^4.2.0",
        "husky": "^6.0.0",
        "lint-staged": "^10.5.4",
        "typescript": "^4.2.4",
        "xo": "^0.38.2"
    },
    "engines": {
        "node": ">=14"
    },
    "lint-staged": {
        "*.js": "xo --fix"
    }
}

An example src/hooks/use-component-did-update.ts file:

import {useRef, useEffect} from 'react';

type fn = (handler: any, watchProps: any[]) => void;

const useComponentDidUpdate: fn = (handler, watchProps = []) => {
	const mounted = useRef(false);
	useEffect(() => {
		if (mounted.current) {
			handler();
		} else {
			mounted.current = true;
		}
		// eslint-disable-next-line react-hooks/exhaustive-deps
	}, watchProps);
};

export default useComponentDidUpdate;

Produces error:

src/hooks/use-component-did-update.ts
  Line 13:3:  Definition for rule 'react-hooks/exhaustive-deps' was not found  react-hooks/exhaustive-deps

Any ideas?