From 4dae959c28f0d82aba6d1a2187480264f14b22b3 Mon Sep 17 00:00:00 2001
From: Stephen Zhou <38493346+hyoban@users.noreply.github.com>
Date: Fri, 17 Apr 2026 22:21:38 +0800
Subject: [PATCH] chore: lint dify ui with react config

---
 eslint-suppressions.json                     | 36 ++++++++++++++++++++
 eslint.config.mjs                            | 21 +++++++-----
 packages/dify-ui/src/toast/index.stories.tsx |  2 +-
 packages/dify-ui/src/toast/index.tsx         |  2 +-
 4 files changed, 51 insertions(+), 10 deletions(-)

diff --git a/eslint-suppressions.json b/eslint-suppressions.json
index fbeb1d6dcf..468b88f2bd 100644
--- a/eslint-suppressions.json
+++ b/eslint-suppressions.json
@@ -1,4 +1,9 @@
 {
+  "e2e/cucumber.config.ts": {
+    "node/prefer-global/process": {
+      "count": 1
+    }
+  },
   "e2e/features/support/hooks.ts": {
     "no-console": {
       "count": 3
@@ -7,16 +12,47 @@
       "count": 1
     }
   },
+  "e2e/fixtures/auth.ts": {
+    "node/prefer-global/process": {
+      "count": 5
+    }
+  },
   "e2e/scripts/common.ts": {
     "node/prefer-global/buffer": {
       "count": 2
+    },
+    "node/prefer-global/process": {
+      "count": 8
+    }
+  },
+  "e2e/scripts/run-cucumber.ts": {
+    "node/prefer-global/process": {
+      "count": 9
+    }
+  },
+  "e2e/scripts/setup.ts": {
+    "node/prefer-global/process": {
+      "count": 4
     }
   },
   "e2e/support/process.ts": {
+    "node/prefer-global/process": {
+      "count": 4
+    },
     "ts/no-use-before-define": {
       "count": 2
     }
   },
+  "e2e/test-env.ts": {
+    "node/prefer-global/process": {
+      "count": 7
+    }
+  },
+  "packages/dify-ui/vite.config.ts": {
+    "node/prefer-global/process": {
+      "count": 1
+    }
+  },
   "packages/migrate-no-unchecked-indexed-access/src/no-unchecked-indexed-access/migrate.ts": {
     "no-console": {
       "count": 11
diff --git a/eslint.config.mjs b/eslint.config.mjs
index ae9fdaff01..69e4352692 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,5 +1,3 @@
-// @ts-check
-
 import antfu, { GLOB_MARKDOWN } from '@antfu/eslint-config'
 import md from 'eslint-markdown'
 import markdownPreferences from 'eslint-plugin-markdown-preferences'
@@ -17,6 +15,13 @@ export default antfu(
       '!vite.config.ts',
       ...original,
     ],
+    react: {
+      files: ['packages/dify-ui/**/*.{ts,tsx}'],
+      overrides: {
+        'react/set-state-in-effect': 'error',
+        'react/no-unnecessary-use-prefix': 'error',
+      },
+    },
     typescript: {
       overrides: {
         'ts/consistent-type-definitions': ['error', 'type'],
@@ -35,7 +40,12 @@ export default antfu(
         'antfu/top-level-function': 'off',
       },
     },
-    e18e: false,
+  },
+  {
+    files: ['packages/dify-ui/**/*.{ts,tsx}'],
+    rules: {
+      'react-refresh/only-export-components': 'off',
+    },
   },
   markdownPreferences.configs.standard,
   {
@@ -57,9 +67,4 @@ export default antfu(
       'markdown-preferences/sort-definitions': 'error',
     },
   },
-  {
-    rules: {
-      'node/prefer-global/process': 'off',
-    },
-  },
 )
diff --git a/packages/dify-ui/src/toast/index.stories.tsx b/packages/dify-ui/src/toast/index.stories.tsx
index cbfb944f19..1fe5ceb84e 100644
--- a/packages/dify-ui/src/toast/index.stories.tsx
+++ b/packages/dify-ui/src/toast/index.stories.tsx
@@ -136,7 +136,7 @@ const StackExamples = () => {
 const PromiseExamples = () => {
   const createPromiseToast = () => {
     const request = new Promise<string>((resolve) => {
-      window.setTimeout(() => resolve('The deployment is now available in production.'), 1400)
+      window.setTimeout(resolve, 1400, 'The deployment is now available in production.')
     })
 
     void toast.promise(request, {
diff --git a/packages/dify-ui/src/toast/index.tsx b/packages/dify-ui/src/toast/index.tsx
index a479621563..426bab36ba 100644
--- a/packages/dify-ui/src/toast/index.tsx
+++ b/packages/dify-ui/src/toast/index.tsx
@@ -81,7 +81,7 @@ type ToastApi = {
 const toastManager = BaseToast.createToastManager<ToastData>()
 
 function isToastType(type: string): type is ToastType {
-  return Object.prototype.hasOwnProperty.call(TOAST_TONE_STYLES, type)
+  return Object.hasOwn(TOAST_TONE_STYLES, type)
 }
 
 function getToastType(type?: string): ToastType | undefined {