fix: eslint run failed

web/.eslintignore

@@ -1,7 +0,0 @@
-/**/node_modules/*
-node_modules/
-
-dist/
-build/
-out/
-.next/

web/.eslintrc.json

@@ -1,31 +0,0 @@
-{
-  "extends": [
-    "next",
-    "@antfu",
-    "plugin:storybook/recommended"
-  ],
-  "rules": {
-    "@typescript-eslint/consistent-type-definitions": [
-      "error",
-      "type"
-    ],
-    "@typescript-eslint/no-var-requires": "off",
-    "no-console": "off",
-    "indent": "off",
-    "@typescript-eslint/indent": [
-      "error",
-      2,
-      {
-        "SwitchCase": 1,
-        "flatTernaryExpressions": false,
-        "ignoredNodes": [
-          "PropertyDefinition[decorators]",
-          "TSUnionType",
-          "FunctionExpression[params]:has(Identifier[decorators])"
-        ]
-      }
-    ],
-    "react-hooks/exhaustive-deps": "warn",
-    "react/display-name": "warn"
-  }
-}

web/eslint.config.mjs

@@ -0,0 +1,204 @@
+import {
+  GLOB_TESTS, combine, javascript, node,
+  stylistic, typescript, unicorn,
+} from '@antfu/eslint-config'
+import globals from 'globals'
+import storybook from 'eslint-plugin-storybook'
+// import { fixupConfigRules } from '@eslint/compat'
+import tailwind from 'eslint-plugin-tailwindcss'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+
+export default combine(
+  stylistic({
+    lessOpinionated: true,
+    // original @antfu/eslint-config does not support jsx
+    jsx: false,
+    semi: false,
+    quotes: 'single',
+    overrides: {
+      // original config
+      'style/indent': ['error', 2],
+      'style/quotes': ['error', 'single'],
+      'curly': ['error', 'multi-or-nest', 'consistent'],
+      'style/comma-spacing': ['error', { before: false, after: true }],
+      'style/quote-props': ['warn', 'consistent-as-needed'],
+
+      // these options does not exist in old version
+      // maybe useless
+      'style/indent-binary-ops': 'off',
+      'style/multiline-ternary': 'off',
+      'antfu/top-level-function': 'off',
+      'antfu/curly': 'off',
+      'antfu/consistent-chaining': 'off',
+
+      // copy from eslint-config-antfu 0.36.0
+      'style/brace-style': ['error', 'stroustrup', { allowSingleLine: true }],
+      'style/dot-location': ['error', 'property'],
+      'style/object-curly-newline': ['error', { consistent: true, multiline: true }],
+      'style/object-property-newline': ['error', { allowMultiplePropertiesPerLine: true }],
+      'style/template-curly-spacing': ['error', 'never'],
+      'style/keyword-spacing': 'off',
+
+      // not exist in old version, and big change
+      'style/member-delimiter-style': 'off',
+    },
+  }),
+  javascript({
+    overrides: {
+      // handled by unused-imports/no-unused-vars
+      'no-unused-vars': 'off',
+    },
+  }),
+  typescript({
+    overrides: {
+      // original config
+      'ts/consistent-type-definitions': ['warn', 'type'],
+
+      // useful, but big change
+      'ts/no-empty-object-type': 'off',
+    },
+  }),
+  unicorn(),
+  node(),
+  // use nextjs config will break @eslint/config-inspector
+  // use `ESLINT_CONFIG_INSPECTOR=true pnpx @eslint/config-inspector` to check the config
+  // ...process.env.ESLINT_CONFIG_INSPECTOR
+  //   ? []
+  // TODO: remove this when upgrade to nextjs 15
+  // : fixupConfigRules(compat.extends('next')),
+  {
+    rules: {
+      // performance issue, and not used.
+      '@next/next/no-html-link-for-pages': 'off',
+    },
+  },
+  {
+    ignores: [
+      '**/node_modules/*',
+      '**/dist/',
+      '**/build/',
+      '**/out/',
+      '**/.next/',
+      '**/public/*',
+      '**/*.json',
+    ],
+  },
+  {
+    // orignal config
+    rules: {
+      // orignal ts/no-var-requires
+      'ts/no-require-imports': 'off',
+      'no-console': 'off',
+      'react-hooks/exhaustive-deps': 'warn',
+      'react/display-name': 'off',
+      'array-callback-return': ['error', {
+        allowImplicit: false,
+        checkForEach: false,
+      }],
+
+      // copy from eslint-config-antfu 0.36.0
+      'camelcase': 'off',
+      'default-case-last': 'error',
+
+      // antfu use eslint-plugin-perfectionist to replace this
+      // will cause big change, so keep the original sort-imports
+      'sort-imports': [
+        'error',
+        {
+          ignoreCase: false,
+          ignoreDeclarationSort: true,
+          ignoreMemberSort: false,
+          memberSyntaxSortOrder: ['none', 'all', 'multiple', 'single'],
+          allowSeparatedGroups: false,
+        },
+      ],
+
+      // antfu migrate to eslint-plugin-unused-imports
+      'unused-imports/no-unused-vars': 'warn',
+      'unused-imports/no-unused-imports': 'warn',
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.es2025,
+        ...globals.node,
+        React: 'readable',
+        JSX: 'readable',
+      },
+    },
+  },
+  storybook.configs['flat/recommended'],
+  reactRefresh.configs.recommended,
+  {
+    rules: reactHooks.configs.recommended.rules,
+    plugins: {
+      'react-hooks': reactHooks,
+    },
+  },
+  // need futher research
+  {
+    rules: {
+      // not exist in old version
+      'antfu/consistent-list-newline': 'off',
+      'node/prefer-global/process': 'off',
+      'node/prefer-global/buffer': 'off',
+      'node/no-callback-literal': 'off',
+
+      // useful, but big change
+      'unicorn/prefer-number-properties': 'warn',
+      'unicorn/no-new-array': 'warn',
+    },
+  },
+  // suppress error for `no-undef` rule
+  {
+    files: GLOB_TESTS,
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.es2021,
+        ...globals.node,
+        ...globals.jest,
+      },
+    },
+  },
+  tailwind.configs['flat/recommended'],
+  {
+    settings: {
+      tailwindcss: {
+        // These are the default values but feel free to customize
+        callees: ['classnames', 'clsx', 'ctl', 'cn'],
+        config: 'tailwind.config.js', // returned from `loadConfig()` utility if not provided
+        cssFiles: [
+          '**/*.css',
+          '!**/node_modules',
+          '!**/.*',
+          '!**/dist',
+          '!**/build',
+          '!**/.storybook',
+          '!**/.next',
+          '!**/.public',
+        ],
+        cssFilesRefreshRate: 5_000,
+        removeDuplicates: true,
+        skipClassAttribute: false,
+        whitelist: [],
+        tags: [], // can be set to e.g. ['tw'] for use in tw`bg-blue`
+        classRegex: '^class(Name)?$', // can be modified to support custom attributes. E.g. "^tw$" for `twin.macro`
+      },
+    },
+    rules: {
+      // due to 1k lines of tailwind config, these rule have performance issue
+      'tailwindcss/no-contradicting-classname': 'off',
+      'tailwindcss/enforces-shorthand': 'off',
+      'tailwindcss/no-custom-classname': 'off',
+      'tailwindcss/no-unnecessary-arbitrary-value': 'off',
+
+      'tailwindcss/classnames-order': 'warn',
+      'tailwindcss/enforces-negative-arbitrary-values': 'warn',
+      'tailwindcss/no-arbitrary-value': 'warn',
+      'tailwindcss/migration-from-tailwind-2': 'warn',
+    },
+  },
+)

web/package.json

@@ -115,8 +115,9 @@
     "zustand": "^4.5.2"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.36.0",
+    "@antfu/eslint-config": "^4.1.1",
     "@chromatic-com/storybook": "^1.9.0",
+    "@eslint/js": "^9.20.0",
     "@faker-js/faker": "^7.6.0",
     "@rgrove/parse-xml": "^4.1.0",
     "@storybook/addon-essentials": "^8.3.5",
@@ -152,9 +153,11 @@
     "bing-translate-api": "^4.0.2",
     "code-inspector-plugin": "^0.18.1",
     "cross-env": "^7.0.3",
-    "eslint": "^8.36.0",
-    "eslint-config-next": "^14.0.4",
-    "eslint-plugin-storybook": "^0.9.0",
+    "eslint": "^9.20.1",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-refresh": "^0.4.19",
+    "eslint-plugin-storybook": "^0.11.2",
+    "eslint-plugin-tailwindcss": "^3.18.0",
     "husky": "^8.0.3",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
@@ -166,6 +169,7 @@
     "tailwindcss": "^3.4.4",
     "ts-node": "^10.9.2",
     "typescript": "4.9.5",
+    "typescript-eslint": "^8.23.0",
     "uglify-js": "^3.17.4"
   },
   "resolutions": {
@@ -181,4 +185,4 @@
       "eslint --fix"
     ]
   }
-}
+}