update eslint to 9 (#3658)

* aa

* update vite to v5

* aa

* fix tests

* fix

* aa

* aa

* bump changesets

Author: dimaMachina

.eslintrc.js

@@ -54,21 +54,14 @@ module.exports = {
       extends: [
         'eslint:recommended',
         'plugin:@typescript-eslint/recommended',
-        'plugin:import/recommended',
-        'plugin:import/typescript',
+        'plugin:import-x/recommended',
+        'plugin:import-x/typescript',
         'plugin:react/recommended',
         'plugin:react-hooks/recommended',
         'plugin:react/jsx-runtime',
         'prettier',
       ],
-      plugins: [
-        'promise',
-        'sonarjs',
-        'unicorn',
-        '@arthurgeron/react-usememo',
-        'sonar',
-        '@shopify',
-      ],
+      plugins: ['promise', 'sonarjs', 'unicorn', 'sonar', '@shopify'],
       globals: {
         atom: false,
         document: false,
@@ -81,10 +74,6 @@ module.exports = {
         '@shopify/prefer-early-return': ['error', { maximumStatements: 2 }],
         '@shopify/prefer-class-properties': 'off', // enable after https://github.com/Shopify/web-configs/issues/387 will be fixed
         'sonarjs/no-inverted-boolean-check': 'error',
-        '@arthurgeron/react-usememo/require-usememo': [
-          'error',
-          { checkHookCalls: false },
-        ],
         // Possible Errors (http://eslint.org/docs/rules/#possible-errors)
         'no-console': 'error',
         'no-constant-binary-expression': 'error',
@@ -287,9 +276,9 @@ module.exports = {
 
         'sonarjs/no-ignored-return': 'error',
         'unicorn/no-array-push-push': 'error',
-        'import/no-extraneous-dependencies': 'error',
-        'import/no-duplicates': 'error',
-        'import/no-named-as-default': 'error',
+        'import-x/no-extraneous-dependencies': 'error',
+        'import-x/no-duplicates': 'error',
+        'import-x/no-named-as-default': 'error',
         'prefer-object-spread': 'error',
         // React rules
         'react/no-unused-state': 'error',
@@ -342,10 +331,15 @@ module.exports = {
         'sonar/prefer-promise-shorthand': 'error',
         'sonar/no-dead-store': 'error',
         'unicorn/prefer-node-protocol': 'error',
-        'import/no-unresolved': [
+        'import-x/no-unresolved': [
           'error',
           { ignore: ['^node:', '\\.svg\\?react$'] },
         ],
+        'no-extra-boolean-cast': [
+          'error',
+          { enforceForInnerExpressions: true },
+        ],
+        'unicorn/no-length-as-slice-end': 'error',
         'unicorn/prefer-string-replace-all': 'error',
         'unicorn/no-hex-escape': 'off', // TODO: enable
         // doesn't catch a lot of cases; we use ESLint builtin `no-restricted-syntax` to forbid `.keyCode`
@@ -409,7 +403,6 @@ module.exports = {
       rules: {
         'jest/no-conditional-expect': 'off',
         'jest/expect-expect': ['error', { assertFunctionNames: ['expect*'] }],
-        '@arthurgeron/react-usememo/require-usememo': 'off',
       },
     },
     {
@@ -426,14 +419,14 @@ module.exports = {
         'no-console': 'off',
         'no-new': 'off',
         'no-alert': 'off',
-        'import/no-unresolved': 'off',
+        'import-x/no-unresolved': 'off',
       },
     },
     {
       // Rule for ignoring imported dependencies from tests files
       files: ['**/__tests__/**', 'webpack.config.js', '**/tests/**'],
       rules: {
-        'import/no-extraneous-dependencies': 'off',
+        'import-x/no-extraneous-dependencies': 'off',
       },
     },
     {
@@ -443,7 +436,7 @@ module.exports = {
         'packages/vscode-graphql-execution/**',
       ],
       rules: {
-        'import/no-unresolved': ['error', { ignore: ['^node:', 'vscode'] }],
+        'import-x/no-unresolved': ['error', { ignore: ['^node:', 'vscode'] }],
       },
     },
     {
@@ -484,14 +477,13 @@ module.exports = {
       // Rules for codeblocks inside Markdown/MDX
       files: ['**/*.{md,mdx}/*.{js,jsx,ts,tsx}'],
       rules: {
-        'import/no-extraneous-dependencies': 'off',
+        'import-x/no-extraneous-dependencies': 'off',
         '@typescript-eslint/no-unused-vars': 'off',
-        'import/no-unresolved': 'off',
+        'import-x/no-unresolved': 'off',
         'no-console': 'off',
         'no-undef': 'off',
         'react/jsx-no-undef': 'off',
         'react-hooks/rules-of-hooks': 'off',
-        '@arthurgeron/react-usememo/require-usememo': 'off',
         'sonar/no-dead-store': 'off',
         '@typescript-eslint/no-restricted-imports': 'off',
       },

examples/graphiql-webpack/src/index.jsx

@@ -84,7 +84,6 @@ const App = () => {
   return (
     <GraphiQL
       style={style}
-      // eslint-disable-next-line @arthurgeron/react-usememo/require-usememo
       plugins={[serverSelect, explorer, exporter]}
       fetcher={fetcher}
       shouldPersistHeaders

package.json

@@ -48,7 +48,7 @@
     "dev-graphiql": "yarn workspace graphiql dev",
     "e2e": "yarn run e2e:build && yarn workspace graphiql e2e",
     "e2e:build": "WEBPACK_SERVE=1 yarn workspace graphiql build-bundles",
-    "eslint": "NODE_OPTIONS=--max-old-space-size=4096 eslint --max-warnings=0 --ignore-path .gitignore --cache .",
+    "eslint": "NODE_OPTIONS=--max-old-space-size=4096 ESLINT_USE_FLAT_CONFIG=false eslint --max-warnings=0 --ignore-path .gitignore --cache .",
     "format": "yarn eslint --fix && yarn pretty",
     "jest": "jest",
     "license-check": "jsgl --local packages/*",
@@ -78,7 +78,6 @@
     "gen-agenda": "wgutils agenda gen"
   },
   "dependencies": {
-    "@arthurgeron/eslint-plugin-react-usememo": "^2.4.0",
     "@babel/cli": "^7.21.0",
     "@babel/core": "^7.21.0",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
@@ -90,8 +89,8 @@
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.0",
     "@babel/register": "^7.21.0",
-    "@changesets/changelog-github": "0.4.7",
-    "@changesets/cli": "2.25.2",
+    "@changesets/changelog-github": "0.5.0",
+    "@changesets/cli": "2.27.7",
     "@manypkg/get-packages": "^1.1.3",
     "@shopify/eslint-plugin": "^45.0.0",
     "@strictsoftware/typedoc-plugin-monorepo": "^0.3.1",
@@ -102,25 +101,25 @@
     "@types/jest": "^29.5.2",
     "@types/node": "^16.18.4",
     "@types/ws": "8.2.2",
-    "@typescript-eslint/eslint-plugin": "^7.14.1",
-    "@typescript-eslint/parser": "^7.14.1",
+    "@typescript-eslint/eslint-plugin": "^7.17.0",
+    "@typescript-eslint/parser": "^7.17.0",
     "babel-jest": "^29.4.3",
     "concurrently": "^7.0.0",
     "copy": "^0.3.2",
     "cspell": "^5.15.2",
-    "eslint": "^8.57.0",
+    "eslint": "^9.7.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-import-resolver-typescript": "^3.6.1",
-    "eslint-plugin-cypress": "^3.3.0",
-    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-cypress": "^3.4.0",
+    "eslint-plugin-import-x": "^3.1.0",
     "eslint-plugin-jest": "^28.6.0",
     "eslint-plugin-mdx": "^3.1.5",
-    "eslint-plugin-promise": "^6.4.0",
-    "eslint-plugin-react": "^7.34.3",
-    "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-promise": "^7.0.0",
+    "eslint-plugin-react": "^7.35.0",
+    "eslint-plugin-react-hooks": "^5.1.0-rc-76002254-20240724",
     "eslint-plugin-sonar": "^0.14.1",
-    "eslint-plugin-sonarjs": "^1.0.3",
-    "eslint-plugin-unicorn": "^54.0.0",
+    "eslint-plugin-sonarjs": "^1.0.4",
+    "eslint-plugin-unicorn": "^55.0.0",
     "execa": "^7.1.1",
     "fetch-mock": "6.5.2",
     "husky": "^4.2.3",

packages/graphiql-plugin-explorer/src/index.tsx

@@ -34,7 +34,6 @@ const colors = {
   atom: 'hsl(var(--color-tertiary))',
 };
 
-/* eslint-disable @arthurgeron/react-usememo/require-usememo */
 const arrowOpen = (
   <ArrowIcon style={{ width: 'var(--px-16)', transform: 'rotate(90deg)' }} />
 );
@@ -47,7 +46,6 @@ const checkboxChecked = (
     style={{ fill: 'hsl(var(--color-info))', marginRight: 'var(--px-4)' }}
   />
 );
-/* eslint-enable @arthurgeron/react-usememo/require-usememo */
 
 const styles: Record<string, CSSProperties> = {
   buttonStyle: {

packages/graphiql/test/afterDevServer.js

@@ -1,4 +1,4 @@
-// eslint-disable-next-line import/no-extraneous-dependencies
+// eslint-disable-next-line import-x/no-extraneous-dependencies
 const { useServer } = require('graphql-ws/lib/use/ws');
 const { Server: WebSocketServer } = require('ws');
 const schema = require('./schema');

packages/graphql-language-service-server/src/parsers/babel.ts

@@ -3,7 +3,7 @@ import { BABEL_PLUGINS, PARSER_OPTIONS } from '../constants';
 import { SourceParser } from './types';
 
 export const babelParser = (text: string, plugins?: ParserPlugin[]) => {
-  const babelPlugins = BABEL_PLUGINS.slice(0, BABEL_PLUGINS.length);
+  const babelPlugins = [...BABEL_PLUGINS];
   if (plugins) {
     babelPlugins.push(...plugins);
   }

packages/monaco-graphql/src/GraphQLWorker.ts

@@ -135,7 +135,7 @@ export class GraphQLWorker {
       return null;
     }
     const prettierStandalone = await import('prettier/standalone');
-    // eslint-disable-next-line import/no-unresolved -- should be fixed by pnpm migration (points to @types/prettier rather owns prettier types)
+    // eslint-disable-next-line import-x/no-unresolved -- should be fixed by pnpm migration (points to @types/prettier rather owns prettier types)
     const prettierGraphqlParser = await import('prettier/parser-graphql');
 
     return prettierStandalone.format(document, {

packages/monaco-graphql/vitest.config.mts

@@ -1,4 +1,4 @@
-// eslint-disable-next-line import/no-unresolved -- todo: try to fix better rather ignoring here?
+// eslint-disable-next-line import-x/no-unresolved -- todo: try to fix better rather ignoring here?
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({

packages/vscode-graphql-execution/src/helpers/network.ts

@@ -3,7 +3,7 @@ import { gql } from 'graphql-tag';
 import { fetch } from '@whatwg-node/fetch';
 import { Agent } from 'node:https';
 import * as ws from 'ws';
-// eslint-disable-next-line import/no-extraneous-dependencies
+// eslint-disable-next-line import-x/no-extraneous-dependencies
 import { pipe, subscribe } from 'wonka';
 
 import { Endpoint } from './extensions';

packages/vscode-graphql-syntax/vitest.config.mts

@@ -1,4 +1,4 @@
-// eslint-disable-next-line import/no-unresolved -- fix later
+// eslint-disable-next-line import-x/no-unresolved -- fix later
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({