From d7663159e97582fc8008a072bb22d8f25e2ab0e7 Mon Sep 17 00:00:00 2001
From: NFish <douxc512@gmail.com>
Date: Tue, 17 Jun 2025 10:45:03 +0800
Subject: [PATCH 01/11] Fix/webapp loop login (#21092)

---
 web/app/(shareLayout)/layout.tsx | 4 ++--
 web/service/base.ts              | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/app/(shareLayout)/layout.tsx b/web/app/(shareLayout)/layout.tsx
index 7de5d51edb..78b8835009 100644
--- a/web/app/(shareLayout)/layout.tsx
+++ b/web/app/(shareLayout)/layout.tsx
@@ -19,7 +19,7 @@ const Layout: FC<{
   const [isLoading, setIsLoading] = useState(true)
   useEffect(() => {
     (async () => {
-      if (!systemFeatures.webapp_auth.enabled) {
+      if (!isGlobalPending && !systemFeatures.webapp_auth.enabled) {
         setIsLoading(false)
         return
       }
@@ -37,7 +37,7 @@ const Layout: FC<{
       setWebAppAccessMode(ret?.accessMode || AccessMode.PUBLIC)
       setIsLoading(false)
     })()
-  }, [pathname, redirectUrl, setWebAppAccessMode])
+  }, [pathname, redirectUrl, setWebAppAccessMode, isGlobalPending, systemFeatures.webapp_auth.enabled])
   if (isLoading || isGlobalPending) {
     return <div className='flex h-full w-full items-center justify-center'>
       <Loading />
diff --git a/web/service/base.ts b/web/service/base.ts
index ba398c07a6..5242f15b80 100644
--- a/web/service/base.ts
+++ b/web/service/base.ts
@@ -408,7 +408,7 @@ export const ssePost = async (
 
                 if (data.code === 'web_sso_auth_required') {
                   removeAccessToken()
-                  requiredWebSSOLogin()
+                  requiredWebSSOLogin(data.message, 401)
                 }
 
                 if (data.code === 'unauthorized') {
@@ -492,7 +492,7 @@ export const request = async<T>(url: string, options = {}, otherOptions?: IOther
       }
       if (code === 'web_sso_auth_required') {
         removeAccessToken()
-        requiredWebSSOLogin()
+        requiredWebSSOLogin(message, 401)
         return Promise.reject(err)
       }
       if (code === 'unauthorized_and_force_logout') {

From 110bb5e5a5e66f03dd7ca07920e65c46a97b5152 Mon Sep 17 00:00:00 2001
From: NFish <douxc512@gmail.com>
Date: Tue, 17 Jun 2025 11:33:46 +0800
Subject: [PATCH 02/11] fix: auto redirect to login page if web app needs login
 (#21096)

---
 web/service/base.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/service/base.ts b/web/service/base.ts
index 5242f15b80..ba398c07a6 100644
--- a/web/service/base.ts
+++ b/web/service/base.ts
@@ -408,7 +408,7 @@ export const ssePost = async (
 
                 if (data.code === 'web_sso_auth_required') {
                   removeAccessToken()
-                  requiredWebSSOLogin(data.message, 401)
+                  requiredWebSSOLogin()
                 }
 
                 if (data.code === 'unauthorized') {
@@ -492,7 +492,7 @@ export const request = async<T>(url: string, options = {}, otherOptions?: IOther
       }
       if (code === 'web_sso_auth_required') {
         removeAccessToken()
-        requiredWebSSOLogin(message, 401)
+        requiredWebSSOLogin()
         return Promise.reject(err)
       }
       if (code === 'unauthorized_and_force_logout') {

From c5acffb03442ed0724d09dbaed1b3056b039201c Mon Sep 17 00:00:00 2001
From: NFish <douxc512@gmail.com>
Date: Tue, 17 Jun 2025 15:48:58 +0800
Subject: [PATCH 03/11] fix: page loop in datasets and apps if current user is
 dataset_operator (#21114)

---
 web/app/(commonLayout)/datasets/layout.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/app/(commonLayout)/datasets/layout.tsx b/web/app/(commonLayout)/datasets/layout.tsx
index bb514fc348..b3fc5147b5 100644
--- a/web/app/(commonLayout)/datasets/layout.tsx
+++ b/web/app/(commonLayout)/datasets/layout.tsx
@@ -8,15 +8,15 @@ import { useRouter } from 'next/navigation'
 import { useEffect } from 'react'
 
 export default function DatasetsLayout({ children }: { children: React.ReactNode }) {
-  const { isCurrentWorkspaceEditor } = useAppContext()
+  const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator } = useAppContext()
   const router = useRouter()
 
   useEffect(() => {
-    if (!isCurrentWorkspaceEditor)
+    if (!isCurrentWorkspaceEditor && !isCurrentWorkspaceDatasetOperator)
       router.replace('/apps')
-  }, [isCurrentWorkspaceEditor, router])
+  }, [isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator, router])
 
-  if (!isCurrentWorkspaceEditor)
+  if (!isCurrentWorkspaceEditor && !isCurrentWorkspaceDatasetOperator)
     return <Loading type='app' />
   return (
     <ExternalKnowledgeApiProvider>

From 19339c3de1d7ad72ef55ea16e431d70782156850 Mon Sep 17 00:00:00 2001
From: GuanMu <ballmanjq@gmail.com>
Date: Tue, 17 Jun 2025 15:56:45 +0800
Subject: [PATCH 04/11] fix: doc error (#21108)

---
 web/app/(commonLayout)/datasets/template/template.en.mdx | 2 +-
 web/app/(commonLayout)/datasets/template/template.zh.mdx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/app/(commonLayout)/datasets/template/template.en.mdx b/web/app/(commonLayout)/datasets/template/template.en.mdx
index 4d00b7b2b5..e1ff827c96 100644
--- a/web/app/(commonLayout)/datasets/template/template.en.mdx
+++ b/web/app/(commonLayout)/datasets/template/template.en.mdx
@@ -54,7 +54,7 @@ import { Row, Col, Properties, Property, Heading, SubProperty, PropertyInstructi
       </Property>
       <Property name='indexing_technique' type='string' key='indexing_technique'>
         Index mode
-          - <code>high_quality</code> High quality: embedding using embedding model, built as vector database index
+          - <code>high_quality</code> High quality: Embedding using embedding model, built as vector database index
           - <code>economy</code> Economy: Build using inverted index of keyword table index
       </Property>
       <Property name='doc_form' type='string' key='doc_form'>
diff --git a/web/app/(commonLayout)/datasets/template/template.zh.mdx b/web/app/(commonLayout)/datasets/template/template.zh.mdx
index d121a93df2..3994356b51 100644
--- a/web/app/(commonLayout)/datasets/template/template.zh.mdx
+++ b/web/app/(commonLayout)/datasets/template/template.zh.mdx
@@ -55,7 +55,7 @@ import { Row, Col, Properties, Property, Heading, SubProperty, PropertyInstructi
       <Property name='indexing_technique' type='string' key='indexing_technique'>
         索引方式
           - <code>high_quality</code> 高质量：使用  
-        ding 模型进行嵌入，构建为向量数据库索引
+        Embedding 模型进行嵌入，构建为向量数据库索引
           - <code>economy</code> 经济：使用 keyword table index 的倒排索引进行构建
       </Property>
       <Property name='doc_form' type='string' key='doc_form'>

From df6451076bb50513bd8d73b328ad345a719b20a7 Mon Sep 17 00:00:00 2001
From: kurokobo <kuro664@gmail.com>
Date: Tue, 17 Jun 2025 17:11:30 +0900
Subject: [PATCH 05/11] fix: prevent nodes from being unintentionally deleted
 by pressing the backspace key. (#21023)

---
 .../prompt-editor/plugins/component-picker-block/index.tsx    | 1 +
 web/app/components/workflow/hooks/use-shortcuts.ts            | 2 +-
 .../nodes/_base/components/variable/var-reference-vars.tsx    | 4 +++-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
index b43d2c8117..bffcdc60d2 100644
--- a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
+++ b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
@@ -165,6 +165,7 @@ const ComponentPicker = ({
                         isSupportFileVar={isSupportFileVar}
                         onClose={handleClose}
                         onBlur={handleClose}
+                        autoFocus={false}
                       />
                     </div>
                   )
diff --git a/web/app/components/workflow/hooks/use-shortcuts.ts b/web/app/components/workflow/hooks/use-shortcuts.ts
index 8b1003e89c..0d0ba80fe1 100644
--- a/web/app/components/workflow/hooks/use-shortcuts.ts
+++ b/web/app/components/workflow/hooks/use-shortcuts.ts
@@ -61,7 +61,7 @@ export const useShortcuts = (): void => {
     return !showFeaturesPanel && !isEventTargetInputArea(e.target as HTMLElement)
   }, [workflowStore])
 
-  useKeyPress(['delete', 'backspace'], (e) => {
+  useKeyPress(['delete'], (e) => {
     if (shouldHandleShortcut(e)) {
       e.preventDefault()
       handleNodesDelete()
diff --git a/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx b/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx
index 9acbdf4ff7..27063a2ba3 100644
--- a/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx
+++ b/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx
@@ -260,6 +260,7 @@ type Props = {
   maxHeightClass?: string
   onClose?: () => void
   onBlur?: () => void
+  autoFocus?: boolean
 }
 const VarReferenceVars: FC<Props> = ({
   hideSearch,
@@ -271,6 +272,7 @@ const VarReferenceVars: FC<Props> = ({
   maxHeightClass,
   onClose,
   onBlur,
+  autoFocus = true,
 }) => {
   const { t } = useTranslation()
   const [searchText, setSearchText] = useState('')
@@ -323,7 +325,7 @@ const VarReferenceVars: FC<Props> = ({
                 onKeyDown={handleKeyDown}
                 onClear={() => setSearchText('')}
                 onBlur={onBlur}
-                autoFocus
+                autoFocus={autoFocus}
               />
             </div>
             <div className='relative left-[-4px] h-[0.5px] bg-black/5' style={{

From 6c0a91a64f09b682f371d91ec16d00afdd428677 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9D=9E=E6=B3=95=E6=93=8D=E4=BD=9C?= <hjlarry@163.com>
Date: Tue, 17 Jun 2025 16:11:57 +0800
Subject: [PATCH 06/11] fix: some dark theme display incorrect (#21055)

---
 .../install-plugin/install-from-github/steps/selectPackage.tsx  | 2 ++
 web/app/components/workflow/panel/env-panel/variable-modal.tsx  | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/web/app/components/plugins/install-plugin/install-from-github/steps/selectPackage.tsx b/web/app/components/plugins/install-plugin/install-from-github/steps/selectPackage.tsx
index 24e1e39ff5..c77d0d0a70 100644
--- a/web/app/components/plugins/install-plugin/install-from-github/steps/selectPackage.tsx
+++ b/web/app/components/plugins/install-plugin/install-from-github/steps/selectPackage.tsx
@@ -83,6 +83,7 @@ const SelectPackage: React.FC<SelectPackageProps> = ({
         installedValue={updatePayload?.originalPackageInfo.version}
         placeholder={t(`${i18nPrefix}.selectVersionPlaceholder`) || ''}
         popupClassName='w-[512px] z-[1001]'
+        triggerClassName='text-components-input-text-filled'
       />
       <label
         htmlFor='package'
@@ -97,6 +98,7 @@ const SelectPackage: React.FC<SelectPackageProps> = ({
         readonly={!selectedVersion}
         placeholder={t(`${i18nPrefix}.selectPackagePlaceholder`) || ''}
         popupClassName='w-[512px] z-[1001]'
+        triggerClassName='text-components-input-text-filled'
       />
       <div className='mt-4 flex items-center justify-end gap-2 self-stretch'>
         {!isEdit
diff --git a/web/app/components/workflow/panel/env-panel/variable-modal.tsx b/web/app/components/workflow/panel/env-panel/variable-modal.tsx
index 4546aabae6..c842554948 100644
--- a/web/app/components/workflow/panel/env-panel/variable-modal.tsx
+++ b/web/app/components/workflow/panel/env-panel/variable-modal.tsx
@@ -139,7 +139,7 @@ const VariableModal = ({
           <div className='flex'>
             {
               type !== 'number' ? <textarea
-                className='system-sm-regular placeholder:system-sm-regular block h-20 w-full resize-none appearance-none rounded-lg border border-transparent bg-components-input-bg-normal p-2 caret-primary-600 outline-none placeholder:text-components-input-text-placeholder hover:border-components-input-border-hover hover:bg-components-input-bg-hover focus:border-components-input-border-active focus:bg-components-input-bg-active focus:shadow-xs'
+                className='system-sm-regular placeholder:system-sm-regular block h-20 w-full resize-none appearance-none rounded-lg border border-transparent bg-components-input-bg-normal p-2 text-components-input-text-filled caret-primary-600 outline-none placeholder:text-components-input-text-placeholder hover:border-components-input-border-hover hover:bg-components-input-bg-hover focus:border-components-input-border-active focus:bg-components-input-bg-active focus:shadow-xs'
                 value={value}
                 placeholder={t('workflow.env.modal.valuePlaceholder') || ''}
                 onChange={e => setValue(e.target.value)}

From 6a5236b20096121bc1550983ff9ddea8b170ca63 Mon Sep 17 00:00:00 2001
From: Bowen Liang <liangbowen@gf.com.cn>
Date: Tue, 17 Jun 2025 16:14:53 +0800
Subject: [PATCH 07/11] chore: cleanup wrong and unused doc links in i18
 translations by appling docLink method usage (#21112)

---
 .../app/configuration/tools/external-data-tool-modal.tsx      | 4 +++-
 .../new-feature-panel/moderation/moderation-setting-modal.tsx | 4 +++-
 .../header/account-setting/api-based-extension-page/empty.tsx | 4 +++-
 .../header/account-setting/api-based-extension-page/modal.tsx | 4 +++-
 web/i18n/de-DE/common.ts                                      | 1 -
 web/i18n/de-DE/dataset-creation.ts                            | 2 --
 web/i18n/en-US/common.ts                                      | 1 -
 web/i18n/en-US/dataset-creation.ts                            | 2 --
 web/i18n/es-ES/common.ts                                      | 1 -
 web/i18n/es-ES/dataset-creation.ts                            | 2 --
 web/i18n/fa-IR/common.ts                                      | 1 -
 web/i18n/fa-IR/dataset-creation.ts                            | 2 --
 web/i18n/fr-FR/common.ts                                      | 1 -
 web/i18n/fr-FR/dataset-creation.ts                            | 2 --
 web/i18n/hi-IN/common.ts                                      | 1 -
 web/i18n/hi-IN/dataset-creation.ts                            | 3 ---
 web/i18n/it-IT/common.ts                                      | 1 -
 web/i18n/it-IT/dataset-creation.ts                            | 3 ---
 web/i18n/ja-JP/common.ts                                      | 1 -
 web/i18n/ja-JP/dataset-creation.ts                            | 2 --
 web/i18n/ko-KR/common.ts                                      | 1 -
 web/i18n/ko-KR/dataset-creation.ts                            | 2 --
 web/i18n/pl-PL/common.ts                                      | 1 -
 web/i18n/pl-PL/dataset-creation.ts                            | 2 --
 web/i18n/pt-BR/common.ts                                      | 1 -
 web/i18n/pt-BR/dataset-creation.ts                            | 2 --
 web/i18n/ro-RO/common.ts                                      | 1 -
 web/i18n/ro-RO/dataset-creation.ts                            | 2 --
 web/i18n/ru-RU/common.ts                                      | 1 -
 web/i18n/ru-RU/dataset-creation.ts                            | 2 --
 web/i18n/sl-SI/common.ts                                      | 2 --
 web/i18n/sl-SI/dataset-creation.ts                            | 2 --
 web/i18n/th-TH/common.ts                                      | 1 -
 web/i18n/th-TH/dataset-creation.ts                            | 2 --
 web/i18n/tr-TR/common.ts                                      | 1 -
 web/i18n/tr-TR/dataset-creation.ts                            | 2 --
 web/i18n/uk-UA/common.ts                                      | 1 -
 web/i18n/uk-UA/dataset-creation.ts                            | 2 --
 web/i18n/vi-VN/common.ts                                      | 1 -
 web/i18n/vi-VN/dataset-creation.ts                            | 2 --
 web/i18n/zh-Hans/common.ts                                    | 1 -
 web/i18n/zh-Hans/dataset-creation.ts                          | 2 --
 web/i18n/zh-Hant/common.ts                                    | 1 -
 web/i18n/zh-Hant/dataset-creation.ts                          | 2 --
 44 files changed, 12 insertions(+), 67 deletions(-)

diff --git a/web/app/components/app/configuration/tools/external-data-tool-modal.tsx b/web/app/components/app/configuration/tools/external-data-tool-modal.tsx
index ee4bd57325..3fd020f60f 100644
--- a/web/app/components/app/configuration/tools/external-data-tool-modal.tsx
+++ b/web/app/components/app/configuration/tools/external-data-tool-modal.tsx
@@ -20,6 +20,7 @@ import type {
 import { useToastContext } from '@/app/components/base/toast'
 import AppIcon from '@/app/components/base/app-icon'
 import { noop } from 'lodash-es'
+import { useDocLink } from '@/context/i18n'
 
 const systemTypes = ['api']
 type ExternalDataToolModalProps = {
@@ -40,6 +41,7 @@ const ExternalDataToolModal: FC<ExternalDataToolModalProps> = ({
   onValidateBeforeSave,
 }) => {
   const { t } = useTranslation()
+  const docLink = useDocLink()
   const { notify } = useToastContext()
   const { locale } = useContext(I18n)
   const [localeData, setLocaleData] = useState(data.type ? data : { ...data, type: 'api' })
@@ -243,7 +245,7 @@ const ExternalDataToolModal: FC<ExternalDataToolModalProps> = ({
             <div className='flex h-9 items-center justify-between text-sm font-medium text-gray-900'>
               {t('common.apiBasedExtension.selector.title')}
               <a
-                href={t('common.apiBasedExtension.linkUrl') || '/'}
+                href={docLink('/guides/extension/api-based-extension/README')}
                 target='_blank' rel='noopener noreferrer'
                 className='group flex items-center text-xs font-normal text-gray-500 hover:text-primary-600'
               >
diff --git a/web/app/components/base/features/new-feature-panel/moderation/moderation-setting-modal.tsx b/web/app/components/base/features/new-feature-panel/moderation/moderation-setting-modal.tsx
index ab5200f38f..3ede2d7c6b 100644
--- a/web/app/components/base/features/new-feature-panel/moderation/moderation-setting-modal.tsx
+++ b/web/app/components/base/features/new-feature-panel/moderation/moderation-setting-modal.tsx
@@ -25,6 +25,7 @@ import { useModalContext } from '@/context/modal-context'
 import { CustomConfigurationStatusEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import cn from '@/utils/classnames'
 import { noop } from 'lodash-es'
+import { useDocLink } from '@/context/i18n'
 
 const systemTypes = ['openai_moderation', 'keywords', 'api']
 
@@ -46,6 +47,7 @@ const ModerationSettingModal: FC<ModerationSettingModalProps> = ({
   onSave,
 }) => {
   const { t } = useTranslation()
+  const docLink = useDocLink()
   const { notify } = useToastContext()
   const { locale } = useContext(I18n)
   const { data: modelProviders, isLoading, mutate } = useSWR('/workspaces/current/model-providers', fetchModelProviders)
@@ -316,7 +318,7 @@ const ModerationSettingModal: FC<ModerationSettingModalProps> = ({
             <div className='flex h-9 items-center justify-between'>
               <div className='text-sm font-medium text-text-primary'>{t('common.apiBasedExtension.selector.title')}</div>
               <a
-                href={t('common.apiBasedExtension.linkUrl') || '/'}
+                href={docLink('/guides/extension/api-based-extension/README')}
                 target='_blank' rel='noopener noreferrer'
                 className='group flex items-center text-xs text-text-tertiary hover:text-primary-600'
               >
diff --git a/web/app/components/header/account-setting/api-based-extension-page/empty.tsx b/web/app/components/header/account-setting/api-based-extension-page/empty.tsx
index a7c73917bb..c95e8d8d0c 100644
--- a/web/app/components/header/account-setting/api-based-extension-page/empty.tsx
+++ b/web/app/components/header/account-setting/api-based-extension-page/empty.tsx
@@ -3,9 +3,11 @@ import {
   RiExternalLinkLine,
   RiPuzzle2Line,
 } from '@remixicon/react'
+import { useDocLink } from '@/context/i18n'
 
 const Empty = () => {
   const { t } = useTranslation()
+  const docLink = useDocLink()
 
   return (
     <div className='mb-2 rounded-xl bg-background-section p-6'>
@@ -15,7 +17,7 @@ const Empty = () => {
       <div className='system-sm-medium mb-1 text-text-secondary'>{t('common.apiBasedExtension.title')}</div>
       <a
         className='system-xs-regular flex items-center text-text-accent'
-        href={t('common.apiBasedExtension.linkUrl') || '/'}
+        href={docLink('/guides/extension/api-based-extension/README')}
         target='_blank' rel='noopener noreferrer'
       >
         {t('common.apiBasedExtension.link')}
diff --git a/web/app/components/header/account-setting/api-based-extension-page/modal.tsx b/web/app/components/header/account-setting/api-based-extension-page/modal.tsx
index 53f7673b15..f6c0d93db0 100644
--- a/web/app/components/header/account-setting/api-based-extension-page/modal.tsx
+++ b/web/app/components/header/account-setting/api-based-extension-page/modal.tsx
@@ -1,6 +1,7 @@
 import type { FC } from 'react'
 import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { useDocLink } from '@/context/i18n'
 import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
 import { BookOpen01 } from '@/app/components/base/icons/src/vender/line/education'
@@ -29,6 +30,7 @@ const ApiBasedExtensionModal: FC<ApiBasedExtensionModalProps> = ({
   onSave,
 }) => {
   const { t } = useTranslation()
+  const docLink = useDocLink()
   const [localeData, setLocaleData] = useState(data)
   const [loading, setLoading] = useState(false)
   const { notify } = useToastContext()
@@ -100,7 +102,7 @@ const ApiBasedExtensionModal: FC<ApiBasedExtensionModalProps> = ({
         <div className='flex h-9 items-center justify-between text-sm font-medium text-text-primary'>
           {t('common.apiBasedExtension.modal.apiEndpoint.title')}
           <a
-            href={t('common.apiBasedExtension.linkUrl') || '/'}
+            href={docLink('/guides/extension/api-based-extension/README')}
             target='_blank' rel='noopener noreferrer'
             className='group flex items-center text-xs font-normal text-text-accent'
           >
diff --git a/web/i18n/de-DE/common.ts b/web/i18n/de-DE/common.ts
index 3e00cfcaed..ae4805deb7 100644
--- a/web/i18n/de-DE/common.ts
+++ b/web/i18n/de-DE/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API-Erweiterungen bieten zentralisiertes API-Management und vereinfachen die Konfiguration für eine einfache Verwendung in Difys Anwendungen.',
     link: 'Erfahren Sie, wie Sie Ihre eigene API-Erweiterung entwickeln.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'API-Erweiterung hinzufügen',
     selector: {
       title: 'API-Erweiterung',
diff --git a/web/i18n/de-DE/dataset-creation.ts b/web/i18n/de-DE/dataset-creation.ts
index 9500c0cd68..a34533806b 100644
--- a/web/i18n/de-DE/dataset-creation.ts
+++ b/web/i18n/de-DE/dataset-creation.ts
@@ -69,7 +69,6 @@ const translation = {
       unknownError: 'Unbekannter Fehler',
       resetAll: 'Alles zurücksetzen',
       extractOnlyMainContent: 'Extrahieren Sie nur den Hauptinhalt (keine Kopf-, Navigations- und Fußzeilen usw.)',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       firecrawlTitle: 'Extrahieren von Webinhalten mit 🔥Firecrawl',
       maxDepthTooltip: 'Maximale Tiefe für das Crawlen relativ zur eingegebenen URL. Tiefe 0 kratzt nur die Seite der eingegebenen URL, Tiefe 1 kratzt die URL und alles nach der eingegebenen URL + ein / und so weiter.',
       crawlSubPage: 'Unterseiten crawlen',
@@ -85,7 +84,6 @@ const translation = {
       configureJinaReader: 'Jina Reader konfigurieren',
       waterCrawlNotConfigured: 'Watercrawl ist nicht konfiguriert',
       configureWatercrawl: 'Wasserkrabbe konfigurieren',
-      watercrawlDocLink: 'https://docs.dify.ai/de/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       watercrawlTitle: 'Webinhalt mit Watercrawl extrahieren',
       watercrawlDoc: 'Wasserkriechen-Dokumente',
       configureFirecrawl: 'Firecrawl konfigurieren',
diff --git a/web/i18n/en-US/common.ts b/web/i18n/en-US/common.ts
index 05000f9343..3c7630c15c 100644
--- a/web/i18n/en-US/common.ts
+++ b/web/i18n/en-US/common.ts
@@ -484,7 +484,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API extensions provide centralized API management, simplifying configuration for easy use across Dify\'s applications.',
     link: 'Learn how to develop your own API Extension.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Add API Extension',
     selector: {
       title: 'API Extension',
diff --git a/web/i18n/en-US/dataset-creation.ts b/web/i18n/en-US/dataset-creation.ts
index cf2d454f06..90bac8dcb8 100644
--- a/web/i18n/en-US/dataset-creation.ts
+++ b/web/i18n/en-US/dataset-creation.ts
@@ -80,10 +80,8 @@ const translation = {
       run: 'Run',
       firecrawlTitle: 'Extract web content with 🔥Firecrawl',
       firecrawlDoc: 'Firecrawl docs',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       watercrawlTitle: 'Extract web content with Watercrawl',
       watercrawlDoc: 'Watercrawl docs',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       jinaReaderTitle: 'Convert the entire site to Markdown',
       jinaReaderDoc: 'Learn more about Jina Reader',
       jinaReaderDocLink: 'https://jina.ai/reader',
diff --git a/web/i18n/es-ES/common.ts b/web/i18n/es-ES/common.ts
index 82ed315f1c..1f20541bba 100644
--- a/web/i18n/es-ES/common.ts
+++ b/web/i18n/es-ES/common.ts
@@ -471,7 +471,6 @@ const translation = {
   apiBasedExtension: {
     title: 'Las extensiones basadas en API proporcionan una gestión centralizada de API, simplificando la configuración para su fácil uso en las aplicaciones de Dify.',
     link: 'Aprende cómo desarrollar tu propia Extensión API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Agregar Extensión API',
     selector: {
       title: 'Extensión API',
diff --git a/web/i18n/es-ES/dataset-creation.ts b/web/i18n/es-ES/dataset-creation.ts
index 39846883d1..7bb62e1ea3 100644
--- a/web/i18n/es-ES/dataset-creation.ts
+++ b/web/i18n/es-ES/dataset-creation.ts
@@ -63,7 +63,6 @@ const translation = {
       run: 'Ejecutar',
       firecrawlTitle: 'Extraer contenido web con 🔥Firecrawl',
       firecrawlDoc: 'Documentación de Firecrawl',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       options: 'Opciones',
       crawlSubPage: 'Rastrear subpáginas',
       limit: 'Límite',
@@ -92,7 +91,6 @@ const translation = {
       configureFirecrawl: 'Configurar Firecrawl',
       watercrawlDoc: 'Documentos de Watercrawl',
       configureJinaReader: 'Configurar Jina Reader',
-      watercrawlDocLink: 'https://docs.dify.ai/es/guías/base-de-conocimientos/crear-conocimientos-y-subir-documentos/importar-datos-de-contenido/sincronizar-desde-el-sitio-web',
       configureWatercrawl: 'Configurar Watercrawl',
       waterCrawlNotConfiguredDescription: 'Configura Watercrawl con la clave de API para usarlo.',
     },
diff --git a/web/i18n/fa-IR/common.ts b/web/i18n/fa-IR/common.ts
index 7cd9a89684..a15c29a16a 100644
--- a/web/i18n/fa-IR/common.ts
+++ b/web/i18n/fa-IR/common.ts
@@ -471,7 +471,6 @@ const translation = {
   apiBasedExtension: {
     title: 'افزونه‌های مبتنی بر API مدیریت متمرکز API را فراهم می‌کنند و پیکربندی را برای استفاده آسان در برنامه‌های Dify ساده می‌کنند.',
     link: 'نحوه توسعه افزونه API خود را بیاموزید.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'افزودن افزونه API',
     selector: {
       title: 'افزونه API',
diff --git a/web/i18n/fa-IR/dataset-creation.ts b/web/i18n/fa-IR/dataset-creation.ts
index 4d938bbafe..bf3a03e0c2 100644
--- a/web/i18n/fa-IR/dataset-creation.ts
+++ b/web/i18n/fa-IR/dataset-creation.ts
@@ -63,7 +63,6 @@ const translation = {
       run: 'اجرا',
       firecrawlTitle: 'استخراج محتوای وب با fireFirecrawl',
       firecrawlDoc: 'مستندات Firecrawl',
-      firecrawlDocLink: '<a href="https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website">https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website</a>',
       options: 'گزینهها',
       crawlSubPage: 'خزش صفحات فرعی',
       limit: 'محدودیت',
@@ -92,7 +91,6 @@ const translation = {
       waterCrawlNotConfiguredDescription: 'برای استفاده از Watercrawl، آن را با کلید API پیکربندی کنید.',
       waterCrawlNotConfigured: 'Watercrawl پیکربندی نشده است',
       configureJinaReader: 'پیکربندی خواننده جینا',
-      watercrawlDocLink: 'https://docs.dify.ai/fa/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       watercrawlTitle: 'محتوای وب را با واترکرال استخراج کنید',
       configureWatercrawl: 'تنظیم واترکراول',
     },
diff --git a/web/i18n/fr-FR/common.ts b/web/i18n/fr-FR/common.ts
index f08ef40c4d..29e62956a3 100644
--- a/web/i18n/fr-FR/common.ts
+++ b/web/i18n/fr-FR/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'Les extensions API fournissent une gestion centralisée des API, simplifiant la configuration pour une utilisation facile à travers les applications de Dify.',
     link: 'Apprenez comment développer votre propre Extension API.',
-    linkUrl: 'https://docs.dify.ai/fonctionnalites/extension/extension_basee_sur_api',
     add: 'Ajouter l\'extension API',
     selector: {
       title: 'Extension de l\'API',
diff --git a/web/i18n/fr-FR/dataset-creation.ts b/web/i18n/fr-FR/dataset-creation.ts
index 6339ceaac2..e1a5a85a8b 100644
--- a/web/i18n/fr-FR/dataset-creation.ts
+++ b/web/i18n/fr-FR/dataset-creation.ts
@@ -61,7 +61,6 @@ const translation = {
       preview: 'Aperçu',
       crawlSubPage: 'Explorer les sous-pages',
       configure: 'Configurer',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       maxDepth: 'Profondeur maximale',
       fireCrawlNotConfigured: 'Firecrawl n’est pas configuré',
       firecrawlTitle: 'Extraire du contenu web avec 🔥Firecrawl',
@@ -88,7 +87,6 @@ const translation = {
       configureJinaReader: 'Configurer le lecteur Jina',
       configureWatercrawl: 'Configurer Watercrawl',
       waterCrawlNotConfigured: 'Watercrawl n\'est pas configuré',
-      watercrawlDocLink: 'https://docs.dify.ai/fr/guide/base-de-connaissances/créer-des-connaissances-et-télécharger-des-documents/importer-des-données-de-contenu/synchroniser-depuis-un-site-web',
       configureFirecrawl: 'Configurer Firecrawl',
     },
     cancel: 'Annuler',
diff --git a/web/i18n/hi-IN/common.ts b/web/i18n/hi-IN/common.ts
index 65565f9955..5dfd6586dc 100644
--- a/web/i18n/hi-IN/common.ts
+++ b/web/i18n/hi-IN/common.ts
@@ -488,7 +488,6 @@ const translation = {
     title:
       'एपीआई एक्सटेंशन केंद्रीकृत एपीआई प्रबंधन प्रदान करते हैं, जो Dify के अनुप्रयोगों में आसान उपयोग के लिए कॉन्फ़िगरेशन को सरल बनाते हैं।',
     link: 'अपना खुद का एपीआई एक्सटेंशन कैसे विकसित करें, यह जानें।',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'एपीआई एक्सटेंशन जोड़ें',
     selector: {
       title: 'एपीआई एक्सटेंशन',
diff --git a/web/i18n/hi-IN/dataset-creation.ts b/web/i18n/hi-IN/dataset-creation.ts
index 1f8384354d..64aff7193f 100644
--- a/web/i18n/hi-IN/dataset-creation.ts
+++ b/web/i18n/hi-IN/dataset-creation.ts
@@ -65,8 +65,6 @@ const translation = {
       run: 'चलाएं',
       firecrawlTitle: '🔥फायरक्रॉल के साथ वेब सामग्री निकालें',
       firecrawlDoc: 'फायरक्रॉल दस्तावेज़',
-      firecrawlDocLink:
-        'https://docs.dify.ai/guides/knowledge-base/sync_from_website',
       options: 'विकल्प',
       crawlSubPage: 'उप-पृष्ठों को क्रॉल करें',
       limit: 'सीमा',
@@ -97,7 +95,6 @@ const translation = {
       configureFirecrawl: 'फायरक्रॉल को कॉन्फ़िगर करें',
       watercrawlDoc: 'वाटरक्रॉल दस्तावेज़',
       waterCrawlNotConfiguredDescription: 'इसे उपयोग करने के लिए वॉटरक्रॉल को एपीआई कुंजी के साथ कॉन्फ़िगर करें।',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureJinaReader: 'जिना रीडर कॉन्फ़िगर करें',
       configureWatercrawl: 'वाटरक्रॉल कॉन्फ़िगर करें',
     },
diff --git a/web/i18n/it-IT/common.ts b/web/i18n/it-IT/common.ts
index b47bb23854..13ec7ef43e 100644
--- a/web/i18n/it-IT/common.ts
+++ b/web/i18n/it-IT/common.ts
@@ -495,7 +495,6 @@ const translation = {
     title:
       'Le estensioni API forniscono una gestione centralizzata delle API, semplificando la configurazione per un facile utilizzo nelle applicazioni di Dify.',
     link: 'Scopri come sviluppare la tua estensione API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Aggiungi Estensione API',
     selector: {
       title: 'Estensione API',
diff --git a/web/i18n/it-IT/dataset-creation.ts b/web/i18n/it-IT/dataset-creation.ts
index ec9b5e3138..18df6a505f 100644
--- a/web/i18n/it-IT/dataset-creation.ts
+++ b/web/i18n/it-IT/dataset-creation.ts
@@ -66,8 +66,6 @@ const translation = {
       run: 'Esegui',
       firecrawlTitle: 'Estrai contenuti web con 🔥Firecrawl',
       firecrawlDoc: 'Documenti Firecrawl',
-      firecrawlDocLink:
-        'https://docs.dify.ai/guides/knowledge-base/sync_from_website',
       options: 'Opzioni',
       crawlSubPage: 'Crawl sotto-pagine',
       limit: 'Limite',
@@ -101,7 +99,6 @@ const translation = {
       configureJinaReader: 'Configura Jina Reader',
       configureWatercrawl: 'Configura Watercrawl',
       waterCrawlNotConfigured: 'Watercrawl non è configurato',
-      watercrawlDocLink: 'https://docs.dify.ai/it/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
     },
     cancel: 'Annulla',
   },
diff --git a/web/i18n/ja-JP/common.ts b/web/i18n/ja-JP/common.ts
index 85f5863761..f3120dcc23 100644
--- a/web/i18n/ja-JP/common.ts
+++ b/web/i18n/ja-JP/common.ts
@@ -485,7 +485,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API 拡張機能は、Dify のアプリケーション全体での簡単な使用のための設定を簡素化し、集中的な API 管理を提供します。',
     link: '独自の API 拡張機能を開発する方法について学ぶ。',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'API 拡張機能を追加',
     selector: {
       title: 'API 拡張機能',
diff --git a/web/i18n/ja-JP/dataset-creation.ts b/web/i18n/ja-JP/dataset-creation.ts
index 15bee57c0b..262f0cf8d9 100644
--- a/web/i18n/ja-JP/dataset-creation.ts
+++ b/web/i18n/ja-JP/dataset-creation.ts
@@ -72,7 +72,6 @@ const translation = {
       run: '実行',
       firecrawlTitle: '🔥Firecrawl を使っでウエブコンテンツを抽出',
       firecrawlDoc: 'Firecrawl ドキュメント',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       jinaReaderTitle: 'サイト全体を Markdown に変換する',
       jinaReaderDoc: 'Jina Reader の詳細',
       jinaReaderDocLink: 'https://jina.ai/reader',
@@ -98,7 +97,6 @@ const translation = {
       watercrawlDoc: 'ウォータークローリングの文書',
       watercrawlTitle: 'Watercrawl を使用してウェブコンテンツを抽出する',
       waterCrawlNotConfigured: 'Watercrawl は設定されていません',
-      watercrawlDocLink: 'https://docs.dify.ai/ja/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
     },
   },
   stepTwo: {
diff --git a/web/i18n/ko-KR/common.ts b/web/i18n/ko-KR/common.ts
index c0d64e71e0..7886265912 100644
--- a/web/i18n/ko-KR/common.ts
+++ b/web/i18n/ko-KR/common.ts
@@ -463,7 +463,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API 기반 확장은 Dify 애플리케이션 전체에서 간편한 사용을 위한 설정을 단순화하고 집중적인 API 관리를 제공합니다.',
     link: '사용자 정의 API 기반 확장을 개발하는 방법 배우기',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'API 기반 확장 추가',
     selector: {
       title: 'API 기반 확장',
diff --git a/web/i18n/ko-KR/dataset-creation.ts b/web/i18n/ko-KR/dataset-creation.ts
index 33f6e332a0..9449d40550 100644
--- a/web/i18n/ko-KR/dataset-creation.ts
+++ b/web/i18n/ko-KR/dataset-creation.ts
@@ -52,7 +52,6 @@ const translation = {
       failed: '생성에 실패했습니다',
     },
     website: {
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       limit: '한계',
       options: '옵션',
       firecrawlDoc: 'Firecrawl 문서',
@@ -86,7 +85,6 @@ const translation = {
       waterCrawlNotConfiguredDescription: 'API 키로 Watercrawl 을 구성하여 사용하십시오.',
       watercrawlTitle: 'Watercrawl 로 웹 콘텐츠 추출하기',
       configureFirecrawl: '파이어크롤 구성하기',
-      watercrawlDocLink: '웹사이트에서 동기화하기',
       configureJinaReader: '지나 리더 설정하기',
       waterCrawlNotConfigured: 'Watercrawl 이 설정되어 있지 않습니다.',
       configureWatercrawl: '워터크롤 구성하기',
diff --git a/web/i18n/pl-PL/common.ts b/web/i18n/pl-PL/common.ts
index e081a1ed9e..31457bb67d 100644
--- a/web/i18n/pl-PL/common.ts
+++ b/web/i18n/pl-PL/common.ts
@@ -481,7 +481,6 @@ const translation = {
     title:
       'Rozszerzenia oparte na interfejsie API zapewniają scentralizowane zarządzanie interfejsami API, upraszczając konfigurację dla łatwego użytkowania w aplikacjach Dify.',
     link: 'Dowiedz się, jak opracować własne rozszerzenie interfejsu API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Dodaj rozszerzenie interfejsu API',
     selector: {
       title: 'Rozszerzenie interfejsu API',
diff --git a/web/i18n/pl-PL/dataset-creation.ts b/web/i18n/pl-PL/dataset-creation.ts
index 236202d867..83e6eab96b 100644
--- a/web/i18n/pl-PL/dataset-creation.ts
+++ b/web/i18n/pl-PL/dataset-creation.ts
@@ -54,7 +54,6 @@ const translation = {
     },
     website: {
       limit: 'Ograniczać',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       firecrawlDoc: 'Dokumentacja Firecrawl',
       unknownError: 'Nieznany błąd',
       fireCrawlNotConfiguredDescription: 'Skonfiguruj Firecrawl z kluczem API, aby z niego korzystać.',
@@ -85,7 +84,6 @@ const translation = {
       jinaReaderNotConfiguredDescription: 'Skonfiguruj Jina Reader, wprowadzając bezpłatny klucz API, aby uzyskać dostęp.',
       watercrawlTitle: 'Wyodrębnij treści z sieci za pomocą Watercrawl',
       configureWatercrawl: 'Skonfiguruj Watercrawl',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureJinaReader: 'Skonfiguruj Czytnik Jina',
       configureFirecrawl: 'Skonfiguruj Firecrawl',
       watercrawlDoc: 'Dokumentacja Watercrawl',
diff --git a/web/i18n/pt-BR/common.ts b/web/i18n/pt-BR/common.ts
index d9409b5dd0..89d7437c14 100644
--- a/web/i18n/pt-BR/common.ts
+++ b/web/i18n/pt-BR/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'As extensões de API fornecem gerenciamento centralizado de API, simplificando a configuração para uso fácil em todos os aplicativos da Dify.',
     link: 'Saiba como desenvolver sua própria Extensão de API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Adicionar Extensão de API',
     selector: {
       title: 'Extensão de API',
diff --git a/web/i18n/pt-BR/dataset-creation.ts b/web/i18n/pt-BR/dataset-creation.ts
index 9023d1a6dc..db3b5af302 100644
--- a/web/i18n/pt-BR/dataset-creation.ts
+++ b/web/i18n/pt-BR/dataset-creation.ts
@@ -58,7 +58,6 @@ const translation = {
       crawlSubPage: 'Rastrear subpáginas',
       selectAll: 'Selecionar tudo',
       resetAll: 'Redefinir tudo',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       includeOnlyPaths: 'Incluir apenas caminhos',
       configure: 'Configurar',
       limit: 'Limite',
@@ -87,7 +86,6 @@ const translation = {
       configureJinaReader: 'Configurar o Leitor Jina',
       waterCrawlNotConfigured: 'Watercrawl não está configurado',
       waterCrawlNotConfiguredDescription: 'Configure o Watercrawl com a chave da API para usá-lo.',
-      watercrawlDocLink: 'https://docs.dify.ai/pt/guias/base-de-conhecimentos/criar-conhecimento-e-enviar-documentos/importar-dados-de-conteudo/sincronizar-a-partir-do-site',
       watercrawlDoc: 'Documentos do Watercrawl',
       configureWatercrawl: 'Configurar Watercrawl',
     },
diff --git a/web/i18n/ro-RO/common.ts b/web/i18n/ro-RO/common.ts
index f736240a78..9d964327bd 100644
--- a/web/i18n/ro-RO/common.ts
+++ b/web/i18n/ro-RO/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'Extensiile bazate pe API oferă o gestionare centralizată a API-urilor, simplificând configurația pentru o utilizare ușoară în aplicațiile Dify.',
     link: 'Aflați cum să dezvoltați propria extensie bazată pe API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Adăugați extensie API',
     selector: {
       title: 'Extensie API',
diff --git a/web/i18n/ro-RO/dataset-creation.ts b/web/i18n/ro-RO/dataset-creation.ts
index ce6872c654..77c3bce88a 100644
--- a/web/i18n/ro-RO/dataset-creation.ts
+++ b/web/i18n/ro-RO/dataset-creation.ts
@@ -65,7 +65,6 @@ const translation = {
       firecrawlTitle: 'Extrageți conținut web cu 🔥Firecrawl',
       unknownError: 'Eroare necunoscută',
       scrapTimeInfo: 'Pagini răzuite {{total}} în total în {{timp}}s',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       excludePaths: 'Excluderea căilor',
       resetAll: 'Resetați toate',
       extractOnlyMainContent: 'Extrageți doar conținutul principal (fără anteturi, navigări, subsoluri etc.)',
@@ -86,7 +85,6 @@ const translation = {
       watercrawlTitle: 'Extrageți conținut web cu Watercrawl',
       configureJinaReader: 'Configurează Jina Reader',
       waterCrawlNotConfiguredDescription: 'Configurează Watercrawl cu cheia API pentru a-l folosi.',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureFirecrawl: 'Configurează Firecrawl',
       watercrawlDoc: 'Documentele Watercrawl',
       configureWatercrawl: 'Configurează Watercrawl',
diff --git a/web/i18n/ru-RU/common.ts b/web/i18n/ru-RU/common.ts
index 37d207d357..3738e0f52e 100644
--- a/web/i18n/ru-RU/common.ts
+++ b/web/i18n/ru-RU/common.ts
@@ -471,7 +471,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API-расширения обеспечивают централизованное управление API, упрощая настройку для удобного использования в приложениях Dify.',
     link: 'Узнайте, как разработать собственное API-расширение.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Добавить API Extension',
     selector: {
       title: 'API Extension',
diff --git a/web/i18n/ru-RU/dataset-creation.ts b/web/i18n/ru-RU/dataset-creation.ts
index 7e44306512..49b2f2087c 100644
--- a/web/i18n/ru-RU/dataset-creation.ts
+++ b/web/i18n/ru-RU/dataset-creation.ts
@@ -63,7 +63,6 @@ const translation = {
       run: 'Запустить',
       firecrawlTitle: 'Извлечь веб-контент с помощью 🔥Firecrawl',
       firecrawlDoc: 'Документация Firecrawl',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       options: 'Опции',
       crawlSubPage: 'Сканировать подстраницы',
       limit: 'Лимит',
@@ -88,7 +87,6 @@ const translation = {
       jinaReaderTitle: 'Конвертируйте весь сайт в Markdown',
       useSitemapTooltip: 'Следуйте карте сайта, чтобы просканировать сайт. Если нет, Jina Reader будет сканировать итеративно в зависимости от релевантности страницы, выдавая меньшее количество страниц, но более высокого качества.',
       watercrawlTitle: 'Извлечение веб-контента с помощью Watercrawl',
-      watercrawlDocLink: 'https://docs.dify.ai/ru/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureWatercrawl: 'Настроить Watercrawl',
       waterCrawlNotConfigured: 'Watercrawl не настроен',
       configureFirecrawl: 'Настроить Firecrawl',
diff --git a/web/i18n/sl-SI/common.ts b/web/i18n/sl-SI/common.ts
index b43a2dbbb2..7dd3c8dc52 100644
--- a/web/i18n/sl-SI/common.ts
+++ b/web/i18n/sl-SI/common.ts
@@ -464,7 +464,6 @@ const translation = {
     apiBasedExtension: {
       title: 'Razširitve API omogočajo centralizirano upravljanje API, kar poenostavi konfiguracijo za enostavno uporabo v aplikacijah Dify.',
       link: 'Naučite se, kako razviti svojo API razširitev.',
-      linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
       add: 'Dodaj API razširitev',
       selector: {
         title: 'API razširitev',
@@ -693,7 +692,6 @@ const translation = {
     type: 'Vrsta',
     link: 'Preberite, kako razvijete lastno razširitev API-ja.',
     title: 'Razširitve API zagotavljajo centralizirano upravljanje API, kar poenostavlja konfiguracijo za enostavno uporabo v aplikacijah Dify.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Dodajanje razširitve API-ja',
   },
   about: {
diff --git a/web/i18n/sl-SI/dataset-creation.ts b/web/i18n/sl-SI/dataset-creation.ts
index 72e71049ac..bbe98799d2 100644
--- a/web/i18n/sl-SI/dataset-creation.ts
+++ b/web/i18n/sl-SI/dataset-creation.ts
@@ -71,7 +71,6 @@ const translation = {
       run: 'Zaženi',
       firecrawlTitle: 'Izvleci spletno vsebino z 🔥Firecrawl',
       firecrawlDoc: 'Firecrawl dokumentacija',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       jinaReaderTitle: 'Pretvori celotno stran v Markdown',
       jinaReaderDoc: 'Več o Jina Reader',
       jinaReaderDocLink: 'https://jina.ai/reader',
@@ -97,7 +96,6 @@ const translation = {
       waterCrawlNotConfigured: 'Watercrawl ni konfiguriran',
       watercrawlDoc: 'Watercrawl dokumentacija',
       configureJinaReader: 'Konfigurirajte Jina Reader',
-      watercrawlDocLink: 'https://docs.dify.ai/sl/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureFirecrawl: 'Konfigurirajte Firecrawl',
       watercrawlTitle: 'Izvleci vsebino z interneta z Watercrawl',
     },
diff --git a/web/i18n/th-TH/common.ts b/web/i18n/th-TH/common.ts
index 7425a178d3..d2fd702921 100644
--- a/web/i18n/th-TH/common.ts
+++ b/web/i18n/th-TH/common.ts
@@ -466,7 +466,6 @@ const translation = {
   apiBasedExtension: {
     title: 'ส่วนขยาย API ให้การจัดการ API แบบรวมศูนย์ ทําให้การกําหนดค่าง่ายขึ้นเพื่อให้ใช้งานได้ง่ายในแอปพลิเคชันของ Dify',
     link: 'เรียนรู้วิธีพัฒนาส่วนขยาย API ของคุณเอง',
-    linkUrl: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
     add: 'เพิ่มส่วนขยาย API',
     selector: {
       title: 'ส่วนขยาย API',
diff --git a/web/i18n/th-TH/dataset-creation.ts b/web/i18n/th-TH/dataset-creation.ts
index e6081a9618..cd318984b1 100644
--- a/web/i18n/th-TH/dataset-creation.ts
+++ b/web/i18n/th-TH/dataset-creation.ts
@@ -71,7 +71,6 @@ const translation = {
       run: 'วิ่ง',
       firecrawlTitle: 'แยกเนื้อหาเว็บด้วย 🔥Firecrawl',
       firecrawlDoc: 'เอกสาร Firecrawl',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       jinaReaderTitle: 'แปลงทั้งไซต์เป็น Markdown',
       jinaReaderDoc: 'เรียนรู้เพิ่มเติมเกี่ยวกับ Jina Reader',
       jinaReaderDocLink: 'https://jina.ai/reader',
@@ -94,7 +93,6 @@ const translation = {
       maxDepthTooltip: 'ความลึกสูงสุดในการรวบรวมข้อมูลเมื่อเทียบกับ URL ที่ป้อน ความลึก 0 เพียงแค่ขูดหน้าของ URL ที่ป้อนความลึก 1 ขูด url และทุกอย่างหลังจาก enteredURL + หนึ่ง / เป็นต้น',
       watercrawlTitle: 'ดึงเนื้อหาจากเว็บด้วย Watercrawl',
       configureJinaReader: 'ตั้งค่า Jina Reader',
-      watercrawlDocLink: 'https://docs.dify.ai/th/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureFirecrawl: 'กำหนดค่า Firecrawl',
       configureWatercrawl: 'กำหนดค่าการเข้าถึงน้ำ',
       waterCrawlNotConfiguredDescription: 'กำหนดค่า Watercrawl ด้วย API key เพื่อใช้งาน.',
diff --git a/web/i18n/tr-TR/common.ts b/web/i18n/tr-TR/common.ts
index 62ce150986..987d8caef1 100644
--- a/web/i18n/tr-TR/common.ts
+++ b/web/i18n/tr-TR/common.ts
@@ -471,7 +471,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API uzantıları merkezi API yönetimi sağlar, Dify\'nin uygulamaları arasında kolay kullanım için yapılandırmayı basitleştirir.',
     link: 'Kendi API Uzantınızı nasıl geliştireceğinizi öğrenin.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'API Uzantısı Ekle',
     selector: {
       title: 'API Uzantısı',
diff --git a/web/i18n/tr-TR/dataset-creation.ts b/web/i18n/tr-TR/dataset-creation.ts
index cb3cfcfac4..41dc49b7ca 100644
--- a/web/i18n/tr-TR/dataset-creation.ts
+++ b/web/i18n/tr-TR/dataset-creation.ts
@@ -63,7 +63,6 @@ const translation = {
       run: 'Çalıştır',
       firecrawlTitle: '🔥Firecrawl ile web içeriğini çıkarın',
       firecrawlDoc: 'Firecrawl dokümanları',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       options: 'Seçenekler',
       crawlSubPage: 'Alt sayfaları tarayın',
       limit: 'Sınır',
@@ -93,7 +92,6 @@ const translation = {
       waterCrawlNotConfigured: 'Watercrawl yapılandırılmamış',
       watercrawlTitle: 'Watercrawl ile web içeriğini çıkar',
       configureJinaReader: 'Jina Okuyucusunu Yapılandır',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       configureWatercrawl: 'Watercrawl\'ı yapılandır',
     },
     cancel: 'İptal',
diff --git a/web/i18n/uk-UA/common.ts b/web/i18n/uk-UA/common.ts
index a80e308b78..108ca52342 100644
--- a/web/i18n/uk-UA/common.ts
+++ b/web/i18n/uk-UA/common.ts
@@ -468,7 +468,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API-розширення забезпечують централізоване керування API, спрощуючи конфігурацію для зручного використання в різних програмах Dify.',
     link: 'Дізнайтеся, як розробити власне розширення API.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Додати розширення API',
     selector: {
       title: 'Розширення API',
diff --git a/web/i18n/uk-UA/dataset-creation.ts b/web/i18n/uk-UA/dataset-creation.ts
index 18b5553be7..72b7a8c05c 100644
--- a/web/i18n/uk-UA/dataset-creation.ts
+++ b/web/i18n/uk-UA/dataset-creation.ts
@@ -60,7 +60,6 @@ const translation = {
       unknownError: 'Невідома помилка',
       maxDepth: 'Максимальна глибина',
       crawlSubPage: 'Сканування підсторінок',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       preview: 'Попередній перегляд',
       fireCrawlNotConfigured: 'Firecrawl не налаштовано',
       includeOnlyPaths: 'Включати лише контури',
@@ -88,7 +87,6 @@ const translation = {
       configureFirecrawl: 'Налаштування Firecrawl',
       configureWatercrawl: 'Налаштування Watercrawl',
       watercrawlTitle: 'Витягуйте веб-контент за допомогою Watercrawl',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       watercrawlDoc: 'Документація Watercrawl',
     },
     cancel: 'Скасувати',
diff --git a/web/i18n/vi-VN/common.ts b/web/i18n/vi-VN/common.ts
index 323ca60152..f19825131a 100644
--- a/web/i18n/vi-VN/common.ts
+++ b/web/i18n/vi-VN/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'Các tiện ích API cung cấp quản lý API tập trung, giúp cấu hình dễ dàng sử dụng trên các ứng dụng của Dify.',
     link: 'Tìm hiểu cách phát triển Phần mở rộng API của riêng bạn.',
-    linkUrl: 'https://docs.dify.ai/en/guides/extension/api-based-extension/README',
     add: 'Thêm Phần mở rộng API',
     selector: {
       title: 'Phần mở rộng API',
diff --git a/web/i18n/vi-VN/dataset-creation.ts b/web/i18n/vi-VN/dataset-creation.ts
index f909a51770..34ef374500 100644
--- a/web/i18n/vi-VN/dataset-creation.ts
+++ b/web/i18n/vi-VN/dataset-creation.ts
@@ -63,7 +63,6 @@ const translation = {
       unknownError: 'Lỗi không xác định',
       extractOnlyMainContent: 'Chỉ trích xuất nội dung chính (không có đầu trang, điều hướng, chân trang, v.v.)',
       exceptionErrorTitle: 'Một ngoại lệ xảy ra trong khi chạy tác vụ Firecrawl:',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       selectAll: 'Chọn tất cả',
       firecrawlTitle: 'Trích xuất nội dung web bằng 🔥Firecrawl',
       totalPageScraped: 'Tổng số trang được cạo:',
@@ -86,7 +85,6 @@ const translation = {
       configureFirecrawl: 'Cấu hình Firecrawl',
       configureJinaReader: 'Cấu hình Jina Reader',
       waterCrawlNotConfiguredDescription: 'Cấu hình Watercrawl với khóa API để sử dụng nó.',
-      watercrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       watercrawlTitle: 'Trích xuất nội dung web bằng Watercrawl',
       watercrawlDoc: 'Tài liệu Watercrawl',
       waterCrawlNotConfigured: 'Watercrawl chưa được cấu hình',
diff --git a/web/i18n/zh-Hans/common.ts b/web/i18n/zh-Hans/common.ts
index 00c8a33837..91a1706cce 100644
--- a/web/i18n/zh-Hans/common.ts
+++ b/web/i18n/zh-Hans/common.ts
@@ -484,7 +484,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API 扩展提供了一个集中式的 API 管理，在此统一添加 API 配置后，方便在 Dify 上的各类应用中直接使用。',
     link: '了解如何开发您自己的 API 扩展。',
-    linkUrl: 'https://docs.dify.ai/zh-hans/guides/extension/api-based-extension',
     add: '新增 API 扩展',
     selector: {
       title: 'API 扩展',
diff --git a/web/i18n/zh-Hans/dataset-creation.ts b/web/i18n/zh-Hans/dataset-creation.ts
index 6f4c5af7eb..c8d4a82244 100644
--- a/web/i18n/zh-Hans/dataset-creation.ts
+++ b/web/i18n/zh-Hans/dataset-creation.ts
@@ -79,7 +79,6 @@ const translation = {
       run: '运行',
       firecrawlTitle: '使用 🔥Firecrawl 提取网页内容',
       firecrawlDoc: 'Firecrawl 文档',
-      firecrawlDocLink: 'https://docs.dify.ai/zh-hans/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       jinaReaderTitle: '将整个站点内容转换为 Markdown 格式',
       jinaReaderDoc: '了解更多关于 Jina Reader',
       jinaReaderDocLink: 'https://jina.ai/reader',
@@ -100,7 +99,6 @@ const translation = {
       scrapTimeInfo: '总共在 {{time}}秒 内抓取了 {{total}} 个页面',
       preview: '预览',
       maxDepthTooltip: '相对于输入 URL 的最大抓取深度。深度 0 仅抓取输入 URL 本身的页面，深度 1 抓取输入 URL 及其后的一层目录（一个 /），依此类推。',
-      watercrawlDocLink: '从网站同步',
       watercrawlDoc: 'Watercrawl 文档',
       configureWatercrawl: '配置水爬行',
       watercrawlTitle: '使用 Watercrawl 提取网页内容',
diff --git a/web/i18n/zh-Hant/common.ts b/web/i18n/zh-Hant/common.ts
index 296fae9e7e..ac50a4d555 100644
--- a/web/i18n/zh-Hant/common.ts
+++ b/web/i18n/zh-Hant/common.ts
@@ -467,7 +467,6 @@ const translation = {
   apiBasedExtension: {
     title: 'API 擴充套件提供了一個集中式的 API 管理，在此統一新增 API 配置後，方便在 Dify 上的各類應用中直接使用。',
     link: '瞭解如何開發您自己的 API 擴充套件。',
-    linkUrl: 'https://docs.dify.ai/zh-hans/guides/tools/extensions/api-based/api-based-extension',
     add: '新增 API 擴充套件',
     selector: {
       title: 'API 擴充套件',
diff --git a/web/i18n/zh-Hant/dataset-creation.ts b/web/i18n/zh-Hant/dataset-creation.ts
index 8955deadc8..fca1ff651e 100644
--- a/web/i18n/zh-Hant/dataset-creation.ts
+++ b/web/i18n/zh-Hant/dataset-creation.ts
@@ -61,7 +61,6 @@ const translation = {
       fireCrawlNotConfiguredDescription: '使用 API 金鑰配置 Firecrawl 以使用它。',
       limit: '限制',
       crawlSubPage: '抓取子頁面',
-      firecrawlDocLink: 'https://docs.dify.ai/en/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       preview: '預覽',
       configure: '配置',
       excludePaths: '排除路徑',
@@ -87,7 +86,6 @@ const translation = {
       configureFirecrawl: '配置 Firecrawl',
       configureWatercrawl: '配置水爬行',
       watercrawlTitle: '使用 Watercrawl 提取網頁內容',
-      watercrawlDocLink: 'https://docs.dify.ai/zh-TW/guides/knowledge-base/create-knowledge-and-upload-documents/import-content-data/sync-from-website',
       waterCrawlNotConfiguredDescription: '配置 Watercrawl 並使用 API 金鑰來使用它。',
       configureJinaReader: '配置 Jina Reader',
       waterCrawlNotConfigured: 'Watercrawl 尚未配置',

From 2ddc3658a0f970c8731ea1aa8bd46354b3af289d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9D=9E=E6=B3=95=E6=93=8D=E4=BD=9C?= <hjlarry@163.com>
Date: Tue, 17 Jun 2025 16:26:56 +0800
Subject: [PATCH 08/11] fix: remove the x overflow scroll bar of monitoring
 page (#21059)

---
 .../app/(appDetailLayout)/[appId]/overview/page.tsx             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
index fc97f5e669..e0c09e739e 100644
--- a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
+++ b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
@@ -15,7 +15,7 @@ const Overview = async (props: IDevelopProps) => {
   } = params
 
   return (
-    <div className="h-full overflow-scroll bg-chatbot-bg px-4 py-6 sm:px-12">
+    <div className="h-full overflow-y-auto bg-chatbot-bg px-4 py-6 sm:px-12">
       <ApikeyInfoPanel />
       <ChartView
         appId={appId}

From 7a2a8a2ffd8d04263e5d497b34079e682233a966 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9D=9E=E6=B3=95=E6=93=8D=E4=BD=9C?= <hjlarry@163.com>
Date: Tue, 17 Jun 2025 16:27:51 +0800
Subject: [PATCH 09/11] chore: check input variable key of code/template node
 is valid (#21057)

---
 .../_base/components/variable/var-list.tsx    | 24 +++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/web/app/components/workflow/nodes/_base/components/variable/var-list.tsx b/web/app/components/workflow/nodes/_base/components/variable/var-list.tsx
index 72e9384d5f..181b278051 100644
--- a/web/app/components/workflow/nodes/_base/components/variable/var-list.tsx
+++ b/web/app/components/workflow/nodes/_base/components/variable/var-list.tsx
@@ -8,6 +8,8 @@ import VarReferencePicker from './var-reference-picker'
 import Input from '@/app/components/base/input'
 import type { ValueSelector, Var, Variable } from '@/app/components/workflow/types'
 import { VarType as VarKindType } from '@/app/components/workflow/nodes/tool/types'
+import { checkKeys } from '@/utils/var'
+import Toast from '@/app/components/base/toast'
 
 type Props = {
   nodeId: string
@@ -36,9 +38,27 @@ const VarList: FC<Props> = ({
 
   const handleVarNameChange = useCallback((index: number) => {
     return (e: React.ChangeEvent<HTMLInputElement>) => {
-      onVarNameChange?.(list[index].variable, e.target.value)
+      const newKey = e.target.value
+      const { isValid, errorKey, errorMessageKey } = checkKeys([newKey], true)
+      if (!isValid) {
+        Toast.notify({
+          type: 'error',
+          message: t(`appDebug.varKeyError.${errorMessageKey}`, { key: errorKey }),
+        })
+        return
+      }
+
+      if (list.map(item => item.variable?.trim()).includes(newKey.trim())) {
+        Toast.notify({
+          type: 'error',
+          message: t('appDebug.varKeyError.keyAlreadyExists', { key: newKey }),
+        })
+        return
+      }
+
+      onVarNameChange?.(list[index].variable, newKey)
       const newList = produce(list, (draft) => {
-        draft[index].variable = e.target.value
+        draft[index].variable = newKey
       })
       onChange(newList)
     }

From 0dcacdf83d3b03ef40b0006b8134a671fe543a6b Mon Sep 17 00:00:00 2001
From: -LAN- <laipz8200@outlook.com>
Date: Tue, 17 Jun 2025 16:31:29 +0800
Subject: [PATCH 10/11] feat: add a flask_context_manager. (#21061)

Signed-off-by: -LAN- <laipz8200@outlook.com>
---
 .gitignore                                    |   3 +
 .../app/apps/advanced_chat/app_generator.py   |  45 ++-----
 api/core/app/apps/agent_chat/app_generator.py |  45 ++-----
 api/core/app/apps/workflow/app_generator.py   |  43 ++----
 .../workflow/graph_engine/graph_engine.py     |  20 +--
 .../nodes/iteration/iteration_node.py         |  20 +--
 api/libs/flask_utils.py                       |  65 +++++++++
 api/tests/unit_tests/libs/test_flask_utils.py | 124 ++++++++++++++++++
 8 files changed, 239 insertions(+), 126 deletions(-)
 create mode 100644 api/libs/flask_utils.py
 create mode 100644 api/tests/unit_tests/libs/test_flask_utils.py

diff --git a/.gitignore b/.gitignore
index 74a9ef63ef..4c938b7682 100644
--- a/.gitignore
+++ b/.gitignore
@@ -210,3 +210,6 @@ mise.toml
 
 # Next.js build output
 .next/
+
+# AI Assistant
+.roo/
diff --git a/api/core/app/apps/advanced_chat/app_generator.py b/api/core/app/apps/advanced_chat/app_generator.py
index 8c85f91d7e..9e6adc4b08 100644
--- a/api/core/app/apps/advanced_chat/app_generator.py
+++ b/api/core/app/apps/advanced_chat/app_generator.py
@@ -5,7 +5,7 @@ import uuid
 from collections.abc import Generator, Mapping
 from typing import Any, Literal, Optional, Union, overload
 
-from flask import Flask, copy_current_request_context, current_app, has_request_context
+from flask import Flask, current_app
 from pydantic import ValidationError
 from sqlalchemy.orm import sessionmaker
 
@@ -31,6 +31,7 @@ from core.workflow.repositories.workflow_execution_repository import WorkflowExe
 from core.workflow.repositories.workflow_node_execution_repository import WorkflowNodeExecutionRepository
 from extensions.ext_database import db
 from factories import file_factory
+from libs.flask_utils import preserve_flask_contexts
 from models import Account, App, Conversation, EndUser, Message, Workflow, WorkflowNodeExecutionTriggeredFrom
 from models.enums import WorkflowRunTriggeredFrom
 from services.conversation_service import ConversationService
@@ -399,20 +400,17 @@ class AdvancedChatAppGenerator(MessageBasedAppGenerator):
         # new thread with request context and contextvars
         context = contextvars.copy_context()
 
-        @copy_current_request_context
-        def worker_with_context():
-            # Run the worker within the copied context
-            return context.run(
-                self._generate_worker,
-                flask_app=current_app._get_current_object(),  # type: ignore
-                application_generate_entity=application_generate_entity,
-                queue_manager=queue_manager,
-                conversation_id=conversation.id,
-                message_id=message.id,
-                context=context,
-            )
-
-        worker_thread = threading.Thread(target=worker_with_context)
+        worker_thread = threading.Thread(
+            target=self._generate_worker,
+            kwargs={
+                "flask_app": current_app._get_current_object(),  # type: ignore
+                "application_generate_entity": application_generate_entity,
+                "queue_manager": queue_manager,
+                "conversation_id": conversation.id,
+                "message_id": message.id,
+                "context": context,
+            },
+        )
 
         worker_thread.start()
 
@@ -449,24 +447,9 @@ class AdvancedChatAppGenerator(MessageBasedAppGenerator):
         :param message_id: message ID
         :return:
         """
-        for var, val in context.items():
-            var.set(val)
 
-        # FIXME(-LAN-): Save current user before entering new app context
-        from flask import g
-
-        saved_user = None
-        if has_request_context() and hasattr(g, "_login_user"):
-            saved_user = g._login_user
-
-        with flask_app.app_context():
+        with preserve_flask_contexts(flask_app, context_vars=context):
             try:
-                # Restore user in new app context
-                if saved_user is not None:
-                    from flask import g
-
-                    g._login_user = saved_user
-
                 # get conversation and message
                 conversation = self._get_conversation(conversation_id)
                 message = self._get_message(message_id)
diff --git a/api/core/app/apps/agent_chat/app_generator.py b/api/core/app/apps/agent_chat/app_generator.py
index 158196f24d..a448bf8a94 100644
--- a/api/core/app/apps/agent_chat/app_generator.py
+++ b/api/core/app/apps/agent_chat/app_generator.py
@@ -5,7 +5,7 @@ import uuid
 from collections.abc import Generator, Mapping
 from typing import Any, Literal, Union, overload
 
-from flask import Flask, copy_current_request_context, current_app, has_request_context
+from flask import Flask, current_app
 from pydantic import ValidationError
 
 from configs import dify_config
@@ -23,6 +23,7 @@ from core.model_runtime.errors.invoke import InvokeAuthorizationError
 from core.ops.ops_trace_manager import TraceQueueManager
 from extensions.ext_database import db
 from factories import file_factory
+from libs.flask_utils import preserve_flask_contexts
 from models import Account, App, EndUser
 from services.conversation_service import ConversationService
 from services.errors.message import MessageNotExistsError
@@ -182,20 +183,17 @@ class AgentChatAppGenerator(MessageBasedAppGenerator):
         # new thread with request context and contextvars
         context = contextvars.copy_context()
 
-        @copy_current_request_context
-        def worker_with_context():
-            # Run the worker within the copied context
-            return context.run(
-                self._generate_worker,
-                flask_app=current_app._get_current_object(),  # type: ignore
-                context=context,
-                application_generate_entity=application_generate_entity,
-                queue_manager=queue_manager,
-                conversation_id=conversation.id,
-                message_id=message.id,
-            )
-
-        worker_thread = threading.Thread(target=worker_with_context)
+        worker_thread = threading.Thread(
+            target=self._generate_worker,
+            kwargs={
+                "flask_app": current_app._get_current_object(),  # type: ignore
+                "context": context,
+                "application_generate_entity": application_generate_entity,
+                "queue_manager": queue_manager,
+                "conversation_id": conversation.id,
+                "message_id": message.id,
+            },
+        )
 
         worker_thread.start()
 
@@ -229,24 +227,9 @@ class AgentChatAppGenerator(MessageBasedAppGenerator):
         :param message_id: message ID
         :return:
         """
-        for var, val in context.items():
-            var.set(val)
 
-        # FIXME(-LAN-): Save current user before entering new app context
-        from flask import g
-
-        saved_user = None
-        if has_request_context() and hasattr(g, "_login_user"):
-            saved_user = g._login_user
-
-        with flask_app.app_context():
+        with preserve_flask_contexts(flask_app, context_vars=context):
             try:
-                # Restore user in new app context
-                if saved_user is not None:
-                    from flask import g
-
-                    g._login_user = saved_user
-
                 # get conversation and message
                 conversation = self._get_conversation(conversation_id)
                 message = self._get_message(message_id)
diff --git a/api/core/app/apps/workflow/app_generator.py b/api/core/app/apps/workflow/app_generator.py
index f4aec3479b..7f4770fc97 100644
--- a/api/core/app/apps/workflow/app_generator.py
+++ b/api/core/app/apps/workflow/app_generator.py
@@ -5,7 +5,7 @@ import uuid
 from collections.abc import Generator, Mapping, Sequence
 from typing import Any, Literal, Optional, Union, overload
 
-from flask import Flask, copy_current_request_context, current_app, has_request_context
+from flask import Flask, current_app
 from pydantic import ValidationError
 from sqlalchemy.orm import sessionmaker
 
@@ -29,6 +29,7 @@ from core.workflow.repositories.workflow_execution_repository import WorkflowExe
 from core.workflow.repositories.workflow_node_execution_repository import WorkflowNodeExecutionRepository
 from extensions.ext_database import db
 from factories import file_factory
+from libs.flask_utils import preserve_flask_contexts
 from models import Account, App, EndUser, Workflow, WorkflowNodeExecutionTriggeredFrom
 from models.enums import WorkflowRunTriggeredFrom
 
@@ -209,19 +210,16 @@ class WorkflowAppGenerator(BaseAppGenerator):
         # new thread with request context and contextvars
         context = contextvars.copy_context()
 
-        @copy_current_request_context
-        def worker_with_context():
-            # Run the worker within the copied context
-            return context.run(
-                self._generate_worker,
-                flask_app=current_app._get_current_object(),  # type: ignore
-                application_generate_entity=application_generate_entity,
-                queue_manager=queue_manager,
-                context=context,
-                workflow_thread_pool_id=workflow_thread_pool_id,
-            )
-
-        worker_thread = threading.Thread(target=worker_with_context)
+        worker_thread = threading.Thread(
+            target=self._generate_worker,
+            kwargs={
+                "flask_app": current_app._get_current_object(),  # type: ignore
+                "application_generate_entity": application_generate_entity,
+                "queue_manager": queue_manager,
+                "context": context,
+                "workflow_thread_pool_id": workflow_thread_pool_id,
+            },
+        )
 
         worker_thread.start()
 
@@ -408,24 +406,9 @@ class WorkflowAppGenerator(BaseAppGenerator):
         :param workflow_thread_pool_id: workflow thread pool id
         :return:
         """
-        for var, val in context.items():
-            var.set(val)
 
-        # FIXME(-LAN-): Save current user before entering new app context
-        from flask import g
-
-        saved_user = None
-        if has_request_context() and hasattr(g, "_login_user"):
-            saved_user = g._login_user
-
-        with flask_app.app_context():
+        with preserve_flask_contexts(flask_app, context_vars=context):
             try:
-                # Restore user in new app context
-                if saved_user is not None:
-                    from flask import g
-
-                    g._login_user = saved_user
-
                 # workflow app
                 runner = WorkflowAppRunner(
                     application_generate_entity=application_generate_entity,
diff --git a/api/core/workflow/graph_engine/graph_engine.py b/api/core/workflow/graph_engine/graph_engine.py
index 363b2ee920..875cee17e6 100644
--- a/api/core/workflow/graph_engine/graph_engine.py
+++ b/api/core/workflow/graph_engine/graph_engine.py
@@ -9,7 +9,7 @@ from copy import copy, deepcopy
 from datetime import UTC, datetime
 from typing import Any, Optional, cast
 
-from flask import Flask, current_app, has_request_context
+from flask import Flask, current_app
 
 from configs import dify_config
 from core.app.apps.base_app_queue_manager import GenerateTaskStoppedError
@@ -53,6 +53,7 @@ from core.workflow.nodes.end.end_stream_processor import EndStreamProcessor
 from core.workflow.nodes.enums import ErrorStrategy, FailBranchSourceHandle
 from core.workflow.nodes.event import RunCompletedEvent, RunRetrieverResourceEvent, RunStreamChunkEvent
 from core.workflow.nodes.node_mapping import NODE_TYPE_CLASSES_MAPPING
+from libs.flask_utils import preserve_flask_contexts
 from models.enums import UserFrom
 from models.workflow import WorkflowType
 
@@ -537,24 +538,9 @@ class GraphEngine:
         """
         Run parallel nodes
         """
-        for var, val in context.items():
-            var.set(val)
 
-        # FIXME(-LAN-): Save current user before entering new app context
-        from flask import g
-
-        saved_user = None
-        if has_request_context() and hasattr(g, "_login_user"):
-            saved_user = g._login_user
-
-        with flask_app.app_context():
+        with preserve_flask_contexts(flask_app, context_vars=context):
             try:
-                # Restore user in new app context
-                if saved_user is not None:
-                    from flask import g
-
-                    g._login_user = saved_user
-
                 q.put(
                     ParallelBranchRunStartedEvent(
                         parallel_id=parallel_id,
diff --git a/api/core/workflow/nodes/iteration/iteration_node.py b/api/core/workflow/nodes/iteration/iteration_node.py
index 2592823540..42b6795fb0 100644
--- a/api/core/workflow/nodes/iteration/iteration_node.py
+++ b/api/core/workflow/nodes/iteration/iteration_node.py
@@ -7,7 +7,7 @@ from datetime import UTC, datetime
 from queue import Empty, Queue
 from typing import TYPE_CHECKING, Any, Optional, cast
 
-from flask import Flask, current_app, has_request_context
+from flask import Flask, current_app
 
 from configs import dify_config
 from core.variables import ArrayVariable, IntegerVariable, NoneVariable
@@ -37,6 +37,7 @@ from core.workflow.nodes.base import BaseNode
 from core.workflow.nodes.enums import NodeType
 from core.workflow.nodes.event import NodeEvent, RunCompletedEvent
 from core.workflow.nodes.iteration.entities import ErrorHandleMode, IterationNodeData
+from libs.flask_utils import preserve_flask_contexts
 
 from .exc import (
     InvalidIteratorValueError,
@@ -583,23 +584,8 @@ class IterationNode(BaseNode[IterationNodeData]):
         """
         run single iteration in parallel mode
         """
-        for var, val in context.items():
-            var.set(val)
-
-        # FIXME(-LAN-): Save current user before entering new app context
-        from flask import g
-
-        saved_user = None
-        if has_request_context() and hasattr(g, "_login_user"):
-            saved_user = g._login_user
-
-        with flask_app.app_context():
-            # Restore user in new app context
-            if saved_user is not None:
-                from flask import g
-
-                g._login_user = saved_user
 
+        with preserve_flask_contexts(flask_app, context_vars=context):
             parallel_mode_run_id = uuid.uuid4().hex
             graph_engine_copy = graph_engine.create_copy()
             variable_pool_copy = graph_engine_copy.graph_runtime_state.variable_pool
diff --git a/api/libs/flask_utils.py b/api/libs/flask_utils.py
new file mode 100644
index 0000000000..4ea2779584
--- /dev/null
+++ b/api/libs/flask_utils.py
@@ -0,0 +1,65 @@
+import contextvars
+from collections.abc import Iterator
+from contextlib import contextmanager
+from typing import TypeVar
+
+from flask import Flask, g, has_request_context
+
+T = TypeVar("T")
+
+
+@contextmanager
+def preserve_flask_contexts(
+    flask_app: Flask,
+    context_vars: contextvars.Context,
+) -> Iterator[None]:
+    """
+    A context manager that handles:
+    1. flask-login's UserProxy copy
+    2. ContextVars copy
+    3. flask_app.app_context()
+
+    This context manager ensures that the Flask application context is properly set up,
+    the current user is preserved across context boundaries, and any provided context variables
+    are set within the new context.
+
+    Note:
+        This manager aims to allow use current_user cross thread and app context,
+        but it's not the recommend use, it's better to pass user directly in parameters.
+
+    Args:
+        flask_app: The Flask application instance
+        context_vars: contextvars.Context object containing context variables to be set in the new context
+
+    Yields:
+        None
+
+    Example:
+        ```python
+        with preserve_flask_contexts(flask_app, context_vars=context_vars):
+            # Code that needs Flask app context and context variables
+            # Current user will be preserved if available
+        ```
+    """
+    # Set context variables if provided
+    if context_vars:
+        for var, val in context_vars.items():
+            var.set(val)
+
+    # Save current user before entering new app context
+    saved_user = None
+    if has_request_context() and hasattr(g, "_login_user"):
+        saved_user = g._login_user
+
+    # Enter Flask app context
+    with flask_app.app_context():
+        try:
+            # Restore user in new app context if it was saved
+            if saved_user is not None:
+                g._login_user = saved_user
+
+            # Yield control back to the caller
+            yield
+        finally:
+            # Any cleanup can be added here if needed
+            pass
diff --git a/api/tests/unit_tests/libs/test_flask_utils.py b/api/tests/unit_tests/libs/test_flask_utils.py
new file mode 100644
index 0000000000..fb46ba50f3
--- /dev/null
+++ b/api/tests/unit_tests/libs/test_flask_utils.py
@@ -0,0 +1,124 @@
+import contextvars
+import threading
+from typing import Optional
+
+import pytest
+from flask import Flask
+from flask_login import LoginManager, UserMixin, current_user, login_user
+
+from libs.flask_utils import preserve_flask_contexts
+
+
+class User(UserMixin):
+    """Simple User class for testing."""
+
+    def __init__(self, id: str):
+        self.id = id
+
+    def get_id(self) -> str:
+        return self.id
+
+
+@pytest.fixture
+def login_app(app: Flask) -> Flask:
+    """Set up a Flask app with flask-login."""
+    # Set a secret key for the app
+    app.config["SECRET_KEY"] = "test-secret-key"
+
+    login_manager = LoginManager()
+    login_manager.init_app(app)
+
+    @login_manager.user_loader
+    def load_user(user_id: str) -> Optional[User]:
+        if user_id == "test_user":
+            return User("test_user")
+        return None
+
+    return app
+
+
+@pytest.fixture
+def test_user() -> User:
+    """Create a test user."""
+    return User("test_user")
+
+
+def test_current_user_not_accessible_across_threads(login_app: Flask, test_user: User):
+    """
+    Test that current_user is not accessible in a different thread without preserve_flask_contexts.
+
+    This test demonstrates that without the preserve_flask_contexts, we cannot access
+    current_user in a different thread, even with app_context.
+    """
+    # Log in the user in the main thread
+    with login_app.test_request_context():
+        login_user(test_user)
+        assert current_user.is_authenticated
+        assert current_user.id == "test_user"
+
+        # Store the result of the thread execution
+        result = {"user_accessible": True, "error": None}
+
+        # Define a function to run in a separate thread
+        def check_user_in_thread():
+            try:
+                # Try to access current_user in a different thread with app_context
+                with login_app.app_context():
+                    # This should fail because current_user is not accessible across threads
+                    # without preserve_flask_contexts
+                    result["user_accessible"] = current_user.is_authenticated
+            except Exception as e:
+                result["error"] = str(e)  # type: ignore
+
+        # Run the function in a separate thread
+        thread = threading.Thread(target=check_user_in_thread)
+        thread.start()
+        thread.join()
+
+        # Verify that we got an error or current_user is not authenticated
+        assert result["error"] is not None or (result["user_accessible"] is not None and not result["user_accessible"])
+
+
+def test_current_user_accessible_with_preserve_flask_contexts(login_app: Flask, test_user: User):
+    """
+    Test that current_user is accessible in a different thread with preserve_flask_contexts.
+
+    This test demonstrates that with the preserve_flask_contexts, we can access
+    current_user in a different thread.
+    """
+    # Log in the user in the main thread
+    with login_app.test_request_context():
+        login_user(test_user)
+        assert current_user.is_authenticated
+        assert current_user.id == "test_user"
+
+        # Save the context variables
+        context_vars = contextvars.copy_context()
+
+        # Store the result of the thread execution
+        result = {"user_accessible": False, "user_id": None, "error": None}
+
+        # Define a function to run in a separate thread
+        def check_user_in_thread_with_manager():
+            try:
+                # Use preserve_flask_contexts to access current_user in a different thread
+                with preserve_flask_contexts(login_app, context_vars):
+                    from flask_login import current_user
+
+                    if current_user:
+                        result["user_accessible"] = True
+                        result["user_id"] = current_user.id
+                    else:
+                        result["user_accessible"] = False
+            except Exception as e:
+                result["error"] = str(e)  # type: ignore
+
+        # Run the function in a separate thread
+        thread = threading.Thread(target=check_user_in_thread_with_manager)
+        thread.start()
+        thread.join()
+
+        # Verify that current_user is accessible and has the correct ID
+        assert result["error"] is None
+        assert result["user_accessible"] is True
+        assert result["user_id"] == "test_user"

From fc187d6998e818580aca23d7496dd457eb268a15 Mon Sep 17 00:00:00 2001
From: zxhlyh <jasonapring2015@outlook.com>
Date: Tue, 17 Jun 2025 17:37:06 +0800
Subject: [PATCH 11/11] chore: responsive header (#21115)

---
 .../workplace-selector/index.tsx              |  19 +-
 web/app/components/header/app-nav/index.tsx   |   4 +-
 .../components/header/dataset-nav/index.tsx   |   3 +-
 web/app/components/header/env-nav/index.tsx   |  10 +-
 .../components/header/explore-nav/index.tsx   |   8 +-
 web/app/components/header/index.tsx           | 124 ++++-----
 web/app/components/header/nav/index.tsx       |   8 +-
 .../header/nav/nav-selector/index.tsx         | 246 +++++++++---------
 web/app/components/header/tools-nav/index.tsx |   8 +-
 9 files changed, 211 insertions(+), 219 deletions(-)

diff --git a/web/app/components/header/account-dropdown/workplace-selector/index.tsx b/web/app/components/header/account-dropdown/workplace-selector/index.tsx
index 98668c61d2..f384cbc0bc 100644
--- a/web/app/components/header/account-dropdown/workplace-selector/index.tsx
+++ b/web/app/components/header/account-dropdown/workplace-selector/index.tsx
@@ -31,22 +31,22 @@ const WorkplaceSelector = () => {
   }
 
   return (
-    <Menu as="div" className="relative h-full w-full">
+    <Menu as="div" className="min-w-0">
       {
         ({ open }) => (
           <>
             <MenuButton className={cn(
               `
                 group flex w-full cursor-pointer items-center
-                gap-1.5 p-0.5 hover:bg-state-base-hover ${open && 'bg-state-base-hover'} rounded-[10px]
+                p-0.5 hover:bg-state-base-hover ${open && 'bg-state-base-hover'} rounded-[10px]
               `,
             )}>
-              <div className='flex h-6 w-6 items-center justify-center rounded-md bg-components-icon-bg-blue-solid text-[13px]'>
+              <div className='mr-1.5 flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-components-icon-bg-blue-solid text-[13px] max-[800px]:mr-0'>
                 <span className='h-6 bg-gradient-to-r from-components-avatar-shape-fill-stop-0 to-components-avatar-shape-fill-stop-100 bg-clip-text align-middle font-semibold uppercase leading-6 text-shadow-shadow-1 opacity-90'>{currentWorkspace?.name[0]?.toLocaleUpperCase()}</span>
               </div>
-              <div className='flex flex-row'>
-                <div className={'system-sm-medium max-w-[160px] truncate text-text-secondary'}>{currentWorkspace?.name}</div>
-                <RiArrowDownSLine className='h-4 w-4 text-text-secondary' />
+              <div className='flex min-w-0 items-center'>
+                <div className={'system-sm-medium min-w-0  max-w-[149px] truncate text-text-secondary max-[800px]:hidden'}>{currentWorkspace?.name}</div>
+                <RiArrowDownSLine className='h-4 w-4 shrink-0 text-text-secondary' />
               </div>
             </MenuButton>
             <Transition
@@ -59,10 +59,11 @@ const WorkplaceSelector = () => {
               leaveTo="transform opacity-0 scale-95"
             >
               <MenuItems
+                anchor="bottom start"
                 className={cn(
                   `
-                    shadows-shadow-lg absolute left-[-15px] mt-1 flex max-h-[400px] w-[280px] flex-col items-start overflow-y-auto rounded-xl
-                    bg-components-panel-bg-blur backdrop-blur-[5px]
+                    shadows-shadow-lg absolute left-[-15px] z-[1000] mt-1 flex max-h-[400px] w-[280px] flex-col items-start overflow-y-auto
+                    rounded-xl bg-components-panel-bg-blur backdrop-blur-[5px]
                   `,
                 )}
               >
@@ -73,7 +74,7 @@ const WorkplaceSelector = () => {
                   {
                     workspaces.map(workspace => (
                       <div className='flex items-center gap-2 self-stretch rounded-lg py-1 pl-3 pr-2 hover:bg-state-base-hover' key={workspace.id} onClick={() => handleSwitchWorkspace(workspace.id)}>
-                        <div className='flex h-6 w-6 items-center justify-center rounded-md bg-components-icon-bg-blue-solid text-[13px]'>
+                        <div className='flex h-6 w-6 shrink-0 items-center justify-center rounded-md bg-components-icon-bg-blue-solid text-[13px]'>
                           <span className='h-6 bg-gradient-to-r from-components-avatar-shape-fill-stop-0 to-components-avatar-shape-fill-stop-100 bg-clip-text align-middle font-semibold uppercase leading-6 text-shadow-shadow-1 opacity-90'>{workspace?.name[0]?.toLocaleUpperCase()}</span>
                         </div>
                         <div className='system-md-regular line-clamp-1 grow cursor-pointer overflow-hidden text-ellipsis text-text-secondary'>{workspace.name}</div>
diff --git a/web/app/components/header/app-nav/index.tsx b/web/app/components/header/app-nav/index.tsx
index 3b902811fc..4934ed3105 100644
--- a/web/app/components/header/app-nav/index.tsx
+++ b/web/app/components/header/app-nav/index.tsx
@@ -96,7 +96,7 @@ const AppNav = () => {
           link,
         }
       })
-      setNavItems(navItems)
+      setNavItems(navItems as any)
     }
   }, [appsData, isCurrentWorkspaceEditor, setNavItems])
 
@@ -122,7 +122,7 @@ const AppNav = () => {
         text={t('common.menus.apps')}
         activeSegment={['apps', 'app']}
         link='/apps'
-        curNav={appDetail}
+        curNav={appDetail as any}
         navs={navItems}
         createText={t('common.menus.newApp')}
         onCreate={openModal}
diff --git a/web/app/components/header/dataset-nav/index.tsx b/web/app/components/header/dataset-nav/index.tsx
index 4894a62484..85223f9f37 100644
--- a/web/app/components/header/dataset-nav/index.tsx
+++ b/web/app/components/header/dataset-nav/index.tsx
@@ -48,7 +48,7 @@ const DatasetNav = () => {
       text={t('common.menus.datasets')}
       activeSegment='datasets'
       link='/datasets'
-      curNav={currentDataset as Omit<NavItem, 'link'>}
+      curNav={currentDataset as any}
       navs={datasetItems.map(dataset => ({
         id: dataset.id,
         name: dataset.name,
@@ -59,6 +59,7 @@ const DatasetNav = () => {
       createText={t('common.menus.newDataset')}
       onCreate={() => router.push(`${basePath}/datasets/create`)}
       onLoadmore={handleLoadmore}
+      isApp={false}
     />
   )
 }
diff --git a/web/app/components/header/env-nav/index.tsx b/web/app/components/header/env-nav/index.tsx
index cec933a4c5..3f0b0f01dd 100644
--- a/web/app/components/header/env-nav/index.tsx
+++ b/web/app/components/header/env-nav/index.tsx
@@ -20,22 +20,22 @@ const EnvNav = () => {
 
   return (
     <div className={`
-      mr-4 flex h-[22px] items-center rounded-md border px-2 text-xs font-medium
+      mr-1 flex h-[22px] items-center rounded-md border px-2 text-xs font-medium
       ${headerEnvClassName[langeniusVersionInfo.current_env]}
     `}>
       {
         langeniusVersionInfo.current_env === 'TESTING' && (
           <>
-            <Beaker02 className='mr-1 h-3 w-3' />
-            {t('common.environment.testing')}
+            <Beaker02 className='h-3 w-3' />
+            <div className='ml-1 max-[1280px]:hidden'>{t('common.environment.testing')}</div>
           </>
         )
       }
       {
         langeniusVersionInfo.current_env === 'DEVELOPMENT' && (
           <>
-            <TerminalSquare className='mr-1 h-3 w-3' />
-            {t('common.environment.development')}
+            <TerminalSquare className='h-3 w-3' />
+            <div className='ml-1 max-[1280px]:hidden'>{t('common.environment.development')}</div>
           </>
         )
       }
diff --git a/web/app/components/header/explore-nav/index.tsx b/web/app/components/header/explore-nav/index.tsx
index b6ebf5d1a9..6896722a84 100644
--- a/web/app/components/header/explore-nav/index.tsx
+++ b/web/app/components/header/explore-nav/index.tsx
@@ -27,10 +27,12 @@ const ExploreNav = ({
     )}>
       {
         activated
-          ? <RiPlanetFill className='mr-2 h-4 w-4' />
-          : <RiPlanetLine className='mr-2 h-4 w-4' />
+          ? <RiPlanetFill className='h-4 w-4' />
+          : <RiPlanetLine className='h-4 w-4' />
       }
-      {t('common.menus.explore')}
+      <div className='ml-2 max-[1024px]:hidden'>
+        {t('common.menus.explore')}
+      </div>
     </Link>
   )
 }
diff --git a/web/app/components/header/index.tsx b/web/app/components/header/index.tsx
index a9c26e0070..48973e50a8 100644
--- a/web/app/components/header/index.tsx
+++ b/web/app/components/header/index.tsx
@@ -1,9 +1,6 @@
 'use client'
-import { useCallback, useEffect } from 'react'
+import { useCallback } from 'react'
 import Link from 'next/link'
-import { useBoolean } from 'ahooks'
-import { useSelectedLayoutSegment } from 'next/navigation'
-import { Bars3Icon } from '@heroicons/react/20/solid'
 import AccountDropdown from './account-dropdown'
 import AppNav from './app-nav'
 import DatasetNav from './dataset-nav'
@@ -24,17 +21,15 @@ import { Plan } from '../billing/type'
 import { useGlobalPublicStore } from '@/context/global-public-context'
 
 const navClassName = `
-  flex items-center relative mr-0 sm:mr-3 px-3 h-8 rounded-xl
+  flex items-center relative px-3 h-8 rounded-xl
   font-medium text-sm
   cursor-pointer
 `
 
 const Header = () => {
   const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator } = useAppContext()
-  const selectedSegment = useSelectedLayoutSegment()
   const media = useBreakpoints()
   const isMobile = media === MediaType.mobile
-  const [isShowNavMenu, { toggle, setFalse: hideNavMenu }] = useBoolean(false)
   const { enableBilling, plan } = useProviderContext()
   const { setShowPricingModal, setShowAccountSettingModal } = useModalContext()
   const systemFeatures = useGlobalPublicStore(s => s.systemFeatures)
@@ -46,23 +41,12 @@ const Header = () => {
       setShowAccountSettingModal({ payload: 'billing' })
   }, [isFreePlan, setShowAccountSettingModal, setShowPricingModal])
 
-  useEffect(() => {
-    hideNavMenu()
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedSegment])
-  return (
-    <div className='relative flex flex-1 items-center justify-between bg-background-body'>
-      <div className='flex items-center'>
-        {isMobile && <div
-          className='flex h-8 w-8 cursor-pointer items-center justify-center'
-          onClick={toggle}
-        >
-          <Bars3Icon className="h-4 w-4 text-gray-500" />
-        </div>}
-        {
-          !isMobile
-          && <div className='flex shrink-0 items-center gap-1.5 self-stretch pl-3'>
-            <Link href="/apps" className='flex h-8 shrink-0 items-center justify-center gap-2 px-0.5'>
+  if (isMobile) {
+    return (
+      <div className=''>
+        <div className='flex items-center justify-between px-2'>
+          <div className='flex items-center'>
+            <Link href="/apps" className='flex h-8 shrink-0 items-center justify-center px-0.5'>
               {systemFeatures.branding.enabled && systemFeatures.branding.workspace_logo
                 ? <img
                   src={systemFeatures.branding.workspace_logo}
@@ -71,59 +55,61 @@ const Header = () => {
                 />
                 : <DifyLogo />}
             </Link>
-            <div className='font-light text-divider-deep'>/</div>
-            <div className='flex items-center gap-0.5'>
-              <WorkspaceProvider>
-                <WorkplaceSelector />
-              </WorkspaceProvider>
-              {enableBilling ? <PlanBadge allowHover sandboxAsUpgrade plan={plan.type} onClick={handlePlanClick} /> : <LicenseNav />}
+            <div className='mx-1.5 shrink-0 font-light text-divider-deep'>/</div>
+            <WorkspaceProvider>
+              <WorkplaceSelector />
+            </WorkspaceProvider>
+            {enableBilling ? <PlanBadge allowHover sandboxAsUpgrade plan={plan.type} onClick={handlePlanClick} /> : <LicenseNav />}
+          </div>
+          <div className='flex items-center'>
+            <div className='mr-2'>
+              <PluginsNav />
             </div>
+            <AccountDropdown />
           </div>
-        }
-      </div >
-      {isMobile && (
-        <div className='flex'>
-          <Link href="/apps" className='mr-4 flex items-center'>
-            {systemFeatures.branding.enabled && systemFeatures.branding.workspace_logo
-              ? <img
-                src={systemFeatures.branding.workspace_logo}
-                className='block h-[22px] w-auto object-contain'
-                alt='logo'
-              />
-              : <DifyLogo />}
-          </Link>
-          <div className='font-light text-divider-deep'>/</div>
-          {enableBilling ? <PlanBadge allowHover sandboxAsUpgrade plan={plan.type} onClick={handlePlanClick} /> : <LicenseNav />}
-        </div >
-      )}
-      {
-        !isMobile && (
-          <div className='absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center'>
-            {!isCurrentWorkspaceDatasetOperator && <ExploreNav className={navClassName} />}
-            {!isCurrentWorkspaceDatasetOperator && <AppNav />}
-            {(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator) && <DatasetNav />}
-            {!isCurrentWorkspaceDatasetOperator && <ToolsNav className={navClassName} />}
-          </div>
-        )
-      }
-      <div className='flex shrink-0 items-center pr-3'>
+        </div>
+        <div className='my-1 flex items-center justify-center space-x-1'>
+          {!isCurrentWorkspaceDatasetOperator && <ExploreNav className={navClassName} />}
+          {!isCurrentWorkspaceDatasetOperator && <AppNav />}
+          {(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator) && <DatasetNav />}
+          {!isCurrentWorkspaceDatasetOperator && <ToolsNav className={navClassName} />}
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div className='flex h-[60px] items-center'>
+      <div className='flex min-w-0 flex-[1]  items-center pl-3 pr-2 min-[1280px]:pr-3'>
+        <Link href="/apps" className='flex h-8 shrink-0 items-center justify-center px-0.5'>
+          {systemFeatures.branding.enabled && systemFeatures.branding.workspace_logo
+            ? <img
+              src={systemFeatures.branding.workspace_logo}
+              className='block h-[22px] w-auto object-contain'
+              alt='logo'
+            />
+            : <DifyLogo />}
+        </Link>
+        <div className='mx-1.5 shrink-0 font-light text-divider-deep'>/</div>
+        <WorkspaceProvider>
+          <WorkplaceSelector />
+        </WorkspaceProvider>
+        {enableBilling ? <PlanBadge allowHover sandboxAsUpgrade plan={plan.type} onClick={handlePlanClick} /> : <LicenseNav />}
+      </div>
+      <div className='flex items-center space-x-2'>
+        {!isCurrentWorkspaceDatasetOperator && <ExploreNav className={navClassName} />}
+        {!isCurrentWorkspaceDatasetOperator && <AppNav />}
+        {(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator) && <DatasetNav />}
+        {!isCurrentWorkspaceDatasetOperator && <ToolsNav className={navClassName} />}
+      </div>
+      <div className='flex min-w-0 flex-[1] items-center justify-end pl-2 pr-3 min-[1280px]:pl-3'>
         <EnvNav />
         <div className='mr-2'>
           <PluginsNav />
         </div>
         <AccountDropdown />
       </div>
-      {
-        (isMobile && isShowNavMenu) && (
-          <div className='flex w-full flex-col gap-y-1 p-2'>
-            {!isCurrentWorkspaceDatasetOperator && <ExploreNav className={navClassName} />}
-            {!isCurrentWorkspaceDatasetOperator && <AppNav />}
-            {(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator) && <DatasetNav />}
-            {!isCurrentWorkspaceDatasetOperator && <ToolsNav className={navClassName} />}
-          </div>
-        )
-      }
-    </div >
+    </div>
   )
 }
 export default Header
diff --git a/web/app/components/header/nav/index.tsx b/web/app/components/header/nav/index.tsx
index 293c66a7b0..dc68b712cb 100644
--- a/web/app/components/header/nav/index.tsx
+++ b/web/app/components/header/nav/index.tsx
@@ -46,7 +46,7 @@ const Nav = ({
 
   return (
     <div className={`
-      mr-0 flex h-8 shrink-0 items-center rounded-xl px-0.5 text-sm font-medium sm:mr-3
+      flex h-8 max-w-[670px] shrink-0 items-center rounded-xl px-0.5 text-sm font-medium max-[1024px]:max-w-[400px]
       ${isActivated && 'bg-components-main-nav-nav-button-bg-active font-semibold shadow-md'}
       ${!curNav && !isActivated && 'hover:bg-components-main-nav-nav-button-bg-hover'}
     `}>
@@ -61,7 +61,7 @@ const Nav = ({
           onMouseEnter={() => setHovered(true)}
           onMouseLeave={() => setHovered(false)}
         >
-          <div className='mr-2'>
+          <div>
             {
               (hovered && curNav)
                 ? <ArrowNarrowLeft className='h-4 w-4' />
@@ -70,7 +70,9 @@ const Nav = ({
                   : icon
             }
           </div>
-          {text}
+          <div className='ml-2 max-[1024px]:hidden'>
+            {text}
+          </div>
         </div>
       </Link>
       {
diff --git a/web/app/components/header/nav/nav-selector/index.tsx b/web/app/components/header/nav/nav-selector/index.tsx
index 473abf03c1..77cf348da2 100644
--- a/web/app/components/header/nav/nav-selector/index.tsx
+++ b/web/app/components/header/nav/nav-selector/index.tsx
@@ -53,136 +53,134 @@ const NavSelector = ({ curNav, navs, createText, isApp, onCreate, onLoadmore }:
   }, 50), [])
 
   return (
-    <div className="">
-      <Menu as="div" className="relative inline-block text-left">
-        {({ open }) => (
-          <>
-            <MenuButton className={cn(
-              'hover:hover:bg-components-main-nav-nav-button-bg-active-hover group inline-flex h-7 w-full items-center justify-center rounded-[10px] pl-2 pr-2.5 text-[14px] font-semibold text-components-main-nav-nav-button-text-active',
-              open && 'bg-components-main-nav-nav-button-bg-active',
-            )}>
-              <div className='max-w-[180px] truncate' title={curNav?.name}>{curNav?.name}</div>
-              <RiArrowDownSLine
-                className={cn('ml-1 h-3 w-3 shrink-0 opacity-50 group-hover:opacity-100', open && '!opacity-100')}
-                aria-hidden="true"
-              />
-            </MenuButton>
-            <MenuItems
-              className="
-                absolute -left-11 right-0 mt-1.5 w-60 max-w-80
-                origin-top-right divide-y divide-divider-regular rounded-lg bg-components-panel-bg-blur
-                shadow-lg
-              "
-            >
-              <div className="overflow-auto px-1 py-1" style={{ maxHeight: '50vh' }} onScroll={handleScroll}>
-                {
-                  navs.map(nav => (
-                    <MenuItem key={nav.id}>
-                      <div className='flex w-full cursor-pointer items-center truncate rounded-lg px-3 py-[6px] text-[14px] font-normal text-text-secondary hover:bg-state-base-hover' onClick={() => {
-                        if (curNav?.id === nav.id)
-                          return
-                        setAppDetail()
-                        router.push(nav.link)
-                      }} title={nav.name}>
-                        <div className='relative mr-2 h-6 w-6 rounded-md'>
-                          <AppIcon size='tiny' iconType={nav.icon_type} icon={nav.icon} background={nav.icon_background} imageUrl={nav.icon_url} />
-                          {!!nav.mode && (
-                            <span className={cn(
-                              'absolute -bottom-0.5 -right-0.5 h-3.5 w-3.5 rounded border-[0.5px] border-[rgba(0,0,0,0.02)] bg-white p-0.5 shadow-sm',
-                            )}>
-                              {nav.mode === 'advanced-chat' && (
-                                <ChatBot className='h-2.5 w-2.5 text-[#1570EF]' />
-                              )}
-                              {nav.mode === 'agent-chat' && (
-                                <CuteRobot className='h-2.5 w-2.5 text-indigo-600' />
-                              )}
-                              {nav.mode === 'chat' && (
-                                <ChatBot className='h-2.5 w-2.5 text-[#1570EF]' />
-                              )}
-                              {nav.mode === 'completion' && (
-                                <AiText className='h-2.5 w-2.5 text-[#0E9384]' />
-                              )}
-                              {nav.mode === 'workflow' && (
-                                <Route className='h-2.5 w-2.5 text-[#f79009]' />
-                              )}
-                            </span>
-                          )}
-                        </div>
-                        <div className='truncate'>
-                          {nav.name}
-                        </div>
+    <Menu as="div" className="relative">
+      {({ open }) => (
+        <>
+          <MenuButton className={cn(
+            'hover:hover:bg-components-main-nav-nav-button-bg-active-hover group inline-flex h-7 w-full items-center justify-center rounded-[10px] pl-2 pr-2.5 text-[14px] font-semibold text-components-main-nav-nav-button-text-active',
+            open && 'bg-components-main-nav-nav-button-bg-active',
+          )}>
+            <div className='max-w-[157px] truncate' title={curNav?.name}>{curNav?.name}</div>
+            <RiArrowDownSLine
+              className={cn('ml-1 h-3 w-3 shrink-0 opacity-50 group-hover:opacity-100', open && '!opacity-100')}
+              aria-hidden="true"
+            />
+          </MenuButton>
+          <MenuItems
+            className="
+              absolute -left-11 right-0 mt-1.5 w-60 max-w-80
+              origin-top-right divide-y divide-divider-regular rounded-lg bg-components-panel-bg-blur
+              shadow-lg
+            "
+          >
+            <div className="overflow-auto px-1 py-1" style={{ maxHeight: '50vh' }} onScroll={handleScroll}>
+              {
+                navs.map(nav => (
+                  <MenuItem key={nav.id}>
+                    <div className='flex w-full cursor-pointer items-center truncate rounded-lg px-3 py-[6px] text-[14px] font-normal text-text-secondary hover:bg-state-base-hover' onClick={() => {
+                      if (curNav?.id === nav.id)
+                        return
+                      setAppDetail()
+                      router.push(nav.link)
+                    }} title={nav.name}>
+                      <div className='relative mr-2 h-6 w-6 rounded-md'>
+                        <AppIcon size='tiny' iconType={nav.icon_type} icon={nav.icon} background={nav.icon_background} imageUrl={nav.icon_url} />
+                        {!!nav.mode && (
+                          <span className={cn(
+                            'absolute -bottom-0.5 -right-0.5 h-3.5 w-3.5 rounded border-[0.5px] border-[rgba(0,0,0,0.02)] bg-white p-0.5 shadow-sm',
+                          )}>
+                            {nav.mode === 'advanced-chat' && (
+                              <ChatBot className='h-2.5 w-2.5 text-[#1570EF]' />
+                            )}
+                            {nav.mode === 'agent-chat' && (
+                              <CuteRobot className='h-2.5 w-2.5 text-indigo-600' />
+                            )}
+                            {nav.mode === 'chat' && (
+                              <ChatBot className='h-2.5 w-2.5 text-[#1570EF]' />
+                            )}
+                            {nav.mode === 'completion' && (
+                              <AiText className='h-2.5 w-2.5 text-[#0E9384]' />
+                            )}
+                            {nav.mode === 'workflow' && (
+                              <Route className='h-2.5 w-2.5 text-[#f79009]' />
+                            )}
+                          </span>
+                        )}
+                      </div>
+                      <div className='truncate'>
+                        {nav.name}
                       </div>
-                    </MenuItem>
-                  ))
-                }
-              </div>
-              {!isApp && isCurrentWorkspaceEditor && (
-                <MenuItem as="div" className='w-full p-1'>
-                  <div onClick={() => onCreate('')} className={cn(
-                    'flex cursor-pointer items-center gap-2 rounded-lg px-3 py-[6px] hover:bg-state-base-hover ',
-                  )}>
-                    <div className='flex h-6 w-6 shrink-0 items-center justify-center rounded-[6px] border-[0.5px] border-divider-regular bg-background-default'>
-                      <RiAddLine className='h-4 w-4 text-text-primary' />
                     </div>
-                    <div className='grow text-left text-[14px] font-normal text-text-secondary'>{createText}</div>
+                  </MenuItem>
+                ))
+              }
+            </div>
+            {!isApp && isCurrentWorkspaceEditor && (
+              <MenuItem as="div" className='w-full p-1'>
+                <div onClick={() => onCreate('')} className={cn(
+                  'flex cursor-pointer items-center gap-2 rounded-lg px-3 py-[6px] hover:bg-state-base-hover ',
+                )}>
+                  <div className='flex h-6 w-6 shrink-0 items-center justify-center rounded-[6px] border-[0.5px] border-divider-regular bg-background-default'>
+                    <RiAddLine className='h-4 w-4 text-text-primary' />
                   </div>
-                </MenuItem>
-              )}
-              {isApp && isCurrentWorkspaceEditor && (
-                <Menu as="div" className="relative h-full w-full">
-                  {({ open }) => (
-                    <>
-                      <MenuButton className='w-full p-1'>
-                        <div className={cn(
-                          'flex cursor-pointer items-center gap-2 rounded-lg px-3 py-[6px] hover:bg-state-base-hover',
-                          open && '!bg-state-base-hover',
-                        )}>
-                          <div className='flex h-6 w-6 shrink-0 items-center justify-center rounded-[6px] border-[0.5px] border-divider-regular bg-background-default'>
-                            <RiAddLine className='h-4 w-4 text-text-primary' />
-                          </div>
-                          <div className='grow text-left text-[14px] font-normal text-text-secondary'>{createText}</div>
-                          <RiArrowRightSLine className='h-3.5 w-3.5 shrink-0 text-text-primary' />
+                  <div className='grow text-left text-[14px] font-normal text-text-secondary'>{createText}</div>
+                </div>
+              </MenuItem>
+            )}
+            {isApp && isCurrentWorkspaceEditor && (
+              <Menu as="div" className="relative h-full w-full">
+                {({ open }) => (
+                  <>
+                    <MenuButton className='w-full p-1'>
+                      <div className={cn(
+                        'flex cursor-pointer items-center gap-2 rounded-lg px-3 py-[6px] hover:bg-state-base-hover',
+                        open && '!bg-state-base-hover',
+                      )}>
+                        <div className='flex h-6 w-6 shrink-0 items-center justify-center rounded-[6px] border-[0.5px] border-divider-regular bg-background-default'>
+                          <RiAddLine className='h-4 w-4 text-text-primary' />
                         </div>
-                      </MenuButton>
-                      <Transition
-                        as={Fragment}
-                        enter="transition ease-out duration-100"
-                        enterFrom="transform opacity-0 scale-95"
-                        enterTo="transform opacity-100 scale-100"
-                        leave="transition ease-in duration-75"
-                        leaveFrom="transform opacity-100 scale-100"
-                        leaveTo="transform opacity-0 scale-95"
-                      >
-                        <MenuItems className={cn(
-                          'absolute right-[-198px] top-[3px] z-10 min-w-[200px] rounded-lg bg-components-panel-bg-blur shadow-lg',
-                        )}>
-                          <div className='p-1'>
-                            <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('blank')}>
-                              <FilePlus01 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
-                              {t('app.newApp.startFromBlank')}
-                            </div>
-                            <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('template')}>
-                              <FilePlus02 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
-                              {t('app.newApp.startFromTemplate')}
-                            </div>
+                        <div className='grow text-left text-[14px] font-normal text-text-secondary'>{createText}</div>
+                        <RiArrowRightSLine className='h-3.5 w-3.5 shrink-0 text-text-primary' />
+                      </div>
+                    </MenuButton>
+                    <Transition
+                      as={Fragment}
+                      enter="transition ease-out duration-100"
+                      enterFrom="transform opacity-0 scale-95"
+                      enterTo="transform opacity-100 scale-100"
+                      leave="transition ease-in duration-75"
+                      leaveFrom="transform opacity-100 scale-100"
+                      leaveTo="transform opacity-0 scale-95"
+                    >
+                      <MenuItems className={cn(
+                        'absolute right-[-198px] top-[3px] z-10 min-w-[200px] rounded-lg bg-components-panel-bg-blur shadow-lg',
+                      )}>
+                        <div className='p-1'>
+                          <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('blank')}>
+                            <FilePlus01 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
+                            {t('app.newApp.startFromBlank')}
                           </div>
-                          <div className='border-t border-divider-regular p-1'>
-                            <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('dsl')}>
-                              <FileArrow01 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
-                              {t('app.importDSL')}
-                            </div>
+                          <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('template')}>
+                            <FilePlus02 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
+                            {t('app.newApp.startFromTemplate')}
                           </div>
-                        </MenuItems>
-                      </Transition>
-                    </>
-                  )}
-                </Menu>
-              )}
-            </MenuItems>
-          </>
-        )}
-      </Menu>
-    </div>
+                        </div>
+                        <div className='border-t border-divider-regular p-1'>
+                          <div className={cn('flex cursor-pointer items-center rounded-lg px-3 py-[6px] font-normal text-text-secondary hover:bg-state-base-hover')} onClick={() => onCreate('dsl')}>
+                            <FileArrow01 className='mr-2 h-4 w-4 shrink-0 text-text-secondary' />
+                            {t('app.importDSL')}
+                          </div>
+                        </div>
+                      </MenuItems>
+                    </Transition>
+                  </>
+                )}
+              </Menu>
+            )}
+          </MenuItems>
+        </>
+      )}
+    </Menu>
   )
 }
 
diff --git a/web/app/components/header/tools-nav/index.tsx b/web/app/components/header/tools-nav/index.tsx
index b87398708c..bc9351cf70 100644
--- a/web/app/components/header/tools-nav/index.tsx
+++ b/web/app/components/header/tools-nav/index.tsx
@@ -28,10 +28,12 @@ const ToolsNav = ({
     )}>
       {
         activated
-          ? <RiHammerFill className='mr-2 h-4 w-4' />
-          : <RiHammerLine className='mr-2 h-4 w-4' />
+          ? <RiHammerFill className='h-4 w-4' />
+          : <RiHammerLine className='h-4 w-4' />
       }
-      {t('common.menus.tools')}
+      <div className='ml-2 max-[1024px]:hidden'>
+        {t('common.menus.tools')}
+      </div>
     </Link>
   )
 }