Replace ESLint react-hooks stub with the real plugin and clear lint warnings #21

New issue

Open

opened 2026-06-24 01:07:26 +00:00 by rbrooks · 0 comments

rbrooks commented

2026-06-24 01:07:26 +00:00

Owner

Background

PR #19 added webapp/frontend/eslint.config.js (a dependency-free flat config) and wired npm run lint into CI. Because no npm/lockfile changes were possible at the time, the config currently registers a no-op stub for the react-hooks plugin — just enough so the existing // eslint-disable-next-line react-hooks/exhaustive-deps directives in the source resolve instead of erroring ("Definition for rule … was not found").

So react-hooks/exhaustive-deps is not actually being linted right now.

Task

When webapp/frontend/package.json is next touched:

Add eslint-plugin-react-hooks (and consider eslint-plugin-react) to devDependencies; run npm install to update package-lock.json.
In eslint.config.js, replace the reactHooksStub no-op with the real plugin and enable its recommended rules (react-hooks/rules-of-hooks: error, react-hooks/exhaustive-deps: warn).
Clean up the ~28 pre-existing warnings surfaced by the gate — mostly unused vars and unused React imports (React 19's automatic JSX runtime doesn't need the import). A couple are no-undef for browser globals (EventSource, FileReader) that the dependency-free globals list doesn't yet cover; eslint-plugin presets or adding them to the globals map fixes those.

Context

The stub lives in webapp/frontend/eslint.config.js (reactHooksStub), with a comment pointing here.
The lint gate is currently warnings-only (warnings don't fail the build), so this is a quality improvement, not a blocker.

Acceptance

react-hooks rules are actually enforced (real plugin, no stub).
npm run lint is clean (0 errors, 0 warnings) on main.

## Background PR #19 added `webapp/frontend/eslint.config.js` (a dependency-free flat config) and wired `npm run lint` into CI. Because no npm/lockfile changes were possible at the time, the config currently registers a **no-op stub** for the `react-hooks` plugin — just enough so the existing `// eslint-disable-next-line react-hooks/exhaustive-deps` directives in the source resolve instead of erroring ("Definition for rule … was not found"). So `react-hooks/exhaustive-deps` is **not actually being linted** right now. ## Task When `webapp/frontend/package.json` is next touched: 1. Add `eslint-plugin-react-hooks` (and consider `eslint-plugin-react`) to `devDependencies`; run `npm install` to update `package-lock.json`. 2. In `eslint.config.js`, replace the `reactHooksStub` no-op with the real plugin and enable its recommended rules (`react-hooks/rules-of-hooks`: error, `react-hooks/exhaustive-deps`: warn). 3. Clean up the ~28 pre-existing warnings surfaced by the gate — mostly unused vars and unused `React` imports (React 19's automatic JSX runtime doesn't need the import). A couple are `no-undef` for browser globals (`EventSource`, `FileReader`) that the dependency-free globals list doesn't yet cover; `eslint-plugin` presets or adding them to the globals map fixes those. ## Context - The stub lives in `webapp/frontend/eslint.config.js` (`reactHooksStub`), with a comment pointing here. - The lint gate is currently warnings-only (warnings don't fail the build), so this is a quality improvement, not a blocker. ## Acceptance - `react-hooks` rules are actually enforced (real plugin, no stub). - `npm run lint` is clean (0 errors, 0 warnings) on `main`.