feat(eslint): typescript config

.changeset/large-moose-drop.md

@@ -0,0 +1,5 @@
+---
+"@scaleway/eslint-config-react": major
+---
+
+remove usage of eslint-config-airbnb-typescript as it's not maintain anymore, migrate to stylistic package

eslint.config.mjs

@@ -15,6 +15,17 @@ export default [
     ],
   },
   {
+    settings: {
+      react: {
+        pragma: 'React', // Pragma to use, default to "React"
+        fragment: 'Fragment', // Fragment to use (may be a property of <pragma>), default to "Fragment"
+        version: 'detect', // React version. "detect" automatically picks the version you have installed.
+        // You can also use `16.0`, `16.3`, etc, if you want to override the detected value.
+        // Defaults to the "defaultVersion" setting and warns if missing, and to "detect" in the future
+        defaultVersion: '18', // Default React version to use when the version you have installed cannot be detected.
+        // If not provided, defaults to the latest React version.
+      },
+    },
     languageOptions: {
       globals: {
         ...globals.browser,
@@ -65,23 +76,6 @@ export default [
         project: ['tsconfig.json'],
       },
     },
-  })),
-  ...scwTypescript.map(config => ({
-    ...config,
-    files: [
-      'packages/changesets-renovate/**/*.ts{x,}',
-      'packages/validate-icu-locales/**/*.ts{x,}',
-      '**/__tests__/**/*.ts{x,}',
-    ],
-
-    languageOptions: {
-      ecmaVersion: 5,
-      sourceType: 'script',
-
-      parserOptions: {
-        project: ['tsconfig.json'],
-      },
-    },
 
     rules: {
       ...config.rules,
@@ -93,7 +87,6 @@ export default [
 
   {
     files: [
-      'packages/jest-helpers/**/*.ts{x,}',
       '**/__tests__/**/*.ts{x,}',
       '**/vitest.setup.ts',
       '**/*.config.ts',

package.json

@@ -35,8 +35,8 @@
     "builtin-modules": "4.0.0",
     "cross-env": "7.0.3",
     "esbuild-plugin-browserslist": "0.15.0",
-    "eslint": "9.13.0",
-    "globals": "15.12.0",
+    "eslint": "9.16.0",
+    "globals": "15.13.0",
     "happy-dom": "15.11.7",
     "husky": "9.1.7",
     "lint-staged": "15.2.10",

packages/cookie-consent/package.json

@@ -44,7 +44,6 @@
     "cookie": "1.0.1"
   },
   "devDependencies": {
-    "@types/cookie": "0.6.0",
     "react": "18.3.1",
     "@scaleway/use-segment": "workspace:*"
   },

packages/cookie-consent/src/CookieConsentProvider/__tests__/index.test.tsx

@@ -44,9 +44,9 @@ const integrations: Integrations = [
   },
 ]
 
-const mockUseSegmentIntegrations = vi.fn<
-  () => ReturnType<typeof useSegmentIntegrations>
->(() => ({
+type MockSegmentIntegrations = () => ReturnType<typeof useSegmentIntegrations>
+
+const mockUseSegmentIntegrations = vi.fn<MockSegmentIntegrations>(() => ({
   integrations,
   isLoaded: true,
 }))

packages/cookie-consent/src/CookieConsentProvider/types.ts

@@ -3,7 +3,10 @@ import type { CategoryKind } from './helpers'
 export type { CategoryKind }
 export type Consent = { [K in CategoryKind]: boolean }
 
-type Integration = { category: CategoryKind; name: string }
+type Integration = {
+  category: CategoryKind
+  name: string
+}
 
 export type Integrations = Integration[]
 

packages/eslint-config-react/airbnb/typescript.mjs

@@ -0,0 +1,192 @@
+import { fixupConfigRules, fixupPluginRules } from '@eslint/compat'
+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,
+})
+
+const config = compat.extends('airbnb-base')
+
+const defaultAirBnbRules = [...fixupPluginRules(config)].reduce(
+  (acc, currentConfig) => ({
+    ...acc,
+    ...currentConfig.rules,
+  }),
+  {},
+)
+
+export default [
+  ...fixupConfigRules(compat.extends('airbnb-base')),
+  {
+    rules: {
+      // Replace Airbnb 'camelcase' rule with '@typescript-eslint/naming-convention'
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/naming-convention.md
+      camelcase: 'off',
+      // The `@typescript-eslint/naming-convention` rule allows `leadingUnderscore` and `trailingUnderscore` settings. However, the existing `no-underscore-dangle` rule already takes care of this.
+      '@typescript-eslint/naming-convention': [
+        'error',
+        // Allow camelCase variables (23.2), PascalCase variables (23.8), and UPPER_CASE variables (23.10)
+        {
+          selector: 'variable',
+          format: ['camelCase', 'PascalCase', 'UPPER_CASE'],
+        },
+        // Allow camelCase functions (23.2), and PascalCase functions (23.8)
+        {
+          selector: 'function',
+          format: ['camelCase', 'PascalCase'],
+        },
+        // Airbnb recommends PascalCase for classes (23.3), and although Airbnb does not make TypeScript recommendations, we are assuming this rule would similarly apply to anything "type like", including interfaces, type aliases, and enums
+        {
+          selector: 'typeLike',
+          format: ['PascalCase'],
+        },
+      ],
+
+      // Replace Airbnb 'default-param-last' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/default-param-last.md
+      'default-param-last': 'off',
+      '@typescript-eslint/default-param-last':
+        defaultAirBnbRules['default-param-last'],
+
+      // Replace Airbnb 'dot-notation' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/dot-notation.md
+      'dot-notation': 'off',
+      '@typescript-eslint/dot-notation': defaultAirBnbRules['dot-notation'],
+
+      // Replace Airbnb 'no-array-constructor' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-array-constructor.md
+      'no-array-constructor': 'off',
+      '@typescript-eslint/no-array-constructor':
+        defaultAirBnbRules['no-array-constructor'],
+
+      // Replace Airbnb 'no-dupe-class-members' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-dupe-class-members.md
+      'no-dupe-class-members': 'off',
+      '@typescript-eslint/no-dupe-class-members':
+        defaultAirBnbRules['no-dupe-class-members'],
+
+      // Replace Airbnb 'no-empty-function' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-empty-function.md
+      'no-empty-function': 'off',
+      '@typescript-eslint/no-empty-function':
+        defaultAirBnbRules['no-empty-function'],
+
+      // Replace Airbnb 'no-extra-parens' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-extra-parens.md
+      'no-extra-parens': 'off',
+      '@typescript-eslint/no-extra-parens':
+        defaultAirBnbRules['no-extra-parens'],
+
+      // Replace Airbnb 'no-implied-eval' and 'no-new-func' rules with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-implied-eval.md
+      'no-implied-eval': 'off',
+      'no-new-func': 'off',
+      '@typescript-eslint/no-implied-eval':
+        defaultAirBnbRules['no-implied-eval'],
+
+      // Replace Airbnb 'no-loss-of-precision' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-loss-of-precision.md
+      'no-loss-of-precision': 'off',
+      '@typescript-eslint/no-loss-of-precision':
+        defaultAirBnbRules['no-loss-of-precision'],
+
+      // Replace Airbnb 'no-loop-func' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-loop-func.md
+      'no-loop-func': 'off',
+      '@typescript-eslint/no-loop-func': defaultAirBnbRules['no-loop-func'],
+
+      // Replace Airbnb 'no-magic-numbers' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-magic-numbers.md
+      'no-magic-numbers': 'off',
+      '@typescript-eslint/no-magic-numbers':
+        defaultAirBnbRules['no-magic-numbers'],
+
+      // Replace Airbnb 'no-redeclare' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-redeclare.md
+      'no-redeclare': 'off',
+      '@typescript-eslint/no-redeclare': defaultAirBnbRules['no-redeclare'],
+
+      // Replace Airbnb 'no-shadow' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-shadow.md
+      'no-shadow': 'off',
+      '@typescript-eslint/no-shadow': defaultAirBnbRules['no-shadow'],
+
+      // Replace Airbnb 'no-unused-expressions' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-unused-expressions.md
+      'no-unused-expressions': 'off',
+      '@typescript-eslint/no-unused-expressions':
+        defaultAirBnbRules['no-unused-expressions'],
+
+      // Replace Airbnb 'no-unused-vars' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-unused-vars.md
+      'no-unused-vars': 'off',
+      '@typescript-eslint/no-unused-vars': defaultAirBnbRules['no-unused-vars'],
+
+      // Replace Airbnb 'no-use-before-define' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-use-before-define.md
+      'no-use-before-define': 'off',
+      '@typescript-eslint/no-use-before-define':
+        defaultAirBnbRules['no-use-before-define'],
+
+      // Replace Airbnb 'no-useless-constructor' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-useless-constructor.md
+      'no-useless-constructor': 'off',
+      '@typescript-eslint/no-useless-constructor':
+        defaultAirBnbRules['no-useless-constructor'],
+
+      // Replace Airbnb 'quotes' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/quotes.md
+      quotes: 'off',
+      // '@typescript-eslint/quotes': defaultAirBnbRules.quotes,
+
+      // Replace Airbnb 'require-await' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/require-await.md
+      'require-await': 'off',
+      '@typescript-eslint/require-await': defaultAirBnbRules['require-await'],
+
+      // Replace Airbnb 'no-return-await' rule with '@typescript-eslint' version
+      // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/return-await.md
+      'no-return-await': 'off',
+      '@typescript-eslint/return-await': [
+        defaultAirBnbRules['no-return-await'],
+        'in-try-catch',
+      ],
+
+      // Append 'ts' and 'tsx' to Airbnb 'import/extensions' rule
+      // https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/extensions.md
+      'import/extensions': [
+        defaultAirBnbRules['import/extensions'][0],
+        defaultAirBnbRules['import/extensions'][1],
+        {
+          ...defaultAirBnbRules['import/extensions'][2],
+          ts: 'never',
+          tsx: 'never',
+        },
+      ],
+
+      // Append 'ts' and 'tsx' extensions to Airbnb 'import/no-extraneous-dependencies' rule
+      // https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-extraneous-dependencies.md
+      'import/no-extraneous-dependencies': [
+        defaultAirBnbRules['import/no-extraneous-dependencies'][0],
+        {
+          ...defaultAirBnbRules['import/no-extraneous-dependencies'][1],
+          devDependencies: defaultAirBnbRules[
+            'import/no-extraneous-dependencies'
+          ][1].devDependencies.reduce((result, devDep) => {
+            const toAppend = [devDep]
+            const devDepWithTs = devDep.replace(/\bjs(x?)\b/g, 'ts$1')
+            if (devDepWithTs !== devDep) {
+              toAppend.push(devDepWithTs)
+            }
+            return [...result, ...toAppend]
+          }, []),
+        },
+      ],
+    },
+  },
+]

packages/eslint-config-react/index.mjs

@@ -1,5 +1,6 @@
 import emotion from './emotion.mjs'
 import javascript from './javascript.mjs'
 import typescript from './typescript.mjs'
+import stylistic from './stylistic.mjs'
 
-export { emotion, javascript, typescript }
+export { emotion, javascript, stylistic, typescript }

packages/eslint-config-react/package.json

@@ -20,24 +20,27 @@
     "./javascript": "./javascript.mjs",
     "./typescript": "./typescript.mjs",
     "./emotion": "./emotion.mjs",
-    "./shared": "./shared.mjs"
+    "./shared": "./shared.mjs",
+    "./stylistic": "./stylistic.mjs"
   },
   "files": [
+    "airbnb/*",
+    "emotion.mjs",
     "index.mjs",
     "javascript.mjs",
-    "typescript.mjs",
     "shared.mjs",
-    "emotion.mjs"
+    "stylistic.mjs",
+    "typescript.mjs"
   ],
   "license": "MIT",
   "dependencies": {
     "@emotion/eslint-plugin": "11.12.0",
     "@eslint/compat": "1.2.3",
     "@eslint/eslintrc": "3.2.0",
-    "@typescript-eslint/eslint-plugin": "7.18.0",
-    "@typescript-eslint/parser": "7.18.0",
+    "@stylistic/eslint-plugin": "2.11.0",
+    "@typescript-eslint/eslint-plugin": "8.16.0",
+    "@typescript-eslint/parser": "8.16.0",
     "eslint-config-airbnb": "19.0.4",
-    "eslint-config-airbnb-typescript": "18.0.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-deprecation": "3.0.0",
     "eslint-plugin-eslint-comments": "3.2.0",
@@ -47,7 +50,7 @@
     "eslint-plugin-react-hooks": "5.0.0"
   },
   "peerDependencies": {
-    "eslint": ">= 9.7"
+    "eslint": ">= 9.13"
   },
   "devDependencies": {
     "eslint": "9.13.0",

packages/eslint-config-react/shared.mjs

@@ -2,6 +2,7 @@ import { fixupConfigRules } from '@eslint/compat'
 import { FlatCompat } from '@eslint/eslintrc'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
+import stylisticJs from './stylistic.mjs'
 
 const filename = fileURLToPath(import.meta.url)
 const dirname = path.dirname(filename)
@@ -19,9 +20,13 @@ export default [
       'plugin:react/jsx-runtime',
     ),
   ),
+  ...stylisticJs,
   {
     rules: {
       curly: 'error',
+      'no-use-before-define': 'off',
+      'import/extensions': 'off',
+      'dot-notation': 'off',
 
       'import/order': [
         'error',