From 9da14d52c2c9fa64806b511ddc974472af6e1f0a Mon Sep 17 00:00:00 2001 From: Bassam Tabbara Date: Tue, 20 Oct 2026 07:50:47 -0700 Subject: [PATCH] Fix npm run lint and run it in CI `npm run lint` fails on every checkout: it calls `next lint`, which Next 16 removed, and the repo has no ESLint flat config, so running `eslint` directly fails too. Lint has silently not run, and 11 errors built up. Replace the script with `eslint .` and add an `eslint.config.mjs` using eslint-config-next's core-web-vitals and TypeScript presets, then fix the errors: - Use next/link for internal links in Nav and Footer. The RSS link stays a plain anchor because /feed.xml is XML, not a page. - Nav: the homepage now passes a `hero` prop instead of Nav discovering the hero and setting state synchronously in an effect. Pages without a hero render the logo from the first paint instead of after hydration. - PostList: reset the visible count during render when the posts prop changes, rather than in an effect. Add a lint step to the CI workflow so this does not regress, and update CONTRIBUTING.md to say CI runs all three checks. The 18 remaining warnings, mostly over next/image, match how the site is built and are left as is. Signed-off-by: Bassam Tabbara --- .github/workflows/blog-check.yml | 8 ++++-- CONTRIBUTING.md | 2 +- eslint.config.mjs | 8 ++++++ package.json | 2 +- pages/index.tsx | 2 +- src/components/Footer.tsx | 9 ++++--- src/components/Nav.tsx | 41 ++++++++++++++++------------- src/components/blog/BlogSidebar.tsx | 2 ++ src/components/blog/PostList.tsx | 6 +++-- 9 files changed, 50 insertions(+), 30 deletions(-) create mode 100644 eslint.config.mjs diff --git a/.github/workflows/blog-check.yml b/.github/workflows/blog-check.yml index 854c99a..76c879a 100644 --- a/.github/workflows/blog-check.yml +++ b/.github/workflows/blog-check.yml @@ -1,7 +1,8 @@ name: Blog check -# Validates blog post frontmatter and runs a full build on PRs that touch blog -# content or the website code, so broken MDX or missing fields are caught before merge. +# Lints the code, validates blog post frontmatter, and runs a full build on PRs that +# touch blog content or the website code, so lint errors, broken MDX, or missing +# fields are caught before merge. on: pull_request: paths: @@ -9,6 +10,7 @@ on: - 'pages/blog/**' - 'src/**' - 'package.json' + - 'eslint.config.mjs' jobs: build: @@ -20,6 +22,8 @@ jobs: node-version: 20 cache: npm - run: npm ci + - name: Lint + run: npm run lint - name: Validate frontmatter run: node scripts/validate-posts.mjs - name: Build diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index a17bba6..69274b4 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -31,7 +31,7 @@ layout, frontmatter, and assets. ## Before you open a pull request -Run these locally; CI runs the last two on every pull request: +Run these locally; CI runs them on every pull request: ```bash npm run lint diff --git a/eslint.config.mjs b/eslint.config.mjs new file mode 100644 index 0000000..7356b1a --- /dev/null +++ b/eslint.config.mjs @@ -0,0 +1,8 @@ +import nextVitals from "eslint-config-next/core-web-vitals"; +import nextTs from "eslint-config-next/typescript"; + +export default [ + ...nextVitals, + ...nextTs, + { ignores: [".next/**", "node_modules/**", "next-env.d.ts"] }, +]; diff --git a/package.json b/package.json index 6e9a485..bac626a 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "dev": "next dev", "build": "next build", "start": "next start", - "lint": "next lint", + "lint": "eslint .", "validate-posts": "node scripts/validate-posts.mjs", "capture-gif": "node scripts/capture-gif.mjs" }, diff --git a/pages/index.tsx b/pages/index.tsx index 97a2ca8..b01a345 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -35,7 +35,7 @@ export default function Home() { return ( <> -