diff --git a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/develop/page.tsx b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/develop/page.tsx
index 415d82285..11335b270 100644
--- a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/develop/page.tsx
+++ b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/develop/page.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import type { Locale } from '@/i18n'
+import type { Locale } from '@/i18n-config'
 import DevelopMain from '@/app/components/develop'
 
 export type IDevelopProps = {
diff --git a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/settings/page.tsx b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/settings/page.tsx
index d9a196d85..688f2c9fc 100644
--- a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/settings/page.tsx
+++ b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/settings/page.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { getLocaleOnServer, useTranslation as translate } from '@/i18n/server'
+import { getLocaleOnServer, useTranslation as translate } from '@/i18n-config/server'
 import Form from '@/app/components/datasets/settings/form'
 
 const Settings = async () => {
diff --git a/web/app/(commonLayout)/datasets/Doc.tsx b/web/app/(commonLayout)/datasets/Doc.tsx
index efdfe157f..042a90f4a 100644
--- a/web/app/(commonLayout)/datasets/Doc.tsx
+++ b/web/app/(commonLayout)/datasets/Doc.tsx
@@ -8,7 +8,7 @@ import TemplateEn from './template/template.en.mdx'
 import TemplateZh from './template/template.zh.mdx'
 import TemplateJa from './template/template.ja.mdx'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import useTheme from '@/hooks/use-theme'
 import { Theme } from '@/types/app'
 import cn from '@/utils/classnames'
diff --git a/web/app/(commonLayout)/plugins/page.tsx b/web/app/(commonLayout)/plugins/page.tsx
index 47f279107..d07c4307a 100644
--- a/web/app/(commonLayout)/plugins/page.tsx
+++ b/web/app/(commonLayout)/plugins/page.tsx
@@ -1,7 +1,7 @@
 import PluginPage from '@/app/components/plugins/plugin-page'
 import PluginsPanel from '@/app/components/plugins/plugin-page/plugins-panel'
 import Marketplace from '@/app/components/plugins/marketplace'
-import { getLocaleOnServer } from '@/i18n/server'
+import { getLocaleOnServer } from '@/i18n-config/server'
 
 const PluginList = async () => {
   const locale = await getLocaleOnServer()
diff --git a/web/app/components/app/annotation/batch-add-annotation-modal/csv-downloader.tsx b/web/app/components/app/annotation/batch-add-annotation-modal/csv-downloader.tsx
index 8fb42e194..13f8fa0b6 100644
--- a/web/app/components/app/annotation/batch-add-annotation-modal/csv-downloader.tsx
+++ b/web/app/components/app/annotation/batch-add-annotation-modal/csv-downloader.tsx
@@ -8,7 +8,7 @@ import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import { Download02 as DownloadIcon } from '@/app/components/base/icons/src/vender/solid/general'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 const CSV_TEMPLATE_QA_EN = [
   ['question', 'answer'],
diff --git a/web/app/components/app/annotation/header-opts/index.tsx b/web/app/components/app/annotation/header-opts/index.tsx
index eb397db55..b076a35e2 100644
--- a/web/app/components/app/annotation/header-opts/index.tsx
+++ b/web/app/components/app/annotation/header-opts/index.tsx
@@ -22,7 +22,7 @@ import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows
 
 import I18n from '@/context/i18n'
 import { fetchExportAnnotationList } from '@/service/annotation'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 const CSV_HEADER_QA_EN = ['Question', 'Answer']
 const CSV_HEADER_QA_CN = ['问题', '答案']
diff --git a/web/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool.tsx b/web/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool.tsx
index 92f1525bd..dad5441a5 100644
--- a/web/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool.tsx
+++ b/web/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool.tsx
@@ -21,7 +21,7 @@ import type { Collection, Tool } from '@/app/components/tools/types'
 import { CollectionType } from '@/app/components/tools/types'
 import { fetchBuiltInToolList, fetchCustomToolList, fetchModelToolList, fetchWorkflowToolList } from '@/service/tools'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import cn from '@/utils/classnames'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
 import {
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 3fd020f60..ceb53ac0b 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
@@ -12,7 +12,7 @@ import { BookOpen01 } from '@/app/components/base/icons/src/vender/line/educatio
 import { fetchCodeBasedExtensionList } from '@/service/common'
 import { SimpleSelect } from '@/app/components/base/select'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import type {
   CodeBasedExtensionItem,
   ExternalDataTool,
diff --git a/web/app/components/app/overview/settings/index.tsx b/web/app/components/app/overview/settings/index.tsx
index 524c340a5..8c619a288 100644
--- a/web/app/components/app/overview/settings/index.tsx
+++ b/web/app/components/app/overview/settings/index.tsx
@@ -18,7 +18,7 @@ import { SimpleSelect } from '@/app/components/base/select'
 import type { AppDetailResponse } from '@/models/app'
 import type { AppIconType, AppSSO, Language } from '@/types/app'
 import { useToastContext } from '@/app/components/base/toast'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 import Tooltip from '@/app/components/base/tooltip'
 import { useProviderContext } from '@/context/provider-context'
 import { useModalContext } from '@/context/modal-context'
diff --git a/web/app/components/base/chat/chat-with-history/hooks.tsx b/web/app/components/base/chat/chat-with-history/hooks.tsx
index 248c161e6..76eb89164 100644
--- a/web/app/components/base/chat/chat-with-history/hooks.tsx
+++ b/web/app/components/base/chat/chat-with-history/hooks.tsx
@@ -35,7 +35,7 @@ import type {
   ConversationItem,
 } from '@/models/share'
 import { useToastContext } from '@/app/components/base/toast'
-import { changeLanguage } from '@/i18n/i18next-config'
+import { changeLanguage } from '@/i18n-config/i18next-config'
 import { useAppFavicon } from '@/hooks/use-app-favicon'
 import { InputVarType } from '@/app/components/workflow/types'
 import { TransferMethod } from '@/types/app'
diff --git a/web/app/components/base/chat/embedded-chatbot/hooks.tsx b/web/app/components/base/chat/embedded-chatbot/hooks.tsx
index 7dd665efd..8ae86bda8 100644
--- a/web/app/components/base/chat/embedded-chatbot/hooks.tsx
+++ b/web/app/components/base/chat/embedded-chatbot/hooks.tsx
@@ -31,7 +31,7 @@ import type {
   ConversationItem,
 } from '@/models/share'
 import { useToastContext } from '@/app/components/base/toast'
-import { changeLanguage } from '@/i18n/i18next-config'
+import { changeLanguage } from '@/i18n-config/i18next-config'
 import { InputVarType } from '@/app/components/workflow/types'
 import { TransferMethod } from '@/types/app'
 import { addFileInfos, sortAgentSorts } from '@/app/components/tools/utils'
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 3ede2d7c6..095137203 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
@@ -19,7 +19,7 @@ import {
 } from '@/service/common'
 import type { CodeBasedExtensionItem } from '@/models/common'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import { InfoCircle } from '@/app/components/base/icons/src/vender/line/general'
 import { useModalContext } from '@/context/modal-context'
 import { CustomConfigurationStatusEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
diff --git a/web/app/components/base/features/new-feature-panel/text-to-speech/index.tsx b/web/app/components/base/features/new-feature-panel/text-to-speech/index.tsx
index 39f77f6c9..340f9ae62 100644
--- a/web/app/components/base/features/new-feature-panel/text-to-speech/index.tsx
+++ b/web/app/components/base/features/new-feature-panel/text-to-speech/index.tsx
@@ -9,7 +9,7 @@ import VoiceSettings from '@/app/components/base/features/new-feature-panel/text
 import { useFeatures, useFeaturesStore } from '@/app/components/base/features/hooks'
 import type { OnFeaturesChange } from '@/app/components/base/features/types'
 import { FeatureEnum } from '@/app/components/base/features/types'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 import { TtsAutoPlay } from '@/types/app'
 
 type Props = {
diff --git a/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx b/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx
index 57659d605..6e93c0c87 100644
--- a/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx
+++ b/web/app/components/base/features/new-feature-panel/text-to-speech/param-config-content.tsx
@@ -13,7 +13,7 @@ import { fetchAppVoices } from '@/service/apps'
 import Tooltip from '@/app/components/base/tooltip'
 import Switch from '@/app/components/base/switch'
 import AudioBtn from '@/app/components/base/audio-btn'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 import { TtsAutoPlay } from '@/types/app'
 import type { OnFeaturesChange } from '@/app/components/base/features/types'
 import classNames from '@/utils/classnames'
diff --git a/web/app/components/datasets/create/file-uploader/index.tsx b/web/app/components/datasets/create/file-uploader/index.tsx
index 5ed4b7dd0..65b26e745 100644
--- a/web/app/components/datasets/create/file-uploader/index.tsx
+++ b/web/app/components/datasets/create/file-uploader/index.tsx
@@ -14,7 +14,7 @@ import { upload } from '@/service/base'
 import { fetchFileUploadConfig } from '@/service/common'
 import { fetchSupportFileTypes } from '@/service/datasets'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import { IS_CE_EDITION } from '@/config'
 import { Theme } from '@/types/app'
 import useTheme from '@/hooks/use-theme'
diff --git a/web/app/components/datasets/create/step-two/index.tsx b/web/app/components/datasets/create/step-two/index.tsx
index ebd8552a9..461a56157 100644
--- a/web/app/components/datasets/create/step-two/index.tsx
+++ b/web/app/components/datasets/create/step-two/index.tsx
@@ -47,7 +47,7 @@ import I18n from '@/context/i18n'
 import { RETRIEVE_METHOD } from '@/types/app'
 import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
 import { useDefaultModel, useModelList, useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
 import type { DefaultModel } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
@@ -405,7 +405,6 @@ const StepTwo = ({
       score_threshold_enabled: false,
       score_threshold: 0.5,
     })
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [rerankDefaultModel, isRerankDefaultModelValid])
 
   const getCreationParams = () => {
@@ -596,7 +595,6 @@ const StepTwo = ({
       getRulesFromDetail()
       getDefaultMode()
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
   useEffect(() => {
diff --git a/web/app/components/datasets/create/step-two/language-select/index.tsx b/web/app/components/datasets/create/step-two/language-select/index.tsx
index 0e6bae9a8..2fd8c143f 100644
--- a/web/app/components/datasets/create/step-two/language-select/index.tsx
+++ b/web/app/components/datasets/create/step-two/language-select/index.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import { RiArrowDownSLine, RiCheckLine } from '@remixicon/react'
 import cn from '@/utils/classnames'
 import Popover from '@/app/components/base/popover'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 
 export type ILanguageSelectProps = {
   currentLanguage: string
diff --git a/web/app/components/datasets/documents/detail/batch-modal/csv-downloader.tsx b/web/app/components/datasets/documents/detail/batch-modal/csv-downloader.tsx
index 7f3be965b..85cdfc0cc 100644
--- a/web/app/components/datasets/documents/detail/batch-modal/csv-downloader.tsx
+++ b/web/app/components/datasets/documents/detail/batch-modal/csv-downloader.tsx
@@ -9,7 +9,7 @@ import { useContext } from 'use-context-selector'
 import { Download02 as DownloadIcon } from '@/app/components/base/icons/src/vender/solid/general'
 import { ChunkingMode } from '@/models/datasets'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 const CSV_TEMPLATE_QA_EN = [
   ['question', 'answer'],
diff --git a/web/app/components/develop/doc.tsx b/web/app/components/develop/doc.tsx
index c61cc0986..65e6d4aec 100644
--- a/web/app/components/develop/doc.tsx
+++ b/web/app/components/develop/doc.tsx
@@ -16,7 +16,7 @@ import TemplateChatEn from './template/template_chat.en.mdx'
 import TemplateChatZh from './template/template_chat.zh.mdx'
 import TemplateChatJa from './template/template_chat.ja.mdx'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import useTheme from '@/hooks/use-theme'
 import { Theme } from '@/types/app'
 import cn from '@/utils/classnames'
diff --git a/web/app/components/header/account-setting/language-page/index.tsx b/web/app/components/header/account-setting/language-page/index.tsx
index 7d3e09fc2..bf3537b5d 100644
--- a/web/app/components/header/account-setting/language-page/index.tsx
+++ b/web/app/components/header/account-setting/language-page/index.tsx
@@ -10,7 +10,7 @@ import { updateUserProfile } from '@/service/common'
 import { ToastContext } from '@/app/components/base/toast'
 import I18n from '@/context/i18n'
 import { timezones } from '@/utils/timezone'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 
 const titleClassName = `
   mb-2 system-sm-semibold text-text-secondary
diff --git a/web/app/components/header/account-setting/members-page/index.tsx b/web/app/components/header/account-setting/members-page/index.tsx
index 8b536cbe4..6b4da2208 100644
--- a/web/app/components/header/account-setting/members-page/index.tsx
+++ b/web/app/components/header/account-setting/members-page/index.tsx
@@ -20,7 +20,7 @@ import { Plan } from '@/app/components/billing/type'
 import Button from '@/app/components/base/button'
 import UpgradeBtn from '@/app/components/billing/upgrade-btn'
 import { NUM_INFINITE } from '@/app/components/billing/config'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 import cn from '@/utils/classnames'
 import Tooltip from '@/app/components/base/tooltip'
 import { RiPencilLine } from '@remixicon/react'
diff --git a/web/app/components/header/account-setting/model-provider-page/install-from-marketplace.tsx b/web/app/components/header/account-setting/model-provider-page/install-from-marketplace.tsx
index c60a769e4..7e9cad23e 100644
--- a/web/app/components/header/account-setting/model-provider-page/install-from-marketplace.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/install-from-marketplace.tsx
@@ -18,7 +18,7 @@ import ProviderCard from '@/app/components/plugins/provider-card'
 import List from '@/app/components/plugins/marketplace/list'
 import type { Plugin } from '@/app/components/plugins/types'
 import cn from '@/utils/classnames'
-import { getLocaleOnClient } from '@/i18n'
+import { getLocaleOnClient } from '@/i18n-config'
 import { getMarketplaceUrl } from '@/utils/var'
 
 type InstallFromMarketplaceProps = {
diff --git a/web/app/components/header/account-setting/model-provider-page/model-icon/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-icon/index.tsx
index df9a9cbcf..f6fb1dc6f 100644
--- a/web/app/components/header/account-setting/model-provider-page/model-icon/index.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/model-icon/index.tsx
@@ -7,7 +7,7 @@ import { useLanguage } from '../hooks'
 import { Group } from '@/app/components/base/icons/src/vender/other'
 import { OpenaiBlue, OpenaiTeal, OpenaiViolet, OpenaiYellow } from '@/app/components/base/icons/src/public/llm'
 import cn from '@/utils/classnames'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 
 type ModelIconProps = {
   provider?: Model | ModelProvider
diff --git a/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx b/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx
index 253269d92..220c43c9d 100644
--- a/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/provider-icon/index.tsx
@@ -3,7 +3,7 @@ import type { ModelProvider } from '../declarations'
 import { useLanguage } from '../hooks'
 import { Openai } from '@/app/components/base/icons/src/vender/other'
 import { AnthropicDark, AnthropicLight } from '@/app/components/base/icons/src/public/llm'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 import { Theme } from '@/types/app'
 import cn from '@/utils/classnames'
 import useTheme from '@/hooks/use-theme'
diff --git a/web/app/components/header/maintenance-notice.tsx b/web/app/components/header/maintenance-notice.tsx
index f9c00dd01..4bb4ef7f7 100644
--- a/web/app/components/header/maintenance-notice.tsx
+++ b/web/app/components/header/maintenance-notice.tsx
@@ -1,6 +1,6 @@
 import { useState } from 'react'
 import { X } from '@/app/components/base/icons/src/vender/line/general'
-import { NOTICE_I18N } from '@/i18n/language'
+import { NOTICE_I18N } from '@/i18n-config/language'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 
 const MaintenanceNotice = () => {
diff --git a/web/app/components/i18n-server.tsx b/web/app/components/i18n-server.tsx
index 78d5ca486..b3ec42dd8 100644
--- a/web/app/components/i18n-server.tsx
+++ b/web/app/components/i18n-server.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import I18N from './i18n'
 import { ToastProvider } from './base/toast'
-import { getLocaleOnServer } from '@/i18n/server'
+import { getLocaleOnServer } from '@/i18n-config/server'
 
 export type II18NServerProps = {
   children: React.ReactNode
diff --git a/web/app/components/i18n.tsx b/web/app/components/i18n.tsx
index 374b1f608..10ae66da4 100644
--- a/web/app/components/i18n.tsx
+++ b/web/app/components/i18n.tsx
@@ -3,8 +3,8 @@
 import type { FC } from 'react'
 import React, { useEffect, useState } from 'react'
 import I18NContext from '@/context/i18n'
-import type { Locale } from '@/i18n'
-import { setLocaleOnClient } from '@/i18n'
+import type { Locale } from '@/i18n-config'
+import { setLocaleOnClient } from '@/i18n-config'
 import Loading from './base/loading'
 import { usePrefetchQuery } from '@tanstack/react-query'
 import { getSystemFeatures } from '@/service/common'
diff --git a/web/app/components/plugins/card/index.tsx b/web/app/components/plugins/card/index.tsx
index bdb3705f6..34951275e 100644
--- a/web/app/components/plugins/card/index.tsx
+++ b/web/app/components/plugins/card/index.tsx
@@ -9,9 +9,9 @@ import Description from './base/description'
 import Placeholder from './base/placeholder'
 import cn from '@/utils/classnames'
 import { useGetLanguage } from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import { useSingleCategories } from '../hooks'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 import { useMixedTranslation } from '@/app/components/plugins/marketplace/hooks'
 import Partner from '../base/badges/partner'
 import Verified from '../base/badges/verified'
diff --git a/web/app/components/plugins/marketplace/description/index.tsx b/web/app/components/plugins/marketplace/description/index.tsx
index 68a465d29..d4749cbbd 100644
--- a/web/app/components/plugins/marketplace/description/index.tsx
+++ b/web/app/components/plugins/marketplace/description/index.tsx
@@ -1,7 +1,7 @@
 import {
   getLocaleOnServer,
   useTranslation as translate,
-} from '@/i18n/server'
+} from '@/i18n-config/server'
 
 type DescriptionProps = {
   locale?: string
diff --git a/web/app/components/plugins/marketplace/hooks.ts b/web/app/components/plugins/marketplace/hooks.ts
index c581ee0d9..45a113030 100644
--- a/web/app/components/plugins/marketplace/hooks.ts
+++ b/web/app/components/plugins/marketplace/hooks.ts
@@ -17,7 +17,7 @@ import {
   getFormattedPlugin,
   getMarketplaceCollectionsAndPlugins,
 } from './utils'
-import i18n from '@/i18n/i18next-config'
+import i18n from '@/i18n-config/i18next-config'
 import {
   useMutationPluginsFromMarketplace,
 } from '@/service/use-plugins'
@@ -109,6 +109,7 @@ export const useMarketplacePlugins = () => {
 export const useMixedTranslation = (localeFromOuter?: string) => {
   let t = useTranslation().t
 
+  // !localeFromOuter only support zh-Hans and en-US for now
   if (localeFromOuter)
     t = i18n.getFixedT(localeFromOuter)
 
@@ -121,8 +122,6 @@ export const useMarketplaceContainerScroll = (
   callback: () => void,
   scrollContainerId = 'marketplace-container',
 ) => {
-  const container = document.getElementById(scrollContainerId)
-
   const handleScroll = useCallback((e: Event) => {
     const target = e.target as HTMLDivElement
     const {
@@ -135,6 +134,7 @@ export const useMarketplaceContainerScroll = (
   }, [callback])
 
   useEffect(() => {
+    const container = document.getElementById(scrollContainerId)
     if (container)
       container.addEventListener('scroll', handleScroll)
 
@@ -142,7 +142,7 @@ export const useMarketplaceContainerScroll = (
       if (container)
         container.removeEventListener('scroll', handleScroll)
     }
-  }, [container, handleScroll])
+  }, [handleScroll])
 }
 
 export const useSearchBoxAutoAnimate = (searchBoxAutoAnimate?: boolean) => {
diff --git a/web/app/components/plugins/marketplace/intersection-line/hooks.ts b/web/app/components/plugins/marketplace/intersection-line/hooks.ts
index fe30b707c..0104cc626 100644
--- a/web/app/components/plugins/marketplace/intersection-line/hooks.ts
+++ b/web/app/components/plugins/marketplace/intersection-line/hooks.ts
@@ -2,7 +2,7 @@ import { useEffect } from 'react'
 import { useMarketplaceContext } from '@/app/components/plugins/marketplace/context'
 
 export const useScrollIntersection = (
-  anchorRef: React.RefObject<HTMLDivElement>,
+  anchorRef: React.RefObject<HTMLDivElement | null>,
   intersectionContainerId = 'marketplace-container',
 ) => {
   const intersected = useMarketplaceContext(v => v.intersected)
diff --git a/web/app/components/plugins/marketplace/list/list-with-collection.tsx b/web/app/components/plugins/marketplace/list/list-with-collection.tsx
index 4c396c565..7c8a30f49 100644
--- a/web/app/components/plugins/marketplace/list/list-with-collection.tsx
+++ b/web/app/components/plugins/marketplace/list/list-with-collection.tsx
@@ -4,7 +4,7 @@ import { RiArrowRightSLine } from '@remixicon/react'
 import type { MarketplaceCollection } from '../types'
 import CardWrapper from './card-wrapper'
 import type { Plugin } from '@/app/components/plugins/types'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import cn from '@/utils/classnames'
 import type { SearchParamsFromCollection } from '@/app/components/plugins/marketplace/types'
 import { useMixedTranslation } from '@/app/components/plugins/marketplace/hooks'
diff --git a/web/app/components/plugins/marketplace/search-box/index.tsx b/web/app/components/plugins/marketplace/search-box/index.tsx
index 5f19afbba..5c6f04e3b 100644
--- a/web/app/components/plugins/marketplace/search-box/index.tsx
+++ b/web/app/components/plugins/marketplace/search-box/index.tsx
@@ -8,6 +8,7 @@ import { RiAddLine } from '@remixicon/react'
 type SearchBoxProps = {
   search: string
   onSearchChange: (search: string) => void
+  wrapperClassName?: string
   inputClassName?: string
   tags: string[]
   onTagsChange: (tags: string[]) => void
@@ -21,6 +22,7 @@ type SearchBoxProps = {
 const SearchBox = ({
   search,
   onSearchChange,
+  wrapperClassName,
   inputClassName,
   tags,
   onTagsChange,
@@ -32,7 +34,7 @@ const SearchBox = ({
 }: SearchBoxProps) => {
   return (
     <div
-      className='z-[11] flex items-center'
+      className={cn('z-[11] flex items-center', wrapperClassName)}
     >
       <div className={
         cn('flex items-center',
diff --git a/web/app/components/plugins/marketplace/search-box/search-box-wrapper.tsx b/web/app/components/plugins/marketplace/search-box/search-box-wrapper.tsx
index 772bd4c2e..0a63361af 100644
--- a/web/app/components/plugins/marketplace/search-box/search-box-wrapper.tsx
+++ b/web/app/components/plugins/marketplace/search-box/search-box-wrapper.tsx
@@ -26,11 +26,12 @@ const SearchBoxWrapper = ({
 
   return (
     <SearchBox
-      inputClassName={cn(
+      wrapperClassName={cn(
         'z-[0] mx-auto w-[640px] shrink-0',
         searchBoxCanAnimate && 'sticky top-3 z-[11]',
         !intersected && searchBoxCanAnimate && 'w-[508px] transition-[width] duration-300',
       )}
+      inputClassName='w-full'
       search={searchPluginText}
       onSearchChange={handleSearchPluginTextChange}
       tags={filterPluginTags}
diff --git a/web/app/components/plugins/plugin-detail-panel/model-selector/tts-params-panel.tsx b/web/app/components/plugins/plugin-detail-panel/model-selector/tts-params-panel.tsx
index 5bd099b11..e7b238cfa 100644
--- a/web/app/components/plugins/plugin-detail-panel/model-selector/tts-params-panel.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/model-selector/tts-params-panel.tsx
@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { languages } from '@/i18n/language'
+import { languages } from '@/i18n-config/language'
 import { PortalSelect } from '@/app/components/base/select'
 import cn from '@/utils/classnames'
 
diff --git a/web/app/components/plugins/plugin-detail-panel/strategy-detail.tsx b/web/app/components/plugins/plugin-detail-panel/strategy-detail.tsx
index 00794d83e..3427587fd 100644
--- a/web/app/components/plugins/plugin-detail-panel/strategy-detail.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/strategy-detail.tsx
@@ -14,7 +14,7 @@ import Divider from '@/app/components/base/divider'
 import type {
   StrategyDetail as StrategyDetailType,
 } from '@/app/components/plugins/types'
-import type { Locale } from '@/i18n'
+import type { Locale } from '@/i18n-config'
 import { useRenderI18nObject } from '@/hooks/use-i18n'
 import { API_PREFIX } from '@/config'
 import cn from '@/utils/classnames'
diff --git a/web/app/components/plugins/plugin-detail-panel/strategy-item.tsx b/web/app/components/plugins/plugin-detail-panel/strategy-item.tsx
index 3b6a1d8ec..741c8cdf7 100644
--- a/web/app/components/plugins/plugin-detail-panel/strategy-item.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/strategy-item.tsx
@@ -4,7 +4,7 @@ import StrategyDetailPanel from './strategy-detail'
 import type {
   StrategyDetail,
 } from '@/app/components/plugins/types'
-import type { Locale } from '@/i18n'
+import type { Locale } from '@/i18n-config'
 import { useRenderI18nObject } from '@/hooks/use-i18n'
 import cn from '@/utils/classnames'
 
diff --git a/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-item.tsx b/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-item.tsx
index 99a01bcd0..a5accf52e 100644
--- a/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-item.tsx
+++ b/web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-item.tsx
@@ -3,7 +3,7 @@ import type { FC } from 'react'
 import React from 'react'
 import type { PluginDetail } from '@/app/components/plugins/types'
 import Icon from '@/app/components/plugins/card/base/card-icon'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 import { useGetLanguage } from '@/context/i18n'
 import { MARKETPLACE_API_PREFIX } from '@/config'
 import Checkbox from '@/app/components/base/checkbox'
diff --git a/web/app/components/plugins/types.ts b/web/app/components/plugins/types.ts
index 162bf236d..c60d9e260 100644
--- a/web/app/components/plugins/types.ts
+++ b/web/app/components/plugins/types.ts
@@ -1,6 +1,6 @@
 import type { CredentialFormSchemaBase } from '../header/account-setting/model-provider-page/declarations'
 import type { ToolCredential } from '@/app/components/tools/types'
-import type { Locale } from '@/i18n'
+import type { Locale } from '@/i18n-config'
 import type { AgentFeature } from '@/app/components/workflow/nodes/agent/types'
 import type { AutoUpdateConfig } from './reference-setting-modal/auto-update-setting/types'
 export enum PluginType {
diff --git a/web/app/components/plugins/utils.ts b/web/app/components/plugins/utils.ts
index 1b84e3e9f..9ad233266 100644
--- a/web/app/components/plugins/utils.ts
+++ b/web/app/components/plugins/utils.ts
@@ -1,4 +1,4 @@
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 import {
   categoryKeys,
diff --git a/web/app/components/share/text-generation/index.tsx b/web/app/components/share/text-generation/index.tsx
index ae6e733e4..1f0367dc6 100644
--- a/web/app/components/share/text-generation/index.tsx
+++ b/web/app/components/share/text-generation/index.tsx
@@ -24,7 +24,7 @@ import type {
 } from '@/models/debug'
 import AppIcon from '@/app/components/base/app-icon'
 import Badge from '@/app/components/base/badge'
-import { changeLanguage } from '@/i18n/i18next-config'
+import { changeLanguage } from '@/i18n-config/i18next-config'
 import Loading from '@/app/components/base/loading'
 import { userInputsFormToPromptVariables } from '@/utils/model-config'
 import Res from '@/app/components/share/text-generation/result'
diff --git a/web/app/components/tools/add-tool-modal/category.tsx b/web/app/components/tools/add-tool-modal/category.tsx
index bfad27006..270b4fc2b 100644
--- a/web/app/components/tools/add-tool-modal/category.tsx
+++ b/web/app/components/tools/add-tool-modal/category.tsx
@@ -6,7 +6,7 @@ import { useMount } from 'ahooks'
 import cn from '@/utils/classnames'
 import { Apps02 } from '@/app/components/base/icons/src/vender/line/others'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import { useStore as useLabelStore } from '@/app/components/tools/labels/store'
 import { fetchLabelList } from '@/service/tools'
 
diff --git a/web/app/components/tools/edit-custom-collection-modal/test-api.tsx b/web/app/components/tools/edit-custom-collection-modal/test-api.tsx
index a03364aa3..80267a7fe 100644
--- a/web/app/components/tools/edit-custom-collection-modal/test-api.tsx
+++ b/web/app/components/tools/edit-custom-collection-modal/test-api.tsx
@@ -11,7 +11,7 @@ import Input from '@/app/components/base/input'
 import Drawer from '@/app/components/base/drawer-plus'
 import I18n from '@/context/i18n'
 import { testAPIAvailable } from '@/service/tools'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 
 type Props = {
   positionCenter?: boolean
diff --git a/web/app/components/tools/marketplace/index.tsx b/web/app/components/tools/marketplace/index.tsx
index 3716f2177..9341e542c 100644
--- a/web/app/components/tools/marketplace/index.tsx
+++ b/web/app/components/tools/marketplace/index.tsx
@@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next'
 import type { useMarketplace } from './hooks'
 import List from '@/app/components/plugins/marketplace/list'
 import Loading from '@/app/components/base/loading'
-import { getLocaleOnClient } from '@/i18n'
+import { getLocaleOnClient } from '@/i18n-config'
 import { getMarketplaceUrl } from '@/utils/var'
 
 type MarketplaceProps = {
diff --git a/web/app/components/tools/mcp/create-card.tsx b/web/app/components/tools/mcp/create-card.tsx
index 7416f85a2..5a2a64af7 100644
--- a/web/app/components/tools/mcp/create-card.tsx
+++ b/web/app/components/tools/mcp/create-card.tsx
@@ -9,7 +9,7 @@ import {
 } from '@remixicon/react'
 import MCPModal from './modal'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import { useAppContext } from '@/context/app-context'
 import { useCreateMCP } from '@/service/use-tools'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
diff --git a/web/app/components/tools/mcp/detail/tool-item.tsx b/web/app/components/tools/mcp/detail/tool-item.tsx
index dec82edcc..7a5ea6143 100644
--- a/web/app/components/tools/mcp/detail/tool-item.tsx
+++ b/web/app/components/tools/mcp/detail/tool-item.tsx
@@ -3,7 +3,7 @@ import React from 'react'
 import { useContext } from 'use-context-selector'
 import type { Tool } from '@/app/components/tools/types'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import Tooltip from '@/app/components/base/tooltip'
 import cn from '@/utils/classnames'
 
diff --git a/web/app/components/tools/provider/custom-create-card.tsx b/web/app/components/tools/provider/custom-create-card.tsx
index ab5b85e26..dbb7026ab 100644
--- a/web/app/components/tools/provider/custom-create-card.tsx
+++ b/web/app/components/tools/provider/custom-create-card.tsx
@@ -9,7 +9,7 @@ import {
 } from '@remixicon/react'
 import type { CustomCollectionBackend } from '../types'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import EditCustomToolModal from '@/app/components/tools/edit-custom-collection-modal'
 import { createCustomCollection } from '@/service/tools'
 import Toast from '@/app/components/base/toast'
diff --git a/web/app/components/tools/provider/detail.tsx b/web/app/components/tools/provider/detail.tsx
index 20c7017de..87d09bd52 100644
--- a/web/app/components/tools/provider/detail.tsx
+++ b/web/app/components/tools/provider/detail.tsx
@@ -11,7 +11,7 @@ import type { Collection, CustomCollectionBackend, Tool, WorkflowToolProviderReq
 import ToolItem from './tool-item'
 import cn from '@/utils/classnames'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import Confirm from '@/app/components/base/confirm'
 import Button from '@/app/components/base/button'
 import Indicator from '@/app/components/header/indicator'
diff --git a/web/app/components/tools/provider/tool-item.tsx b/web/app/components/tools/provider/tool-item.tsx
index d79d20cb9..7ad202fca 100644
--- a/web/app/components/tools/provider/tool-item.tsx
+++ b/web/app/components/tools/provider/tool-item.tsx
@@ -4,7 +4,7 @@ import { useContext } from 'use-context-selector'
 import type { Collection, Tool } from '../types'
 import cn from '@/utils/classnames'
 import I18n from '@/context/i18n'
-import { getLanguage } from '@/i18n/language'
+import { getLanguage } from '@/i18n-config/language'
 import SettingBuiltInTool from '@/app/components/app/configuration/config/agent/agent-tools/setting-built-in-tool'
 
 type Props = {
diff --git a/web/app/components/workflow/nodes/agent/default.ts b/web/app/components/workflow/nodes/agent/default.ts
index 51955dc6c..d312d4d55 100644
--- a/web/app/components/workflow/nodes/agent/default.ts
+++ b/web/app/components/workflow/nodes/agent/default.ts
@@ -3,7 +3,7 @@ import { ALL_CHAT_AVAILABLE_BLOCKS, ALL_COMPLETION_AVAILABLE_BLOCKS } from '@/ap
 import type { NodeDefault } from '../../types'
 import type { AgentNodeType } from './types'
 import { FormTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 
 const nodeDefault: NodeDefault<AgentNodeType> = {
   defaultValue: {
diff --git a/web/app/components/workflow/nodes/document-extractor/panel.tsx b/web/app/components/workflow/nodes/document-extractor/panel.tsx
index a91608c71..572ca366c 100644
--- a/web/app/components/workflow/nodes/document-extractor/panel.tsx
+++ b/web/app/components/workflow/nodes/document-extractor/panel.tsx
@@ -13,7 +13,7 @@ import { fetchSupportFileTypes } from '@/service/datasets'
 import Field from '@/app/components/workflow/nodes/_base/components/field'
 import { BlockEnum, type NodePanelProps } from '@/app/components/workflow/types'
 import I18n from '@/context/i18n'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 const i18nPrefix = 'workflow.nodes.docExtractor'
 
diff --git a/web/app/dev-only/i18n-checker/page.tsx b/web/app/dev-only/i18n-checker/page.tsx
index d821979bb..7341c153c 100644
--- a/web/app/dev-only/i18n-checker/page.tsx
+++ b/web/app/dev-only/i18n-checker/page.tsx
@@ -1,8 +1,8 @@
 'use client'
-import { loadLangResources } from '@/i18n/i18next-config'
+import { loadLangResources } from '@/i18n-config/i18next-config'
 import { useCallback, useEffect, useState } from 'react'
 import cn from '@/utils/classnames'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 export default function I18nTest() {
   const [langs, setLangs] = useState<Lang[]>([])
diff --git a/web/app/layout.tsx b/web/app/layout.tsx
index f086499ca..0f0ea0f70 100644
--- a/web/app/layout.tsx
+++ b/web/app/layout.tsx
@@ -3,7 +3,7 @@ import type { Viewport } from 'next'
 import I18nServer from './components/i18n-server'
 import BrowserInitializer from './components/browser-initializer'
 import SentryInitializer from './components/sentry-initializer'
-import { getLocaleOnServer } from '@/i18n/server'
+import { getLocaleOnServer } from '@/i18n-config/server'
 import { TanstackQueryInitializer } from '@/context/query-client'
 import { ThemeProvider } from 'next-themes'
 import './styles/globals.css'
diff --git a/web/app/signin/_header.tsx b/web/app/signin/_header.tsx
index 0efd30b6c..03e05924b 100644
--- a/web/app/signin/_header.tsx
+++ b/web/app/signin/_header.tsx
@@ -3,8 +3,8 @@ import React from 'react'
 import { useContext } from 'use-context-selector'
 import Select from '@/app/components/base/select/locale'
 import Divider from '@/app/components/base/divider'
-import { languages } from '@/i18n/language'
-import type { Locale } from '@/i18n'
+import { languages } from '@/i18n-config/language'
+import type { Locale } from '@/i18n-config'
 import I18n from '@/context/i18n'
 import dynamic from 'next/dynamic'
 import { useGlobalPublicStore } from '@/context/global-public-context'
diff --git a/web/app/signin/invite-settings/page.tsx b/web/app/signin/invite-settings/page.tsx
index ea3590096..2bc7eba7a 100644
--- a/web/app/signin/invite-settings/page.tsx
+++ b/web/app/signin/invite-settings/page.tsx
@@ -11,7 +11,7 @@ import Input from '@/app/components/base/input'
 import { SimpleSelect } from '@/app/components/base/select'
 import Button from '@/app/components/base/button'
 import { timezones } from '@/utils/timezone'
-import { LanguagesSupported, languages } from '@/i18n/language'
+import { LanguagesSupported, languages } from '@/i18n-config/language'
 import I18n from '@/context/i18n'
 import { activateMember, invitationCheck } from '@/service/common'
 import Loading from '@/app/components/base/loading'
diff --git a/web/app/signin/oneMoreStep.tsx b/web/app/signin/oneMoreStep.tsx
index 657455b90..3293caa8f 100644
--- a/web/app/signin/oneMoreStep.tsx
+++ b/web/app/signin/oneMoreStep.tsx
@@ -9,7 +9,7 @@ import Button from '@/app/components/base/button'
 import Tooltip from '@/app/components/base/tooltip'
 import { SimpleSelect } from '@/app/components/base/select'
 import { timezones } from '@/utils/timezone'
-import { LanguagesSupported, languages } from '@/i18n/language'
+import { LanguagesSupported, languages } from '@/i18n-config/language'
 import { oneMoreStep } from '@/service/common'
 import Toast from '@/app/components/base/toast'
 import { useDocLink } from '@/context/i18n'
diff --git a/web/context/i18n.ts b/web/context/i18n.ts
index 932beb993..c0031c5c7 100644
--- a/web/context/i18n.ts
+++ b/web/context/i18n.ts
@@ -2,8 +2,8 @@ import {
   createContext,
   useContext,
 } from 'use-context-selector'
-import type { Locale } from '@/i18n'
-import { getDocLanguage, getLanguage, getPricingPageLanguage } from '@/i18n/language'
+import type { Locale } from '@/i18n-config'
+import { getDocLanguage, getLanguage, getPricingPageLanguage } from '@/i18n-config/language'
 import { noop } from 'lodash-es'
 
 type II18NContext = {
diff --git a/web/hooks/use-i18n.ts b/web/hooks/use-i18n.ts
index c2356b12a..606ea9da7 100644
--- a/web/hooks/use-i18n.ts
+++ b/web/hooks/use-i18n.ts
@@ -1,5 +1,5 @@
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
-import { renderI18nObject } from '@/i18n'
+import { renderI18nObject } from '@/i18n-config'
 
 export const useRenderI18nObject = () => {
   const language = useLanguage()
diff --git a/web/i18n/DEV.md b/web/i18n-config/DEV.md
similarity index 100%
rename from web/i18n/DEV.md
rename to web/i18n-config/DEV.md
diff --git a/web/i18n/README.md b/web/i18n-config/README.md
similarity index 100%
rename from web/i18n/README.md
rename to web/i18n-config/README.md
diff --git a/web/i18n/auto-gen-i18n.js b/web/i18n-config/auto-gen-i18n.js
similarity index 99%
rename from web/i18n/auto-gen-i18n.js
rename to web/i18n-config/auto-gen-i18n.js
index a03b3aac2..fa7500e87 100644
--- a/web/i18n/auto-gen-i18n.js
+++ b/web/i18n-config/auto-gen-i18n.js
@@ -1,4 +1,3 @@
-/* eslint-disable no-eval */
 const fs = require('node:fs')
 const path = require('node:path')
 const transpile = require('typescript').transpile
diff --git a/web/i18n/check-i18n.js b/web/i18n-config/check-i18n.js
similarity index 98%
rename from web/i18n/check-i18n.js
rename to web/i18n-config/check-i18n.js
index 55a2301ed..5f4414c7a 100644
--- a/web/i18n/check-i18n.js
+++ b/web/i18n-config/check-i18n.js
@@ -1,4 +1,3 @@
-/* eslint-disable no-eval */
 const fs = require('node:fs')
 const path = require('node:path')
 const transpile = require('typescript').transpile
diff --git a/web/i18n/i18next-config.ts b/web/i18n-config/i18next-config.ts
similarity index 62%
rename from web/i18n/i18next-config.ts
rename to web/i18n-config/i18next-config.ts
index 7af727af7..b26d0afdb 100644
--- a/web/i18n/i18next-config.ts
+++ b/web/i18n-config/i18next-config.ts
@@ -6,10 +6,10 @@ import { initReactI18next } from 'react-i18next'
 const requireSilent = async (lang: string, namespace: string) => {
   let res
   try {
-    res = (await import(`./${lang}/${namespace}`)).default
+    res = (await import(`../i18n/${lang}/${namespace}`)).default
   }
   catch {
-    res = (await import(`./en-US/${namespace}`)).default
+    res = (await import(`../i18n/en-US/${namespace}`)).default
   }
 
   return res
@@ -53,13 +53,27 @@ export const loadLangResources = async (lang: string) => {
   return resources
 }
 
-const getFallbackTranslation = () => {
-  const resources = NAMESPACES.reduce((acc, ns, index) => {
-    acc[camelCase(NAMESPACES[index])] = require(`./en-US/${ns}`).default
+/**
+ * !Need to load en-US and zh-Hans resources for initial rendering, which are used in both marketplace and dify
+ * !Other languages will be loaded on demand
+ * !This is to avoid loading all languages at once which can be slow
+ */
+const getInitialTranslations = () => {
+  const en_USResources = NAMESPACES.reduce((acc, ns, index) => {
+    acc[camelCase(NAMESPACES[index])] = require(`../i18n/en-US/${ns}`).default
+    return acc
+  }, {} as Record<string, any>)
+  const zh_HansResources = NAMESPACES.reduce((acc, ns, index) => {
+    acc[camelCase(NAMESPACES[index])] = require(`../i18n/zh-Hans/${ns}`).default
     return acc
   }, {} as Record<string, any>)
   return {
-    translation: resources,
+    'en-US': {
+      translation: en_USResources,
+    },
+    'zh-Hans': {
+      translation: zh_HansResources,
+    },
   }
 }
 
@@ -68,9 +82,7 @@ if (!i18n.isInitialized) {
     .init({
       lng: undefined,
       fallbackLng: 'en-US',
-      resources: {
-        'en-US': getFallbackTranslation(),
-      },
+      resources: getInitialTranslations(),
     })
 }
 
diff --git a/web/i18n/index.ts b/web/i18n-config/index.ts
similarity index 86%
rename from web/i18n/index.ts
rename to web/i18n-config/index.ts
index 27ed3022a..fdb31c49b 100644
--- a/web/i18n/index.ts
+++ b/web/i18n-config/index.ts
@@ -1,8 +1,8 @@
 import Cookies from 'js-cookie'
 
-import { changeLanguage } from '@/i18n/i18next-config'
+import { changeLanguage } from '@/i18n-config/i18next-config'
 import { LOCALE_COOKIE_NAME } from '@/config'
-import { LanguagesSupported } from '@/i18n/language'
+import { LanguagesSupported } from '@/i18n-config/language'
 
 export const i18n = {
   defaultLocale: 'en-US',
diff --git a/web/i18n/language.ts b/web/i18n-config/language.ts
similarity index 100%
rename from web/i18n/language.ts
rename to web/i18n-config/language.ts
diff --git a/web/i18n/languages.json b/web/i18n-config/languages.json
similarity index 100%
rename from web/i18n/languages.json
rename to web/i18n-config/languages.json
diff --git a/web/i18n/server.ts b/web/i18n-config/server.ts
similarity index 97%
rename from web/i18n/server.ts
rename to web/i18n-config/server.ts
index 9aeac291e..404a71cfa 100644
--- a/web/i18n/server.ts
+++ b/web/i18n-config/server.ts
@@ -13,7 +13,7 @@ const initI18next = async (lng: Locale, ns: string) => {
   const i18nInstance = createInstance()
   await i18nInstance
     .use(initReactI18next)
-    .use(resourcesToBackend((language: string, namespace: string) => import(`./${language}/${namespace}.ts`)))
+    .use(resourcesToBackend((language: string, namespace: string) => import(`../i18n/${language}/${namespace}.ts`)))
     .init({
       lng: lng === 'zh-Hans' ? 'zh-Hans' : lng,
       ns,
diff --git a/web/models/common.ts b/web/models/common.ts
index cb8fb7f2b..867f4cf8f 100644
--- a/web/models/common.ts
+++ b/web/models/common.ts
@@ -1,4 +1,4 @@
-import type { I18nText } from '@/i18n/language'
+import type { I18nText } from '@/i18n-config/language'
 import type { Model } from '@/types/app'
 
 export type CommonResponse = {
diff --git a/web/models/share.ts b/web/models/share.ts
index 1e3b6d6bb..64725ddf3 100644
--- a/web/models/share.ts
+++ b/web/models/share.ts
@@ -1,4 +1,4 @@
-import type { Locale } from '@/i18n'
+import type { Locale } from '@/i18n-config'
 import type { AppIconType } from '@/types/app'
 
 export type ResponseHolder = {}
diff --git a/web/types/app.ts b/web/types/app.ts
index 634fce984..64c806e1d 100644
--- a/web/types/app.ts
+++ b/web/types/app.ts
@@ -1,6 +1,6 @@
 import type { AnnotationReplyConfig, ChatPromptConfig, CompletionPromptConfig, DatasetConfigs, PromptMode } from '@/models/debug'
 import type { CollectionType } from '@/app/components/tools/types'
-import type { LanguagesSupported } from '@/i18n/language'
+import type { LanguagesSupported } from '@/i18n-config/language'
 import type { Tag } from '@/app/components/base/tag-management/constant'
 import type {
   RerankingModeEnum,