From d0d553ba380064d9c84e8ba0f3d300292a5312fa Mon Sep 17 00:00:00 2001
From: zhsama <torvalds@linux.do>
Date: Fri, 30 Jan 2026 22:55:13 +0800
Subject: [PATCH] refactor: Refactor context generate modal storage key
 management

---
 .../components/chat-view.tsx                  |  11 +-
 .../components/left-panel.tsx                 |   6 +-
 .../components/right-panel.tsx                |  15 +-
 .../hooks/use-context-gen-data.ts             |  21 +-
 .../hooks/use-context-generate.ts             |  17 +-
 .../context-generate-modal/index.tsx          |   4 +-
 .../context-generate-modal/types.ts           |   4 +
 .../context-generate-modal/utils/storage.ts   |  29 +-
 web/eslint-suppressions.json                  | 334 +++++++++++++++++-
 web/hooks/use-pay.tsx                         |   4 +
 10 files changed, 400 insertions(+), 45 deletions(-)
 create mode 100644 web/app/components/workflow/nodes/tool/components/context-generate-modal/types.ts

diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/chat-view.tsx b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/chat-view.tsx
index fb2b737af3..8e4a957a83 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/chat-view.tsx
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/chat-view.tsx
@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react'
 import type { ContextGenerateChatMessage } from '../hooks/use-context-generate'
+import type { VersionOption } from '../types'
 import type { FormValue } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import type { TriggerProps } from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger'
 import type { Model } from '@/types/app'
@@ -12,11 +13,6 @@ import { CodeAssistant } from '@/app/components/base/icons/src/vender/line/gener
 import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal'
 import { cn } from '@/utils/classnames'
 
-type VersionOption = {
-  index: number
-  label: string
-}
-
 type ChatViewProps = {
   promptMessages: ContextGenerateChatMessage[]
   versionOptions: VersionOption[]
@@ -81,9 +77,10 @@ const ChatView = ({
             const versionMeta = assistantVersionMap[index]
             const isSelected = versionMeta?.index === currentVersionIndex
             const assistantContent = message.content || defaultAssistantMessage
+            const messageKey = message.id || `${message.role}-${index}`
             return (
               <div
-                key={`${message.role}-${index}`}
+                key={messageKey}
                 className={cn('flex w-full', message.role === 'user' ? 'justify-end' : 'justify-start')}
               >
                 {message.role === 'user'
@@ -164,7 +161,7 @@ const ChatView = ({
             <Button
               variant="primary"
               size="small"
-              className="!h-8 !w-8 shrink-0 !rounded-lg !px-0"
+              className="ml-auto !h-8 !w-8 shrink-0 !rounded-lg !px-0"
               disabled={!inputValue.trim() || isGenerating}
               onClick={onGenerate}
             >
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/left-panel.tsx b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/left-panel.tsx
index 36de4096bc..95457633dd 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/left-panel.tsx
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/left-panel.tsx
@@ -1,4 +1,5 @@
 import type { ContextGenerateChatMessage } from '../hooks/use-context-generate'
+import type { VersionOption } from '../types'
 import type { FormValue } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import type { TriggerProps } from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal/trigger'
 import type { Model } from '@/types/app'
@@ -14,11 +15,6 @@ import { renderI18nObject } from '@/i18n-config'
 import { cn } from '@/utils/classnames'
 import ChatView from './chat-view'
 
-type VersionOption = {
-  index: number
-  label: string
-}
-
 type LeftPanelProps = {
   isInitView: boolean
   isGenerating: boolean
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/right-panel.tsx b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/right-panel.tsx
index 59a562fec1..4b11cb9cad 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/right-panel.tsx
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/components/right-panel.tsx
@@ -1,4 +1,5 @@
 import type { PointerEvent, RefObject } from 'react'
+import type { VersionOption } from '../types'
 import type { ContextGenerateResponse } from '@/service/debug'
 import { RiArrowDownSLine, RiCheckLine, RiCloseLine, RiPlayLargeLine } from '@remixicon/react'
 import { useCallback, useMemo, useState } from 'react'
@@ -13,11 +14,6 @@ import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
 import { cn } from '@/utils/classnames'
 
-type VersionOption = {
-  index: number
-  label: string
-}
-
 type DisplayOutputData = {
   variables: ContextGenerateResponse['variables']
   outputs: ContextGenerateResponse['outputs']
@@ -83,9 +79,12 @@ const RightPanel = ({
       setVersionMenuOpen(value => !value)
   }, [versionOptions.length])
 
-  const codeLanguageLabel = displayCodeLanguage === CodeLanguage.javascript
-    ? t('nodes.tool.contextGenerate.codeLanguage.javascript', { ns: 'workflow' })
-    : t('nodes.tool.contextGenerate.codeLanguage.python3', { ns: 'workflow' })
+  const codeLanguageLabel = useMemo(() => {
+    return t(`nodes.tool.contextGenerate.codeLanguage.${displayCodeLanguage}`, {
+      ns: 'workflow',
+      defaultValue: displayCodeLanguage,
+    })
+  }, [displayCodeLanguage, t])
 
   const emptyPanelClassName = cn(
     'flex h-full flex-col',
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-gen-data.ts b/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-gen-data.ts
index faa4dec83c..3daf10b55f 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-gen-data.ts
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-gen-data.ts
@@ -1,21 +1,26 @@
 import type { ContextGenerateResponse } from '@/service/debug'
 import { useSessionStorageState } from 'ahooks'
 import { useCallback } from 'react'
+import { CONTEXT_GEN_STORAGE_SUFFIX, getContextGenStorageKey } from '../utils/storage'
 
 type Params = {
   storageKey: string
 }
 
-const keyPrefix = 'context-gen-'
-
 const useContextGenData = ({ storageKey }: Params) => {
-  const [versions, setVersions] = useSessionStorageState<ContextGenerateResponse[]>(`${keyPrefix}${storageKey}-versions`, {
-    defaultValue: [],
-  })
+  const [versions, setVersions] = useSessionStorageState<ContextGenerateResponse[]>(
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.versions),
+    {
+      defaultValue: [],
+    },
+  )
 
-  const [currentVersionIndex, setCurrentVersionIndex] = useSessionStorageState<number>(`${keyPrefix}${storageKey}-version-index`, {
-    defaultValue: 0,
-  })
+  const [currentVersionIndex, setCurrentVersionIndex] = useSessionStorageState<number>(
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.versionIndex),
+    {
+      defaultValue: 0,
+    },
+  )
 
   const current = versions?.[currentVersionIndex || 0]
 
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-generate.ts b/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-generate.ts
index d9519eaa1c..94a612457f 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-generate.ts
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/hooks/use-context-generate.ts
@@ -1,3 +1,4 @@
+import type { VersionOption } from '../types'
 import type { FormValue } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import type { ToolParameter } from '@/app/components/tools/types'
 import type { CodeNodeType } from '@/app/components/workflow/nodes/code/types'
@@ -25,9 +26,11 @@ import { useGetLanguage } from '@/context/i18n'
 import { languages } from '@/i18n-config/language'
 import { fetchContextGenerateSuggestedQuestions, generateContext } from '@/service/debug'
 import { AppModeEnum } from '@/types/app'
+import { CONTEXT_GEN_STORAGE_SUFFIX, getContextGenStorageKey } from '../utils/storage'
 import useContextGenData from './use-context-gen-data'
 
 export type ContextGenerateChatMessage = ContextGenerateMessage & {
+  id?: string
   durationMs?: number
 }
 
@@ -39,6 +42,10 @@ export const normalizeCodeLanguage = (value?: string) => {
   return CodeLanguage.python3
 }
 
+const createChatMessageId = () => {
+  return `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`
+}
+
 const buildValueSelector = (nodeId: string, variable: Var): ValueSelector => {
   if (!nodeId)
     return variable.variable.split('.')
@@ -128,11 +135,6 @@ type UseContextGenerateOptions = {
   availableNodes?: Node[]
 }
 
-type VersionOption = {
-  index: number
-  label: string
-}
-
 type UseContextGenerateResult = {
   versions: ContextGenerateResponse[]
   current: ContextGenerateResponse | undefined
@@ -180,7 +182,7 @@ const useContextGenerate = ({
   })
 
   const [promptMessages, setPromptMessages] = useSessionStorageState<ContextGenerateChatMessage[]>(
-    `${storageKey}-messages`,
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.messages),
     { defaultValue: [] },
   )
 
@@ -449,7 +451,7 @@ const useContextGenerate = ({
     if (!toolNodeId || !paramKey)
       return
 
-    const userMessage: ContextGenerateChatMessage = { role: 'user', content: trimmed }
+    const userMessage: ContextGenerateChatMessage = { role: 'user', content: trimmed, id: createChatMessageId() }
     const nextMessages: ContextGenerateChatMessage[] = [...(promptMessages ?? []), userMessage]
     setPromptMessages(nextMessages)
     setInputValue('')
@@ -485,6 +487,7 @@ const useContextGenerate = ({
         role: 'assistant',
         content: assistantMessage,
         durationMs,
+        id: createChatMessageId(),
       }
       setPromptMessages([...nextMessages, assistantEntry])
       addVersion(response)
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/index.tsx b/web/app/components/workflow/nodes/tool/components/context-generate-modal/index.tsx
index d09d1ad131..5bba6184a3 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/index.tsx
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/index.tsx
@@ -14,6 +14,7 @@ import LeftPanel from './components/left-panel'
 import RightPanel from './components/right-panel'
 import useContextGenerate, { normalizeCodeLanguage } from './hooks/use-context-generate'
 import useResizablePanels from './hooks/use-resizable-panels'
+import { buildContextGenStorageKey } from './utils/storage'
 
 type Props = {
   isShow: boolean
@@ -69,8 +70,7 @@ const ContextGenerateModal = forwardRef<ContextGenerateModalHandle, Props>(({
 
   const flowId = configsMap?.flowId || ''
   const storageKey = useMemo(() => {
-    const segments = [flowId || 'unknown', toolNodeId, paramKey].filter(Boolean)
-    return segments.join('-')
+    return buildContextGenStorageKey(flowId, toolNodeId, paramKey)
   }, [flowId, paramKey, toolNodeId])
 
   const codeNode = useMemo(() => {
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/types.ts b/web/app/components/workflow/nodes/tool/components/context-generate-modal/types.ts
new file mode 100644
index 0000000000..45646133d3
--- /dev/null
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/types.ts
@@ -0,0 +1,4 @@
+export type VersionOption = {
+  index: number
+  label: string
+}
diff --git a/web/app/components/workflow/nodes/tool/components/context-generate-modal/utils/storage.ts b/web/app/components/workflow/nodes/tool/components/context-generate-modal/utils/storage.ts
index 270a9519e3..4dd2d6ca18 100644
--- a/web/app/components/workflow/nodes/tool/components/context-generate-modal/utils/storage.ts
+++ b/web/app/components/workflow/nodes/tool/components/context-generate-modal/utils/storage.ts
@@ -1,9 +1,18 @@
 // Storage key prefix used by useContextGenData
 const CONTEXT_GEN_PREFIX = 'context-gen-'
 
+export const CONTEXT_GEN_STORAGE_SUFFIX = {
+  versions: 'versions',
+  versionIndex: 'version-index',
+  messages: 'messages',
+  suggestedQuestions: 'suggested-questions',
+  suggestedQuestionsFetched: 'suggested-questions-fetched',
+} as const
+
+export type ContextGenStorageSuffix = typeof CONTEXT_GEN_STORAGE_SUFFIX[keyof typeof CONTEXT_GEN_STORAGE_SUFFIX]
+
 /**
  * Build storage key from flowId, toolNodeId, and paramKey.
- * Mirrors the logic in context-generate-modal/index.tsx.
  */
 export const buildContextGenStorageKey = (
   flowId: string | undefined,
@@ -14,13 +23,21 @@ export const buildContextGenStorageKey = (
   return segments.join('-')
 }
 
+const buildContextGenStorageKeyWithPrefix = (storageKey: string, suffix: ContextGenStorageSuffix): string => {
+  return `${CONTEXT_GEN_PREFIX}${storageKey}-${suffix}`
+}
+
+export const getContextGenStorageKey = (storageKey: string, suffix: ContextGenStorageSuffix): string => {
+  return buildContextGenStorageKeyWithPrefix(storageKey, suffix)
+}
+
 export const getContextGenStorageKeys = (storageKey: string): string[] => {
   return [
-    `${CONTEXT_GEN_PREFIX}${storageKey}-versions`,
-    `${CONTEXT_GEN_PREFIX}${storageKey}-version-index`,
-    `${storageKey}-messages`,
-    `${storageKey}-suggested-questions`,
-    `${storageKey}-suggested-questions-fetched`,
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.versions),
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.versionIndex),
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.messages),
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.suggestedQuestions),
+    getContextGenStorageKey(storageKey, CONTEXT_GEN_STORAGE_SUFFIX.suggestedQuestionsFetched),
   ]
 }
 
diff --git a/web/eslint-suppressions.json b/web/eslint-suppressions.json
index 0e4f2ca3d2..b629990f06 100644
--- a/web/eslint-suppressions.json
+++ b/web/eslint-suppressions.json
@@ -177,6 +177,11 @@
       "count": 1
     }
   },
+  "app/components/app/annotation/add-annotation-modal/edit-item/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/app/annotation/batch-add-annotation-modal/csv-downloader.spec.tsx": {
     "ts/no-explicit-any": {
       "count": 2
@@ -186,6 +191,9 @@
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
     },
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 2
     }
@@ -193,6 +201,9 @@
   "app/components/app/annotation/edit-annotation-modal/edit-item/index.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
+    },
+    "react-refresh/only-export-components": {
+      "count": 1
     }
   },
   "app/components/app/annotation/edit-annotation-modal/index.spec.tsx": {
@@ -249,6 +260,11 @@
       "count": 3
     }
   },
+  "app/components/app/configuration/base/var-highlight/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/app/configuration/config-prompt/advanced-prompt-input.tsx": {
     "ts/no-explicit-any": {
       "count": 2
@@ -419,6 +435,11 @@
       "count": 6
     }
   },
+  "app/components/app/configuration/debug/debug-with-multiple-model/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/app/configuration/debug/debug-with-multiple-model/index.spec.tsx": {
     "ts/no-explicit-any": {
       "count": 5
@@ -501,6 +522,11 @@
       "count": 1
     }
   },
+  "app/components/app/create-app-dialog/app-list/sidebar.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/app/create-app-modal/index.spec.tsx": {
     "ts/no-explicit-any": {
       "count": 7
@@ -517,6 +543,14 @@
   "app/components/app/create-from-dsl-modal/index.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 2
+    },
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/app/log/filter.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
     }
   },
   "app/components/app/log/index.tsx": {
@@ -585,6 +619,9 @@
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 3
     },
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 3
     }
@@ -594,6 +631,11 @@
       "count": 2
     }
   },
+  "app/components/app/workflow-log/filter.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/app/workflow-log/list.spec.tsx": {
     "ts/no-explicit-any": {
       "count": 1
@@ -645,6 +687,11 @@
       "count": 1
     }
   },
+  "app/components/base/action-button/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/agent-log-modal/detail.tsx": {
     "ts/no-explicit-any": {
       "count": 1
@@ -673,6 +720,11 @@
       "count": 2
     }
   },
+  "app/components/base/amplitude/AmplitudeProvider.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/amplitude/utils.ts": {
     "ts/no-explicit-any": {
       "count": 2
@@ -721,6 +773,9 @@
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
     },
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "react/no-nested-component-definitions": {
       "count": 1
     }
@@ -730,11 +785,21 @@
       "count": 1
     }
   },
+  "app/components/base/button/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/button/sync-button.stories.tsx": {
     "no-console": {
       "count": 1
     }
   },
+  "app/components/base/carousel/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/chat/chat-with-history/chat-wrapper.tsx": {
     "ts/no-explicit-any": {
       "count": 6
@@ -814,6 +879,11 @@
       "count": 1
     }
   },
+  "app/components/base/chat/chat/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/chat/chat/hooks.ts": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 2
@@ -917,10 +987,18 @@
     }
   },
   "app/components/base/error-boundary/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    },
     "ts/no-explicit-any": {
       "count": 2
     }
   },
+  "app/components/base/features/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/features/new-feature-panel/annotation-reply/index.tsx": {
     "ts/no-explicit-any": {
       "count": 3
@@ -986,6 +1064,11 @@
       "count": 3
     }
   },
+  "app/components/base/file-uploader/store.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 4
+    }
+  },
   "app/components/base/file-uploader/utils.spec.ts": {
     "test/no-identical-title": {
       "count": 1
@@ -1082,6 +1165,11 @@
       "count": 2
     }
   },
+  "app/components/base/ga/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/icons/utils.ts": {
     "ts/no-explicit-any": {
       "count": 3
@@ -1133,6 +1221,16 @@
       "count": 1
     }
   },
+  "app/components/base/input/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/base/logo/dify-logo.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    }
+  },
   "app/components/base/markdown-blocks/audio-block.tsx": {
     "ts/no-explicit-any": {
       "count": 5
@@ -1283,6 +1381,11 @@
       "count": 1
     }
   },
+  "app/components/base/node-status/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/base/notion-connector/index.stories.tsx": {
     "no-console": {
       "count": 1
@@ -1314,6 +1417,9 @@
     }
   },
   "app/components/base/portal-to-follow-elem/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -1480,6 +1586,16 @@
       "count": 1
     }
   },
+  "app/components/base/textarea/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/base/toast/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    }
+  },
   "app/components/base/video-gallery/VideoPlayer.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
@@ -1523,6 +1639,16 @@
       "count": 2
     }
   },
+  "app/components/billing/pricing/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/billing/pricing/plan-switcher/plan-range-switcher.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/billing/pricing/plans/cloud-plan-item/index.spec.tsx": {
     "test/prefer-hooks-in-order": {
       "count": 1
@@ -1573,6 +1699,11 @@
       "count": 3
     }
   },
+  "app/components/datasets/common/image-uploader/store.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 4
+    }
+  },
   "app/components/datasets/common/image-uploader/utils.ts": {
     "ts/no-explicit-any": {
       "count": 2
@@ -1583,6 +1714,16 @@
       "count": 1
     }
   },
+  "app/components/datasets/common/retrieval-method-info/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/datasets/create-from-pipeline/create-options/create-from-dsl-modal/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/datasets/create/file-preview/index.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
@@ -1613,6 +1754,11 @@
       "count": 3
     }
   },
+  "app/components/datasets/create/step-two/preview-item/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/datasets/create/stop-embedding-modal/index.spec.tsx": {
     "test/prefer-hooks-in-order": {
       "count": 1
@@ -1670,6 +1816,9 @@
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 2
     },
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 2
     }
@@ -1734,6 +1883,11 @@
       "count": 2
     }
   },
+  "app/components/datasets/documents/create-from-pipeline/data-source/store/provider.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/datasets/documents/create-from-pipeline/data-source/store/slices/online-drive.ts": {
     "ts/no-explicit-any": {
       "count": 4
@@ -1779,6 +1933,11 @@
       "count": 1
     }
   },
+  "app/components/datasets/documents/detail/completed/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/datasets/documents/detail/completed/new-child-segment.tsx": {
     "ts/no-explicit-any": {
       "count": 1
@@ -1802,6 +1961,11 @@
       "count": 1
     }
   },
+  "app/components/datasets/documents/detail/segment-add/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/datasets/documents/detail/settings/pipeline-settings/index.tsx": {
     "ts/no-explicit-any": {
       "count": 6
@@ -1942,6 +2106,11 @@
       "count": 1
     }
   },
+  "app/components/explore/try-app/tab.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/goto-anything/actions/commands/command-bus.ts": {
     "ts/no-explicit-any": {
       "count": 2
@@ -1953,6 +2122,9 @@
     }
   },
   "app/components/goto-anything/actions/commands/slash.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -1970,6 +2142,9 @@
   "app/components/goto-anything/context.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 4
+    },
+    "react-refresh/only-export-components": {
+      "count": 1
     }
   },
   "app/components/goto-anything/index.spec.tsx": {
@@ -2166,6 +2341,11 @@
       "count": 4
     }
   },
+  "app/components/plugins/install-plugin/install-bundle/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/plugins/install-plugin/install-bundle/item/github-item.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
@@ -2242,6 +2422,11 @@
       "count": 2
     }
   },
+  "app/components/plugins/plugin-auth/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    }
+  },
   "app/components/plugins/plugin-auth/plugin-auth-in-agent.tsx": {
     "ts/no-explicit-any": {
       "count": 1
@@ -2326,6 +2511,9 @@
     }
   },
   "app/components/plugins/plugin-detail-panel/subscription-list/create/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -2371,6 +2559,9 @@
     }
   },
   "app/components/plugins/plugin-page/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -2725,6 +2916,11 @@
       "count": 1
     }
   },
+  "app/components/workflow/block-selector/constants.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/block-selector/featured-tools.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 2
@@ -2746,6 +2942,11 @@
       "count": 1
     }
   },
+  "app/components/workflow/block-selector/index-bar.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/block-selector/market-place-plugin/action.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
@@ -2784,16 +2985,31 @@
       "count": 1
     }
   },
+  "app/components/workflow/block-selector/view-type-select.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/candidate-node-main.tsx": {
     "ts/no-explicit-any": {
       "count": 2
     }
   },
+  "app/components/workflow/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/custom-group-node/custom-group-node.tsx": {
     "unused-imports/no-unused-vars": {
       "count": 1
     }
   },
+  "app/components/workflow/datasets-detail-store/provider.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/header/run-mode.tsx": {
     "no-console": {
       "count": 1
@@ -2802,11 +3018,21 @@
       "count": 1
     }
   },
+  "app/components/workflow/header/test-run-menu.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/header/view-workflow-history.tsx": {
     "ts/no-explicit-any": {
       "count": 1
     }
   },
+  "app/components/workflow/hooks-store/provider.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/hooks/use-checklist.ts": {
     "ts/no-empty-object-type": {
       "count": 2
@@ -2871,6 +3097,9 @@
     }
   },
   "app/components/workflow/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -2917,10 +3146,18 @@
     }
   },
   "app/components/workflow/nodes/_base/components/editor/code-editor/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 6
     }
   },
+  "app/components/workflow/nodes/_base/components/entry-node-container.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/nodes/_base/components/error-handle/default-value.tsx": {
     "ts/no-explicit-any": {
       "count": 1
@@ -2946,6 +3183,16 @@
       "count": 1
     }
   },
+  "app/components/workflow/nodes/_base/components/layout/index.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 7
+    }
+  },
+  "app/components/workflow/nodes/_base/components/mcp-tool-availability.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/nodes/_base/components/memory-config.tsx": {
     "unicorn/prefer-number-properties": {
       "count": 1
@@ -3029,6 +3276,9 @@
     }
   },
   "app/components/workflow/nodes/_base/components/workflow-panel/tab.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -3082,6 +3332,9 @@
     }
   },
   "app/components/workflow/nodes/agent/panel.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -3370,6 +3623,11 @@
       "count": 2
     }
   },
+  "app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor/context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    }
+  },
   "app/components/workflow/nodes/llm/components/json-schema-config-modal/visual-editor/edit-card/auto-width-input.tsx": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 1
@@ -3662,6 +3920,11 @@
       "count": 1
     }
   },
+  "app/components/workflow/note-node/note-editor/toolbar/color-picker.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/note-node/note-editor/utils.ts": {
     "regexp/no-useless-quantifier": {
       "count": 1
@@ -3698,6 +3961,9 @@
     }
   },
   "app/components/workflow/panel/chat-variable-panel/components/object-value-item.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    },
     "ts/no-explicit-any": {
       "count": 5
     },
@@ -3852,6 +4118,16 @@
       "count": 4
     }
   },
+  "app/components/workflow/skill/editor/skill-editor/plugins/tool-block/tool-block-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "app/components/workflow/skill/hooks/use-skill-save-manager.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "app/components/workflow/store/workflow/debug/inspect-vars-slice.ts": {
     "ts/no-explicit-any": {
       "count": 2
@@ -3959,6 +4235,11 @@
       "count": 8
     }
   },
+  "app/components/workflow/workflow-history-store.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    }
+  },
   "app/components/workflow/workflow-preview/components/nodes/constants.ts": {
     "ts/no-explicit-any": {
       "count": 1
@@ -4020,30 +4301,79 @@
     }
   },
   "context/app-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
   },
+  "context/datasets-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "context/event-emitter.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "context/external-api-panel-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "context/external-knowledge-api-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "context/global-public-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 4
+    }
+  },
   "context/hooks/use-trigger-events-limit-modal.ts": {
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 3
     }
   },
+  "context/mitt-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    }
+  },
   "context/modal-context.test.tsx": {
     "ts/no-explicit-any": {
       "count": 3
     }
   },
   "context/modal-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 2
+    },
     "ts/no-explicit-any": {
       "count": 5
     }
   },
   "context/provider-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 3
+    },
     "ts/no-explicit-any": {
       "count": 1
     }
   },
+  "context/web-app-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
+  "context/workspace-context.tsx": {
+    "react-refresh/only-export-components": {
+      "count": 1
+    }
+  },
   "hooks/use-async-window-open.spec.ts": {
     "ts/no-explicit-any": {
       "count": 6
@@ -4078,8 +4408,8 @@
     }
   },
   "hooks/use-pay.tsx": {
-    "react-hooks-extra/no-direct-set-state-in-use-effect": {
-      "count": 4
+    "react-refresh/only-export-components": {
+      "count": 3
     }
   },
   "i18n-config/README.md": {
diff --git a/web/hooks/use-pay.tsx b/web/hooks/use-pay.tsx
index a72107daeb..bed69490d1 100644
--- a/web/hooks/use-pay.tsx
+++ b/web/hooks/use-pay.tsx
@@ -18,6 +18,7 @@ export const useAnthropicCheckPay = () => {
 
   useEffect(() => {
     if (providerName === 'anthropic' && (paymentResult === 'succeeded' || paymentResult === 'cancelled')) {
+      // eslint-disable-next-line react-hooks-extra/no-direct-set-state-in-use-effect
       setConfirm({
         type: paymentResult === 'succeeded' ? 'info' : 'warning',
         title: paymentResult === 'succeeded' ? t('actionMsg.paySucceeded', { ns: 'common' }) : t('actionMsg.payCancelled', { ns: 'common' }),
@@ -37,6 +38,7 @@ export const useBillingPay = () => {
 
   useEffect(() => {
     if (paymentType === 'billing' && (paymentResult === 'succeeded' || paymentResult === 'cancelled')) {
+      // eslint-disable-next-line react-hooks-extra/no-direct-set-state-in-use-effect
       setConfirm({
         type: paymentResult === 'succeeded' ? 'info' : 'warning',
         title: paymentResult === 'succeeded' ? t('actionMsg.paySucceeded', { ns: 'common' }) : t('actionMsg.payCancelled', { ns: 'common' }),
@@ -64,12 +66,14 @@ export const useCheckNotion = () => {
   useEffect(() => {
     if (type === 'notion') {
       if (notionError) {
+        // eslint-disable-next-line react-hooks-extra/no-direct-set-state-in-use-effect
         setConfirm({
           type: 'warning',
           title: notionError,
         })
       }
       else if (notionCode) {
+        // eslint-disable-next-line react-hooks-extra/no-direct-set-state-in-use-effect
         setCanBinding(true)
       }
     }