✨ (eslint) NICE-129 continued flat config upgrade (#1511)

📝  (eslint) NICE-129 README (#1511)

config/eslint-config/README.md

@@ -3,68 +3,98 @@
 Custom `eslint-config` setup that can be extended and incorporates:
 
 - `@babel/eslint-parser`
-- `@typescript-eslint/eslint-plugin`
+- `@eslint/*`
 - `@typescript-eslint/parser`
 - `eslint`
 - `eslint-config-next`
 - `eslint-config-prettier`
-- `eslint-plugin-import`
+- `eslint-plugin-import-x`
 - `eslint-plugin-jest`
 - `eslint-plugin-jsx-a11y`
 - `eslint-plugin-react`
 - `eslint-plugin-react-hooks`
 - `prettier`
+- `typescript-eslint`
 
 ## Breakdown
 
-All currently `cjs` format:
-
 - `./index` (base)
 - `./typescript`
-  - `./react` (+ typescript)
-    - `./jest` (+ react)
-    - `./next` (+ react)
+- `./react` (+ typescript)
+  - `./jest` (+ react)
+  - `./next` (+ react)
+    - `./tailwind` (+ next)
 
 ```sh
-yarn add @jeromefitz/eslint-config --dev
+pnpm add @jeromefitz/eslint-config --save-dev
 ```
 
 ### Base
 
-```js
-{
-    "extends": "@jeromefitz/eslint-config"
-}
+```ts
+import { configBase } from '@jeromefitz/eslint-config/base.js'
+
+// ...
+
+const config = [...configBase]
 ```
 
 ### Jest
 
 ```js
-{
-    "extends": "@jeromefitz/eslint-config/jest"
-}
+import { configJest } from '@jeromefitz/eslint-config/jest.js'
+
+// ...
+
+const config = [...configJest]
 ```
 
 ### Next
 
 ```js
-{
-    "extends": "@jeromefitz/eslint-config/next"
-}
+import { configNext } from '@jeromefitz/eslint-config/next.js'
+
+// ...
+
+const config = [...configNext]
 ```
 
 ### React
 
 ```js
-{
-    "extends": "@jeromefitz/eslint-config/react"
-}
+import { configReact } from '@jeromefitz/eslint-config/react.js'
+
+// ...
+
+const config = [...configReact]
 ```
 
-### TypeScript
+### Tailwind
 
 ```js
-{
-    "extends": "@jeromefitz/eslint-config/typescript"
-}
+import { configTailwind } from '@jeromefitz/eslint-config/tailwind.js'
+
+// ...
+
+const config = [...configTailwind]
 ```
+
+### Typescript
+
+```js
+import { configTypescript } from '@jeromefitz/eslint-config/typescript.js'
+
+// ...
+
+const config = [...configTypescript]
+```
+
+## Please Note
+
+The eslint ecosystem will slowly (but surely) move from `eslint@8` to `eslint@9`.
+
+`@jeromefitz/eslint-config@4` will be a holding pattern and may from time-to-time introduce potential **breaking** changes in linting. This is done so we do not have to bump a major _every_ single time we upgrade package(s) from `eslint@8` => `eslint@9`.
+
+In some regards this should be permanent `canary` until then, but will try to call out any breaking in PRs as we move forward.
+
+> **📝 Note:** See #1511 for more information.

config/eslint-config/package.json

@@ -30,14 +30,15 @@
   "dependencies": {
     "@babel/core": "7.24.7",
     "@babel/eslint-parser": "7.24.7",
+    "@eslint/compat": "1.1.0",
     "@eslint/eslintrc": "3.1.0",
+    "@eslint/js": "9.6.0",
     "@next/eslint-plugin-next": "14.2.4",
-    "@typescript-eslint/eslint-plugin": "7.15.0",
     "@typescript-eslint/parser": "7.15.0",
     "eslint": "9.6.0",
     "eslint-config-next": "14.2.4",
     "eslint-config-turbo": "2.0.6",
-    "eslint-plugin-import": "2.29.1",
+    "eslint-plugin-import-x": "0.5.3",
     "eslint-plugin-jest": "28.6.0",
     "eslint-plugin-jest-dom": "5.4.0",
     "eslint-plugin-jsx-a11y": "6.9.0",
@@ -48,12 +49,15 @@
     "eslint-plugin-storybook": "0.8.0",
     "eslint-plugin-tailwindcss": "3.17.4",
     "eslint-plugin-testing-library": "6.2.2",
-    "eslint-plugin-turbo": "2.0.6"
+    "eslint-plugin-turbo": "2.0.6",
+    "typescript-eslint": "7.15.0"
   },
   "devDependencies": {
+    "@types/eslint__js": "8.42.3",
     "@types/lodash": "4.17.6",
     "lodash": "4.17.21",
-    "tailwindcss": "3.4.4"
+    "tailwindcss": "3.4.4",
+    "typescript": "5.5.2"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

config/eslint-config/release.config.js

@@ -18,8 +18,7 @@ const { name } = pkg
 
 const branches = [
   ...configDefault.branches,
-  { name: 'refactor/turbo-2--migration', prerelease: 'canary' },
-  { name: 'NICE-68', prerelease: 'canary' },
+  { name: 'NICE-129', prerelease: 'canary' },
 ]
 
 const configPassed = {

config/eslint-config/src/base.js

@@ -1,4 +1,5 @@
 import parserBabel from '@babel/eslint-parser'
+import eslint from '@eslint/js'
 import pluginPerfectionist from 'eslint-plugin-perfectionist'
 
 import { RULES } from './_lib.js'
@@ -7,6 +8,7 @@ const PERFECTIONIST_CONFIG = 'recommended-natural'
 const perfectionistRules = pluginPerfectionist.configs[PERFECTIONIST_CONFIG].rules
 
 const configBase = [
+  eslint.configs.recommended,
   {
     ignores: [
       '.next/*',

config/eslint-config/src/typescript.js

@@ -1,28 +1,56 @@
-/**
- * @todo(eslint) I think I should just getCompat and do multiple
- */
-import path from 'path'
-import { fileURLToPath } from 'url'
-
-import pluginTypescript from '@typescript-eslint/eslint-plugin'
 import parserTypescript from '@typescript-eslint/parser'
-import pluginImport from 'eslint-plugin-import'
+import pluginImportX from 'eslint-plugin-import-x'
+import tseslint from 'typescript-eslint'
 
-import { RULES, getCompat } from './_lib.js'
+import { RULES } from './_lib.js'
 import configBase from './base.js'
 
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = path.dirname(__filename)
-
-const compat = getCompat(__dirname)
-
-const typescriptRules = {
-  ...pluginTypescript.configs['eslint-recommended'].overrides[0].rules,
-  ...pluginTypescript.configs['recommended'].rules,
-  ...pluginTypescript.configs['recommended-requiring-type-checking'].rules,
-}
+/**
+ * @hack(typescript-eslint) w/o run into following error
+ *  b/c parser is passed as meta instead of explicit (?):
+ *
+ * Error while loading rule '@typescript-eslint/await-thenable':
+ * You have used a rule which requires parserServices to be generated.
+ * You must therefore provide a value for the "parserOptions.project"
+ *  property for @typescript-eslint/parser.
+ */
+let recommendedTypeChecked = []
+tseslint.configs.recommendedTypeChecked.map((obj) => {
+  if (obj.name === 'typescript-eslint/base') {
+    return {
+      ...obj,
+      languageOptions: {
+        ...obj.languageOptions,
+        parser: parserTypescript,
+      },
+    }
+  }
+  return obj
+})
+let stylisticTypeChecked = []
+tseslint.configs.stylisticTypeChecked.map((obj) => {
+  if (obj.name === 'typescript-eslint/base') {
+    return {
+      ...obj,
+      languageOptions: {
+        ...obj.languageOptions,
+        parser: parserTypescript,
+      },
+    }
+  }
+  return obj
+})
 
 const configTypescript = [
+  tseslint.configs.eslintRecommended,
+  ...tseslint.configs.recommended,
+  ...tseslint.configs.stylistic,
+  ...recommendedTypeChecked,
+  ...stylisticTypeChecked,
+  pluginImportX.configs.typescript,
+  /**
+   * @note(eslint) Custom Settings for @jeromefitz/eslint-config
+   */
   {
     files: ['**/*.ts?(x)'],
     languageOptions: {
@@ -39,33 +67,25 @@ const configTypescript = [
       },
     },
     name: '@jeromefitz/eslint-config:typescript',
-    plugins: { '@typescript-eslint': pluginTypescript, import: pluginImport },
     rules: {
-      ...typescriptRules,
-      ...compat.extends('plugin:import/typescript')[0]?.rules,
       '@typescript-eslint/explicit-module-boundary-types': RULES.OFF,
+      '@typescript-eslint/no-duplicate-type-constituents': RULES.ERROR,
       '@typescript-eslint/no-empty-function': RULES.OFF,
       '@typescript-eslint/no-explicit-any': RULES.OFF,
+      '@typescript-eslint/no-floating-promises': RULES.ERROR,
       '@typescript-eslint/no-non-null-assertion': RULES.OFF,
-      '@typescript-eslint/no-unsafe-argument': RULES.OFF, // @todo(lint) move to error
+      '@typescript-eslint/no-redundant-type-constituents': RULES.ERROR,
+      // @todo(lint) ⬇️ move to error
+      '@typescript-eslint/no-unsafe-argument': RULES.OFF,
       '@typescript-eslint/no-unsafe-assignment': RULES.OFF,
       '@typescript-eslint/no-unsafe-call': RULES.OFF,
       '@typescript-eslint/no-unsafe-member-access': RULES.OFF,
       '@typescript-eslint/no-unsafe-return': RULES.OFF,
       '@typescript-eslint/no-var-requires': RULES.WARN,
+      '@typescript-eslint/require-await': RULES.ERROR,
       '@typescript-eslint/restrict-template-expressions': RULES.OFF,
     },
   },
-  // overrides: [
-  //   {
-  //     extends: [
-  //       'plugin:@typescript-eslint/eslint-recommended',
-  //       'plugin:@typescript-eslint/recommended',
-  //       'plugin:@typescript-eslint/recommended-requiring-type-checking',
-  //       'plugin:import/typescript',
-  //     ],
-  //     plugins: ['@typescript-eslint', 'import'],
-  //   },
 ]
 
 export { configTypescript }

package.json

@@ -69,6 +69,7 @@
       "@semantic-release/commit-analyzer@13.0.0": "patches/@semantic-release__commit-analyzer@13.0.0.patch"
     },
     "overrides": {
+      "@typescript-eslint/parser": "7.15.0",
       "micromatch": "4.0.5"
     }
   }