eslint flat config & react 19 migration

.github/workflows/nextjs.yml

@@ -35,7 +35,7 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v4
         with:
-          version: 9.13.2
+          version: 9.15.0
       - name: Setup Node
         uses: actions/setup-node@v4
         with:

.nvmrc

@@ -1 +1 @@
-20
+22

config/eslint/import.mjs

@@ -0,0 +1,10 @@
+/** @type {import("eslint").Linter.Config} */
+export const importConfig = [
+  {
+    rules: {
+      'import/first': 'warn',
+      'import/newline-after-import': 'warn',
+      'import/no-duplicates': 'warn',
+    },
+  },
+];

config/eslint/javascript.mjs

@@ -0,0 +1,18 @@
+import js from '@eslint/js';
+
+/** @type {import("eslint").Linter.Config} */
+export const javascriptConfig = [
+  js.configs.recommended,
+  {
+    rules: {
+      'no-console': 'warn',
+      'no-alert': 'warn',
+      'object-shorthand': 'warn',
+      eqeqeq: 'warn',
+      'no-param-reassign': 'warn',
+      'prefer-template': 'warn',
+      'no-nested-ternary': 'warn',
+      'no-else-return': 'warn',
+    },
+  },
+];

config/eslint/next.mjs

@@ -0,0 +1,15 @@
+import { FlatCompat } from '@eslint/eslintrc';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+});
+
+/** @type {import("eslint").Linter.Config} */
+export const nextConfig = [
+  ...compat.extends('next/core-web-vitals', 'next/typescript'),
+];

config/eslint/prettier.mjs

@@ -0,0 +1,11 @@
+import eslintConfigPrettier from 'eslint-config-prettier';
+
+/** @type {import("eslint").Linter.Config} */
+export const prettierConfig = [
+  eslintConfigPrettier,
+  {
+    rules: {
+      curly: ['warn', 'multi-line'],
+    },
+  },
+];

config/eslint/typescript.mjs

@@ -0,0 +1,34 @@
+import tseslint from 'typescript-eslint';
+
+/** @type {import("eslint").Linter.Config} */
+export const typescriptConfig = [
+  ...tseslint.configs.strictTypeChecked,
+  // https://typescript-eslint.io/getting-started/typed-linting/
+  {
+    languageOptions: {
+      parserOptions: {
+        projectService: true,
+        tsconfigRootDir: import.meta.dirname,
+      },
+    },
+  },
+  {
+    rules: {
+      '@typescript-eslint/prefer-destructuring': 'warn',
+      '@typescript-eslint/consistent-type-imports': 'warn',
+      '@typescript-eslint/no-misused-promises': [
+        'warn',
+        { checksVoidReturn: false },
+      ],
+      '@typescript-eslint/restrict-template-expressions': [
+        'warn',
+        { allowNumber: true },
+      ],
+    },
+  },
+  // https://typescript-eslint.io/getting-started/typed-linting/#how-can-i-disable-type-aware-linting-for-a-subset-of-files
+  {
+    files: ['**/*.{js,mjs}'],
+    ...tseslint.configs.disableTypeChecked,
+  },
+];

config/eslint/unicorn.mjs

@@ -0,0 +1,19 @@
+import eslintPluginUnicorn from 'eslint-plugin-unicorn';
+
+/** @type {import("eslint").Linter.Config} */
+export const unicornConfig = [
+  eslintPluginUnicorn.configs['flat/recommended'],
+  // https://github.com/sindresorhus/eslint-plugin-unicorn/tree/main?tab=readme-ov-file#rules
+  {
+    rules: {
+      'unicorn/prevent-abbreviations': 'off',
+      'unicorn/no-null': 'off',
+      'unicorn/prefer-module': 'off',
+      'unicorn/explicit-length-check': 'off',
+      'unicorn/prefer-ternary': 'off',
+      'unicorn/no-array-for-each': 'off',
+      'unicorn/prefer-export-from': 'off',
+      'unicorn/prefer-global-this': 'off',
+    },
+  },
+];

eslint.config.mjs

@@ -0,0 +1,28 @@
+import onlyWarn from 'eslint-plugin-only-warn';
+import { importConfig } from './config/eslint/import.mjs';
+import { javascriptConfig } from './config/eslint/javascript.mjs';
+import { nextConfig } from './config/eslint/next.mjs';
+import { prettierConfig } from './config/eslint/prettier.mjs';
+import { typescriptConfig } from './config/eslint/typescript.mjs';
+import { unicornConfig } from './config/eslint/unicorn.mjs';
+
+// https://nextjs.org/docs/app/api-reference/config/eslint#additional-configurations
+/** @type {import("eslint").Linter.Config} */
+const config = [
+  ...javascriptConfig,
+  ...typescriptConfig,
+  ...importConfig,
+  ...unicornConfig,
+  ...prettierConfig,
+  {
+    plugins: {
+      onlyWarn,
+    },
+  },
+  {
+    ignores: ['src/core/gql'],
+  },
+  ...nextConfig,
+];
+
+export default config;

next.config.ts

@@ -11,10 +11,13 @@ const nextConfig: NextConfig = {
     // To make `next lint` check files and folders besides the default folders (`src`, `app` etc.):
     // https://nextjs.org/docs/app/building-your-application/configuring/eslint#linting-custom-directories-and-files
     dirs: [
+      'config',
       'src',
+      'eslint.config.mjs',
       'lint-staged.config.mjs',
+      'next.config.ts',
       'postcss.config.js',
-      'prettier.config.js',
+      'prettier.config.mjs',
       'tailwind.config.ts',
     ],
   },

package.json

@@ -23,48 +23,40 @@
     "@uiw/codemirror-extensions-langs": "4.19.8",
     "@uiw/codemirror-themes-all": "4.19.8",
     "@uiw/react-codemirror": "4.19.8",
-    "@zag-js/focus-visible": "^0.77.1",
+    "@zag-js/focus-visible": "^0.78.3",
     "file-saver": "^2.0.5",
     "html2canvas": "^1.4.1",
-    "next": "15.0.3",
-    "react": "19.0.0-rc-02c0e824-20241028",
-    "react-dom": "19.0.0-rc-02c0e824-20241028",
-    "react-icons": "^5.3.0",
-    "react-select": "^5.8.3",
+    "next": "15.1.0",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "react-icons": "^5.4.0",
+    "react-select": "^5.9.0",
     "react-toastify": "^10.0.6",
-    "tailwind-merge": "^2.5.4"
+    "tailwind-merge": "^2.5.5"
   },
   "devDependencies": {
     "@types/file-saver": "^2.0.7",
-    "@types/node": "^22.9.0",
-    "@types/react": "npm:types-react@19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
-    "@typescript-eslint/eslint-plugin": "^7.17.0",
-    "@typescript-eslint/parser": "^7.17.0",
+    "@types/node": "^22.10.2",
+    "@types/react": "19.0.1",
+    "@types/react-dom": "19.0.2",
     "autoprefixer": "^10.4.20",
-    "eslint": "^8.57.0",
-    "eslint-config-next": "15.0.3",
+    "eslint": "^9.17.0",
+    "eslint-config-next": "15.1.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-deprecation": "^3.0.0",
     "eslint-plugin-only-warn": "^1.1.0",
-    "eslint-plugin-unicorn": "^55.0.0",
-    "husky": "^9.1.6",
-    "knip": "^5.37.1",
-    "lint-staged": "^15.2.10",
+    "eslint-plugin-unicorn": "^56.0.1",
+    "husky": "^9.1.7",
+    "knip": "^5.40.0",
+    "lint-staged": "^15.2.11",
     "npm-check-updates": "^17.1.11",
     "postcss": "^8.4.49",
-    "prettier": "^3.3.3",
+    "prettier": "^3.4.2",
     "prettier-plugin-organize-imports": "^4.1.0",
-    "prettier-plugin-packagejson": "^2.5.3",
-    "prettier-plugin-tailwindcss": "^0.6.8",
-    "tailwindcss": "^3.4.15",
-    "typescript": "^5.6.3"
+    "prettier-plugin-packagejson": "^2.5.6",
+    "prettier-plugin-tailwindcss": "^0.6.9",
+    "tailwindcss": "^3.4.16",
+    "typescript": "^5.7.2",
+    "typescript-eslint": "^8.18.0"
   },
-  "packageManager": "pnpm@9.13.2",
-  "pnpm": {
-    "overrides": {
-      "@types/react": "npm:types-react@19.0.0-rc.1",
-      "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1"
-    }
-  }
+  "packageManager": "pnpm@9.15.0"
 }