Skip to content

Hardened ESLint rules and Biome for Formatting #119

Description

@ryancraigdavis

Harden ESLint + adopt Biome (formatter only) in Redux_GUI, and make checks blocking

Type: Chore / Code Quality
Repo: Redux_GUI

Summary

The GUI runs ESLint at the bare baseline, the CI lint step is non-blocking, and there's no formatter at all. Harden the ESLint config for linting, adopt Biome as the formatter (replacing the need for Prettier),
and make both required checks on PRs. ESLint stays the linter; Biome only formats.

Current state

  • eslint.config.js is a pure passthrough of eslint-config-next/core-web-vitals — no custom rules, no overrides, no extra plugins, no .eslintrc*, no eslintConfig in package.json.
  • No formatter of any kind.
  • CI lint runs with continue-on-error: true in .github/workflows/code-analysis.yml (results upload to the Security tab but never block a merge); that step also pins Node 22 while the rest of CI uses Node 26.
  • Real defects sit in unchecked source today, e.g.: unused/typo'd Typograph import in pages/index.js; undefined solver in processReductionVisualizations; var + == in isCertificateValid; shadowed solution in
    requestMappedSolutionTransitive; pervasive console.log in components/redux/index.js.

Motivation

Catch this class of bug automatically and consistently — important for a teaching repo with rotating student contributors — without losing the Next.js framework rules (next/image, next/link, next/script),
react-hooks, or jsx-a11y that eslint-config-next provides. Biome is used for formatting only so none of its linter limitations (dropping @next/next rules, plugin ecosystem) apply; its fast single LSP also serves
both neovim and VS Code/Codespaces contributors.

Scope

ESLint (linting)

  • Modernize eslint.config.js to a proper ESLint 9 flat config built on eslint-config-next.
  • Enable rules that catch current defects: react-hooks/exhaustive-deps (error), no-unused-vars, no-undef, eqeqeq, prefer-const, no-var, no-console (warn).
  • Add eslint-plugin-unused-imports for dead-import detection.
  • Add eslint-config-prettier to disable ESLint's stylistic/formatting rules so the linter never fights the formatter.
  • Do not add an ESLint import-order rule — import organizing is owned by Biome (see below) to avoid conflicts.

Biome (formatting only)

  • Add Biome + biome.json configured with the formatter and import-organizing (assist) enabled and the linter disabled.
  • Biome owns: JS/JSX, JSON, and styles/*.css formatting + import organizing.
  • Note the coverage gap: Biome does not format Markdown/YAML (Documentation/*.md, README.md, workflow YAML are not auto-formatted). Acceptable for now; a docs-only Prettier pass can be added later if desired.

Scripts

  • lint (eslint .), lint:fix, format (biome format --write .), format:check (biome format . / biome ci).

CI

  • In code-analysis.yml: remove continue-on-error, run eslint . --max-warnings 0 and the Biome format check as blocking, and align the Node version to 26 (matching the rest of CI).
  • Keep the SARIF → GitHub Security-tab upload working.

Initial pass

  • Commit the biome format --write reformat separately from the ESLint config/rule changes so the formatting churn is reviewable in isolation. Triage any remaining real lint findings.

Acceptance Criteria

  • npm run lint and npm run format:check exist and pass on a clean tree.
  • CI fails on lint errors, unused/undefined vars, and formatting violations (no continue-on-error, --max-warnings 0).
  • CI lint/format job runs on Node 26.
  • Next.js, react-hooks, and jsx-a11y rules remain active via ESLint.
  • eslint-config-prettier is applied; no lint/format rule conflicts.
  • Import organizing is owned solely by Biome (no duplicate ESLint import-order rule).
  • SARIF upload to the Security tab still functions.
  • Reformat committed separately from config changes.
  • The known defects above are surfaced (fixed here or filed as follow-ups).

Metadata

Metadata

Labels

enhancementNew feature or request

Fields

No fields configured for Feature.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions