diff --git a/web/app/components/datasets/create-from-pipeline/list/create-card.tsx b/web/app/components/datasets/create-from-pipeline/list/create-card.tsx
index f6a20c50e0..018a655e0b 100644
--- a/web/app/components/datasets/create-from-pipeline/list/create-card.tsx
+++ b/web/app/components/datasets/create-from-pipeline/list/create-card.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { trackEvent } from '@/app/components/base/amplitude'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { useRouter } from '@/next/navigation'
 import { useCreatePipelineDataset } from '@/service/knowledge/use-create-dataset'
 import { useInvalidDatasetList } from '@/service/knowledge/use-dataset'
@@ -20,9 +20,9 @@ const CreateCard = () => {
       onSuccess: (data) => {
         if (data) {
           const { id } = data
-          Toast.notify({
+          toast.add({
             type: 'success',
-            message: t('creation.successTip', { ns: 'datasetPipeline' }),
+            title: t('creation.successTip', { ns: 'datasetPipeline' }),
           })
           invalidDatasetList()
           trackEvent('create_datasets_from_scratch', {
@@ -32,9 +32,9 @@ const CreateCard = () => {
         }
       },
       onError: () => {
-        Toast.notify({
+        toast.add({
           type: 'error',
-          message: t('creation.errorTip', { ns: 'datasetPipeline' }),
+          title: t('creation.errorTip', { ns: 'datasetPipeline' }),
         })
       },
     })
diff --git a/web/app/components/datasets/create-from-pipeline/list/template-card/edit-pipeline-info.tsx b/web/app/components/datasets/create-from-pipeline/list/template-card/edit-pipeline-info.tsx
index 69f8f470d0..b09486bee3 100644
--- a/web/app/components/datasets/create-from-pipeline/list/template-card/edit-pipeline-info.tsx
+++ b/web/app/components/datasets/create-from-pipeline/list/template-card/edit-pipeline-info.tsx
@@ -9,7 +9,7 @@ import AppIconPicker from '@/app/components/base/app-icon-picker'
 import Button from '@/app/components/base/button'
 import Input from '@/app/components/base/input'
 import Textarea from '@/app/components/base/textarea'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { useInvalidCustomizedTemplateList, useUpdateTemplateInfo } from '@/service/use-pipeline'
 
 type EditPipelineInfoProps = {
@@ -67,9 +67,9 @@ const EditPipelineInfo = ({
 
   const handleSave = useCallback(async () => {
     if (!name) {
-      Toast.notify({
+      toast.add({
         type: 'error',
-        message: 'Please enter a name for the Knowledge Base.',
+        title: t('editPipelineInfoNameRequired', { ns: 'datasetPipeline' }),
       })
       return
     }
diff --git a/web/app/components/datasets/create-from-pipeline/list/template-card/index.tsx b/web/app/components/datasets/create-from-pipeline/list/template-card/index.tsx
index 7684e924b6..7e2683d781 100644
--- a/web/app/components/datasets/create-from-pipeline/list/template-card/index.tsx
+++ b/web/app/components/datasets/create-from-pipeline/list/template-card/index.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'
 import { trackEvent } from '@/app/components/base/amplitude'
 import Confirm from '@/app/components/base/confirm'
 import Modal from '@/app/components/base/modal'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { usePluginDependencies } from '@/app/components/workflow/plugin-dependency/hooks'
 import { useRouter } from '@/next/navigation'
 import { useCreatePipelineDatasetFromCustomized } from '@/service/knowledge/use-create-dataset'
@@ -50,9 +50,9 @@ const TemplateCard = ({
   const handleUseTemplate = useCallback(async () => {
     const { data: pipelineTemplateInfo } = await getPipelineTemplateInfo()
     if (!pipelineTemplateInfo) {
-      Toast.notify({
+      toast.add({
         type: 'error',
-        message: t('creation.errorTip', { ns: 'datasetPipeline' }),
+        title: t('creation.errorTip', { ns: 'datasetPipeline' }),
       })
       return
     }
@@ -61,9 +61,9 @@ const TemplateCard = ({
     }
     await createDataset(request, {
       onSuccess: async (newDataset) => {
-        Toast.notify({
+        toast.add({
           type: 'success',
-          message: t('creation.successTip', { ns: 'datasetPipeline' }),
+          title: t('creation.successTip', { ns: 'datasetPipeline' }),
         })
         invalidDatasetList()
         if (newDataset.pipeline_id)
@@ -76,9 +76,9 @@ const TemplateCard = ({
         push(`/datasets/${newDataset.dataset_id}/pipeline`)
       },
       onError: () => {
-        Toast.notify({
+        toast.add({
           type: 'error',
-          message: t('creation.errorTip', { ns: 'datasetPipeline' }),
+          title: t('creation.errorTip', { ns: 'datasetPipeline' }),
         })
       },
     })
@@ -109,15 +109,15 @@ const TemplateCard = ({
       onSuccess: (res) => {
         const blob = new Blob([res.data], { type: 'application/yaml' })
         downloadBlob({ data: blob, fileName: `${pipeline.name}.pipeline` })
-        Toast.notify({
+        toast.add({
           type: 'success',
-          message: t('exportDSL.successTip', { ns: 'datasetPipeline' }),
+          title: t('exportDSL.successTip', { ns: 'datasetPipeline' }),
         })
       },
       onError: () => {
-        Toast.notify({
+        toast.add({
           type: 'error',
-          message: t('exportDSL.errorTip', { ns: 'datasetPipeline' }),
+          title: t('exportDSL.errorTip', { ns: 'datasetPipeline' }),
         })
       },
     })
diff --git a/web/app/components/datasets/documents/create-from-pipeline/data-source/online-documents/index.tsx b/web/app/components/datasets/documents/create-from-pipeline/data-source/online-documents/index.tsx
index 4bdaac895b..414d2a5756 100644
--- a/web/app/components/datasets/documents/create-from-pipeline/data-source/online-documents/index.tsx
+++ b/web/app/components/datasets/documents/create-from-pipeline/data-source/online-documents/index.tsx
@@ -5,7 +5,7 @@ import { useCallback, useEffect, useMemo } from 'react'
 import { useShallow } from 'zustand/react/shallow'
 import Loading from '@/app/components/base/loading'
 import SearchInput from '@/app/components/base/notion-page-selector/search-input'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { ACCOUNT_SETTING_TAB } from '@/app/components/header/account-setting/constants'
 import { useDatasetDetailContextWithSelector } from '@/context/dataset-detail'
 import { useDocLink } from '@/context/i18n'
@@ -96,9 +96,9 @@ const OnlineDocuments = ({
           setDocumentsData(documentsData.data as DataSourceNotionWorkspace[])
         },
         onDataSourceNodeError: (error: DataSourceNodeErrorResponse) => {
-          Toast.notify({
+          toast.add({
             type: 'error',
-            message: error.error,
+            title: error.error,
           })
         },
       },
diff --git a/web/app/components/datasets/documents/create-from-pipeline/data-source/online-drive/index.tsx b/web/app/components/datasets/documents/create-from-pipeline/data-source/online-drive/index.tsx
index 4346a2d0af..74fad58d19 100644
--- a/web/app/components/datasets/documents/create-from-pipeline/data-source/online-drive/index.tsx
+++ b/web/app/components/datasets/documents/create-from-pipeline/data-source/online-drive/index.tsx
@@ -4,7 +4,7 @@ import type { DataSourceNodeCompletedResponse, DataSourceNodeErrorResponse } fro
 import { produce } from 'immer'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useShallow } from 'zustand/react/shallow'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { ACCOUNT_SETTING_TAB } from '@/app/components/header/account-setting/constants'
 import { useDatasetDetailContextWithSelector } from '@/context/dataset-detail'
 import { useDocLink } from '@/context/i18n'
@@ -105,9 +105,9 @@ const OnlineDrive = ({
           isLoadingRef.current = false
         },
         onDataSourceNodeError: (error: DataSourceNodeErrorResponse) => {
-          Toast.notify({
+          toast.add({
             type: 'error',
-            message: error.error,
+            title: error.error,
           })
           setIsLoading(false)
           isLoadingRef.current = false
diff --git a/web/app/components/datasets/documents/create-from-pipeline/data-source/website-crawl/base/options/index.tsx b/web/app/components/datasets/documents/create-from-pipeline/data-source/website-crawl/base/options/index.tsx
index eb8cceb3e5..2cd5fdf3c3 100644
--- a/web/app/components/datasets/documents/create-from-pipeline/data-source/website-crawl/base/options/index.tsx
+++ b/web/app/components/datasets/documents/create-from-pipeline/data-source/website-crawl/base/options/index.tsx
@@ -8,7 +8,7 @@ import { useAppForm } from '@/app/components/base/form'
 import BaseField from '@/app/components/base/form/form-scenarios/base/field'
 import { generateZodSchema } from '@/app/components/base/form/form-scenarios/base/utils'
 import { ArrowDownRoundFill } from '@/app/components/base/icons/src/vender/solid/general'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { useConfigurations, useInitialData } from '@/app/components/rag-pipeline/hooks/use-input-fields'
 import { CrawlStep } from '@/models/datasets'
 import { cn } from '@/utils/classnames'
@@ -44,9 +44,9 @@ const Options = ({
           const issues = result.error.issues
           const firstIssue = issues[0]
           const errorMessage = `"${firstIssue.path.join('.')}" ${firstIssue.message}`
-          Toast.notify({
+          toast.add({
             type: 'error',
-            message: errorMessage,
+            title: errorMessage,
           })
           return errorMessage
         }
diff --git a/web/app/components/datasets/documents/create-from-pipeline/preview/online-document-preview.tsx b/web/app/components/datasets/documents/create-from-pipeline/preview/online-document-preview.tsx
index 1e3019d427..5cdbc713d6 100644
--- a/web/app/components/datasets/documents/create-from-pipeline/preview/online-document-preview.tsx
+++ b/web/app/components/datasets/documents/create-from-pipeline/preview/online-document-preview.tsx
@@ -6,7 +6,7 @@ import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Notion } from '@/app/components/base/icons/src/public/common'
 import { Markdown } from '@/app/components/base/markdown'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import { useDatasetDetailContextWithSelector } from '@/context/dataset-detail'
 import { usePreviewOnlineDocument } from '@/service/use-pipeline'
 import { formatNumberAbbreviated } from '@/utils/format'
@@ -44,9 +44,9 @@ const OnlineDocumentPreview = ({
         setContent(data.content)
       },
       onError(error) {
-        Toast.notify({
+        toast.add({
           type: 'error',
-          message: error.message,
+          title: error.message,
         })
       },
     })
diff --git a/web/app/components/datasets/documents/create-from-pipeline/process-documents/form.tsx b/web/app/components/datasets/documents/create-from-pipeline/process-documents/form.tsx
index 4873931e8d..ca01f7f628 100644
--- a/web/app/components/datasets/documents/create-from-pipeline/process-documents/form.tsx
+++ b/web/app/components/datasets/documents/create-from-pipeline/process-documents/form.tsx
@@ -3,7 +3,7 @@ import type { BaseConfiguration } from '@/app/components/base/form/form-scenario
 import { useCallback, useImperativeHandle } from 'react'
 import { useAppForm } from '@/app/components/base/form'
 import BaseField from '@/app/components/base/form/form-scenarios/base/field'
-import Toast from '@/app/components/base/toast'
+import { toast } from '@/app/components/base/ui/toast'
 import Header from './header'
 
 type OptionsProps = {
@@ -34,9 +34,9 @@ const Form = ({
           const issues = result.error.issues
           const firstIssue = issues[0]
           const errorMessage = `"${firstIssue.path.join('.')}" ${firstIssue.message}`
-          Toast.notify({
+          toast.add({
             type: 'error',
-            message: errorMessage,
+            title: errorMessage,
           })
           return errorMessage
         }
diff --git a/web/eslint-suppressions.json b/web/eslint-suppressions.json
index 681e430f55..92774e8d60 100644
--- a/web/eslint-suppressions.json
+++ b/web/eslint-suppressions.json
@@ -3076,9 +3076,6 @@
     }
   },
   "app/components/datasets/create-from-pipeline/list/create-card.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "tailwindcss/enforce-consistent-class-order": {
       "count": 2
     }
@@ -3112,16 +3109,13 @@
     }
   },
   "app/components/datasets/create-from-pipeline/list/template-card/edit-pipeline-info.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "tailwindcss/enforce-consistent-class-order": {
       "count": 3
     }
   },
   "app/components/datasets/create-from-pipeline/list/template-card/index.tsx": {
     "no-restricted-imports": {
-      "count": 3
+      "count": 2
     }
   },
   "app/components/datasets/create-from-pipeline/list/template-card/operations.tsx": {
@@ -3403,9 +3397,6 @@
     }
   },
   "app/components/datasets/documents/create-from-pipeline/data-source/online-documents/index.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "ts/no-explicit-any": {
       "count": 1
     }
@@ -3482,9 +3473,6 @@
     }
   },
   "app/components/datasets/documents/create-from-pipeline/data-source/online-drive/index.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "react-hooks-extra/no-direct-set-state-in-use-effect": {
       "count": 5
     }
@@ -3533,9 +3521,6 @@
     }
   },
   "app/components/datasets/documents/create-from-pipeline/data-source/website-crawl/base/options/index.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "tailwindcss/enforce-consistent-class-order": {
       "count": 1
     },
@@ -3562,9 +3547,6 @@
     }
   },
   "app/components/datasets/documents/create-from-pipeline/preview/online-document-preview.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "tailwindcss/enforce-consistent-class-order": {
       "count": 4
     }
@@ -3578,9 +3560,6 @@
     }
   },
   "app/components/datasets/documents/create-from-pipeline/process-documents/form.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "ts/no-explicit-any": {
       "count": 3
     }
diff --git a/web/i18n/en-US/dataset-pipeline.json b/web/i18n/en-US/dataset-pipeline.json
index 00bd68a519..b1b58516bf 100644
--- a/web/i18n/en-US/dataset-pipeline.json
+++ b/web/i18n/en-US/dataset-pipeline.json
@@ -35,6 +35,7 @@
   "details.structureTooltip": "Chunk Structure determines how documents are split and indexed—offering General, Parent-Child, and Q&A modes—and is unique to each knowledge base.",
   "documentSettings.title": "Document Settings",
   "editPipelineInfo": "Edit pipeline info",
+  "editPipelineInfoNameRequired": "Please enter a name for the Knowledge Base.",
   "exportDSL.errorTip": "Failed to export pipeline DSL",
   "exportDSL.successTip": "Export pipeline DSL successfully",
   "inputField": "Input Field",