feat/update eslint

.eslintrc.js → eslint.config.js

@@ -1,8 +1,17 @@
+const react = require('eslint-plugin-react')
+const hooks = require('eslint-plugin-react-hooks')
+const parser = require('@typescript-eslint/parser')
+const tseslint = require('typescript-eslint')
+const stylistic = require('@stylistic/eslint-plugin')
+const importplugin = require('eslint-plugin-import')
+const eslintprettier = require('eslint-plugin-prettier')
+const tseslintplugin = require('@typescript-eslint/eslint-plugin')
+
 const rulesReact = {
     'react/prop-types': 'off',
     'react/display-name': 'off',
     'react/no-unescaped-entities': 'off',
-    
+
     'react/jsx-key': 'warn',
     'react/jsx-pascal-case': 'warn',
     'react/self-closing-comp': 'warn',
@@ -95,11 +104,6 @@ const rulesImport = {
                     group: 'external',
                     position: 'before'
                 },
-                {
-                    pattern: 'react-dom/**',
-                    group: 'external',
-                    position: 'before'
-                },
                 {
                     pattern: '../styles',
                     group: 'index',
@@ -116,7 +120,7 @@ const rulesImport = {
                     position: 'after'
                 }
             ],
-            pathGroupsExcludedImportTypes: ['react', 'react-dom'],
+            pathGroupsExcludedImportTypes: ['react'],
             'newlines-between': 'never',
             alphabetize: {
                 order: 'asc',
@@ -139,7 +143,6 @@ const rulesTypescript = {
     '@typescript-eslint/prefer-optional-chain': 'warn',
     '@typescript-eslint/restrict-plus-operands': 'warn',
     '@typescript-eslint/no-unnecessary-condition': 'warn',
-    '@typescript-eslint/switch-exhaustiveness-check': 'warn',
     '@typescript-eslint/prefer-reduce-type-parameter': 'warn',
     '@typescript-eslint/no-unnecessary-type-constraint': 'warn',
     '@typescript-eslint/no-non-null-asserted-optional-chain': 'warn',
@@ -151,49 +154,55 @@ const rulesTypescript = {
     '@typescript-eslint/consistent-type-imports': 'error'
 }
 
-module.exports = {
-    parser: '@typescript-eslint/parser',
-    parserOptions: {
-        ecmaFeatures: {
-            jsx: true
-        },
-        sourceType: 'module',
-        project: ['./tsconfig.json']
+module.exports = tseslint.config(
+    ...tseslint.configs.recommended,
+    {
+        ignores: [
+            'dist/*',
+            'docs/*',
+            'node_modules/*',
+            'pre-publish.js',
+            'eslint.config.js'
+        ]
     },
-    settings: {
-        react: {
-            version: 'detect'
+    {
+        files: ['src/**/*.{ts,tsx}'],
+        languageOptions: {
+            parser: parser,
+            parserOptions: {
+                ecmaFeatures: {
+                    jsx: true
+                },
+                projectService: true
+            },
+            ecmaVersion: 'latest',
+            sourceType: 'module'
         },
-        'import/parsers': {
-            '@typescript-eslint/parser': ['.ts', '.tsx']
+        settings: {
+            react: {
+                version: 'detect'
+            },
+            'import/parsers': {
+                tsParser: ['.ts', '.tsx']
+            },
+            'import/resolver': {
+                typescript: true
+            }
+        },
+        plugins: {
+            react: react,
+            import: importplugin,
+            prettier: eslintprettier,
+            'react-hooks': hooks,
+            '@stylistic': stylistic,
+            '@typescript-eslint': tseslintplugin
         },
-        'import/resolver': {
-            typescript: true
+        rules: {
+            'prettier/prettier': 'error',
+            ...rulesReact,
+            ...rulesEslint,
+            ...rulesImport,
+            ...rulesTypescript
         }
-    },
-    extends: [
-        'eslint:recommended',
-        'plugin:react/jsx-runtime',
-        'plugin:react-hooks/recommended',
-        'plugin:react/recommended',
-        'plugin:@typescript-eslint/recommended',
-        'plugin:import/recommended',
-        'plugin:import/typescript',
-        'plugin:prettier/recommended',
-        'prettier'
-    ],
-    rules: {
-        'prettier/prettier': 'error',
-        ...rulesReact,
-        ...rulesEslint,
-        ...rulesImport,
-        ...rulesTypescript
-    },
-    plugins: [
-        'react-hooks',
-        '@typescript-eslint',
-        'import',
-        '@stylistic'
-    ],
-    ignorePatterns: ['.eslintrc.js', 'pre-publish.js', 'jest.config.js']
-}
+    }
+)

package.json

@@ -1,6 +1,6 @@
 {
     "name": "flipper-ui",
-    "version": "0.34.9",
+    "version": "0.35.0",
     "description": "React UI based on the @mui/material toolkit for the web",
     "main": "dist/index.js",
     "author": "NG",
@@ -16,16 +16,16 @@
         "build:ts": "tsc --emitDeclarationOnly",
         "build:babel": "babel src --out-dir dist --extensions \".ts,.tsx\" --ignore \"**/*.spec.tsx\" --ignore \"**/*.stories.tsx\"",
         "build:link": "yarn build && yarn copy:package && yarn publish:yalc",
-        "lint": "eslint -c .eslintrc.js 'src/**/*.{ts,tsx}'",
-        "lint:fix": "eslint -c .eslintrc.js --fix 'src/**/*.{ts,tsx}'",
-        "lint:quiet": "eslint --quiet .eslintrc.js 'src/**/*.{ts,tsx}'",
-        "format": "prettier -w 'src/**/*.{ts,tsx}'",
         "docs:build": "storybook build -o docs",
-        "clean": "rm -rf ./dist",
-        "type-check": "tsc --noEmit",
         "copy:package": "cp package.json dist/",
         "publish:yalc": "cd dist/ && yalc publish && cd ..",
         "release": "yarn build && node pre-publish.js && npm publish ./dist --access public",
+        "clean": "rm -rf ./dist",
+        "type-check": "tsc --noEmit",
+        "lint": "eslint .",
+        "lint:fix": "eslint . --fix",
+        "lint:quiet": "eslint . --quiet",
+        "format": "prettier -w 'src/**/*.{ts,tsx}'",
         "test:ci": "yarn test --coverage",
         "test": "jest --verbose --silent --passWithNoTests --noStackTrace --runInBand --updateSnapshot"
     },
@@ -64,12 +64,12 @@
         "@types/ramda": "0.30.2",
         "@types/react": "18.3.12",
         "@types/uuid": "10.0.0",
-        "@typescript-eslint/eslint-plugin": "8.13.0",
-        "@typescript-eslint/parser": "8.13.0",
+        "@typescript-eslint/eslint-plugin": "8.14.0",
+        "@typescript-eslint/parser": "8.14.0",
         "babel-loader": "9.2.1",
         "babel-plugin-import": "1.13.8",
         "babel-plugin-module-resolver": "5.0.2",
-        "eslint": "8.57.0",
+        "eslint": "9.14.0",
         "eslint-config-prettier": "9.1.0",
         "eslint-import-resolver-typescript": "3.6.3",
         "eslint-plugin-import": "2.31.0",
@@ -88,7 +88,8 @@
         "ts-jest": "29.2.5",
         "ts-loader": "9.5.1",
         "typescript": "5.6.3",
-        "uuid": "11.0.2",
+        "typescript-eslint": "8.14.0",
+        "uuid": "11.0.3",
         "webpack": "5.96.1"
     },
     "peerDependencies": {

src/core/data-display/data-table/use-rows-state.ts

@@ -38,8 +38,6 @@ export const useRowsState = <D extends Data, V extends StackView>(
         }
 
         setState({ internal: nextState })
-        // it works fine
-        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [rows, !!newRow])
 
     const setRowState = useCallback(

src/core/feedback/dialog-v2/dialog.stories.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react-hooks/rules-of-hooks */
 import React, { useState } from 'react'
 import type { Meta, StoryObj } from '@storybook/react'
 import Button from '@/core/inputs/button'

src/core/feedback/dialog/dialog.stories.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react-hooks/rules-of-hooks */
 import React, { useState } from 'react'
 import type { Meta, StoryObj } from '@storybook/react'
 import Button from '@/core/inputs/button'