diff --git a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx index 7084c8d3da..e0628be186 100644 --- a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx +++ b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx @@ -1,6 +1,6 @@ 'use client' import type { FC } from 'react' -import React, { useEffect, useMemo } from 'react' +import React, { useEffect, useMemo, useState } from 'react' import { usePathname } from 'next/navigation' import { useTranslation } from 'react-i18next' import type { RemixiconComponentType } from '@remixicon/react' @@ -23,6 +23,8 @@ import { PipelineFill, PipelineLine } from '@/app/components/base/icons/src/vend import { useDatasetDetail, useDatasetRelatedApps } from '@/service/knowledge/use-dataset' import useDocumentTitle from '@/hooks/use-document-title' import ExtraInfo from '@/app/components/datasets/extra-info' +import { useEventEmitterContextContext } from '@/context/event-emitter' +import cn from '@/utils/classnames' export type IAppDetailLayoutProps = { children: React.ReactNode @@ -34,9 +36,18 @@ const DatasetDetailLayout: FC = (props) => { children, params: { datasetId }, } = props + const { t } = useTranslation() const pathname = usePathname() const hideSideBar = pathname.endsWith('documents/create') || pathname.endsWith('documents/create-from-pipeline') - const { t } = useTranslation() + const isPipelineCanvas = pathname.endsWith('/pipeline') + const workflowCanvasMaximize = localStorage.getItem('workflow-canvas-maximize') === 'true' + const [hideHeader, setHideHeader] = useState(workflowCanvasMaximize) + const { eventEmitter } = useEventEmitterContextContext() + + eventEmitter?.useSubscription((v: any) => { + if (v?.type === 'workflow-canvas-maximize') + setHideHeader(v.payload) + }) const { isCurrentWorkspaceDatasetOperator } = useAppContext() const media = useBreakpoints() @@ -75,15 +86,13 @@ const DatasetDetailLayout: FC = (props) => { ] if (datasetRes?.provider !== 'external') { - if (datasetRes?.runtime_mode === 'rag_pipeline') { - baseNavigation.unshift({ - name: t('common.datasetMenus.pipeline'), - href: `/datasets/${datasetId}/pipeline`, - icon: PipelineLine as RemixiconComponentType, - selectedIcon: PipelineFill as RemixiconComponentType, - disabled: false, - }) - } + baseNavigation.unshift({ + name: t('common.datasetMenus.pipeline'), + href: `/datasets/${datasetId}/pipeline`, + icon: PipelineLine as RemixiconComponentType, + selectedIcon: PipelineFill as RemixiconComponentType, + disabled: false, + }) baseNavigation.unshift({ name: t('common.datasetMenus.documents'), href: `/datasets/${datasetId}/documents`, @@ -94,7 +103,7 @@ const DatasetDetailLayout: FC = (props) => { } return baseNavigation - }, [t, datasetId, isButtonDisabledWithPipeline, datasetRes?.provider, datasetRes?.runtime_mode]) + }, [t, datasetId, isButtonDisabledWithPipeline, datasetRes?.provider]) useDocumentTitle(datasetRes?.name || t('common.menus.datasets')) @@ -110,7 +119,12 @@ const DatasetDetailLayout: FC = (props) => { return return ( -
+
{ + const { t } = useTranslation() + const [showConfirmModal, setShowConfirmModal] = useState(false) + + const handleConvert = useCallback(() => { + setShowConfirmModal(false) + // todo: Add conversion logic here + }, []) + + const handleShowConfirmModal = useCallback(() => { + setShowConfirmModal(true) + }, []) + + const handleCancelConversion = useCallback(() => { + setShowConfirmModal(false) + }, []) + + return ( +
+
+
+
+
+ {t('datasetPipeline.conversion.title')} +
+
+ {t('datasetPipeline.conversion.descriptionChunk1')} + {t('datasetPipeline.conversion.descriptionChunk2')} +
+
+
+ + + {t('datasetPipeline.conversion.warning')} + +
+
+
+
+
+ +
+
+
+
+ {showConfirmModal && ( + + )} +
+ ) +} + +export default React.memo(Conversion) diff --git a/web/app/components/rag-pipeline/index.tsx b/web/app/components/rag-pipeline/index.tsx index d1f0208684..cfc324a281 100644 --- a/web/app/components/rag-pipeline/index.tsx +++ b/web/app/components/rag-pipeline/index.tsx @@ -12,6 +12,8 @@ import Loading from '@/app/components/base/loading' import { createRagPipelineSliceSlice } from './store' import RagPipelineMain from './components/rag-pipeline-main' import { usePipelineInit } from './hooks' +import { useDatasetDetailContextWithSelector } from '@/context/dataset-detail' +import Conversion from './conversion' const RagPipeline = () => { const { @@ -53,6 +55,11 @@ const RagPipeline = () => { } const RagPipelineWrapper = () => { + const pipelineId = useDatasetDetailContextWithSelector(s => s.dataset?.pipeline_id) + + if (!pipelineId) + return + return ( { + const { theme } = useTheme() + + return ( + + + + + Pipeline Screenshot + + ) +} + +export default React.memo(PipelineScreenShot) diff --git a/web/i18n/en-US/dataset-pipeline.ts b/web/i18n/en-US/dataset-pipeline.ts index 6fe3d38202..856eac60ab 100644 --- a/web/i18n/en-US/dataset-pipeline.ts +++ b/web/i18n/en-US/dataset-pipeline.ts @@ -30,6 +30,7 @@ const translation = { saveAndProcess: 'Save & Process', preview: 'Preview', exportPipeline: 'Export Pipeline', + convert: 'Convert', }, knowledgeNameAndIcon: 'Knowledge name & icon', knowledgeNameAndIconPlaceholder: 'Please enter the name of the Knowledge Base', @@ -126,6 +127,16 @@ const translation = { emptySearchResult: 'No items were found', resetKeywords: 'Reset keywords', }, + conversion: { + title: 'Convert to Knowledge Pipeline', + descriptionChunk1: 'You can now convert your existing knowledge base to use the Knowledge Pipeline for document processing', + descriptionChunk2: ' — a more open and flexible approach with access to plugins from our marketplace. This will apply the new processing method to all future documents.', + warning: 'This action cannot be undone', + confirm: { + title: 'Confirmation', + content: 'This action is permanent. You won\'t be able to revert to the previous method.Please confirm to convert.', + }, + }, } export default translation diff --git a/web/i18n/zh-Hans/dataset-pipeline.ts b/web/i18n/zh-Hans/dataset-pipeline.ts index 8471282694..353b5cf0c5 100644 --- a/web/i18n/zh-Hans/dataset-pipeline.ts +++ b/web/i18n/zh-Hans/dataset-pipeline.ts @@ -30,6 +30,7 @@ const translation = { saveAndProcess: '保存并处理', preview: '预览', exportPipeline: '导出 pipeline', + convert: '转换', }, knowledgeNameAndIcon: '知识库名称和图标', knowledgeNameAndIconPlaceholder: '请输入知识库名称', @@ -126,6 +127,16 @@ const translation = { emptySearchResult: '未找到任何项目', resetKeywords: '重置关键词', }, + conversion: { + title: '转换为知识库 pipeline', + descriptionChunk1: '您现在可以将现有知识库转换为使用知识库 pipeline 来处理文档', + descriptionChunk2: ' —— 这是一种更开放、更灵活的方式，可以访问我们市场中的插件。新的处理方式将应用到后续添加的所有文档。', + warning: '此操作无法撤销', + confirm: { + title: '确认', + content: '此操作是永久性的。您将无法恢复到之前的方式。请确认转换。', + }, + }, } export default translation diff --git a/web/public/screenshots/dark/Pipeline.png b/web/public/screenshots/dark/Pipeline.png new file mode 100644 index 0000000000..c86d0693ec Binary files /dev/null and b/web/public/screenshots/dark/Pipeline.png differ diff --git a/web/public/screenshots/dark/Pipeline@2x.png b/web/public/screenshots/dark/Pipeline@2x.png new file mode 100644 index 0000000000..29ba978cc0 Binary files /dev/null and b/web/public/screenshots/dark/Pipeline@2x.png differ diff --git a/web/public/screenshots/dark/Pipeline@3x.png b/web/public/screenshots/dark/Pipeline@3x.png new file mode 100644 index 0000000000..585a4c079f Binary files /dev/null and b/web/public/screenshots/dark/Pipeline@3x.png differ diff --git a/web/public/screenshots/light/Pipeline.png b/web/public/screenshots/light/Pipeline.png new file mode 100644 index 0000000000..35432b0d94 Binary files /dev/null and b/web/public/screenshots/light/Pipeline.png differ diff --git a/web/public/screenshots/light/Pipeline@2x.png b/web/public/screenshots/light/Pipeline@2x.png new file mode 100644 index 0000000000..e52594013a Binary files /dev/null and b/web/public/screenshots/light/Pipeline@2x.png differ diff --git a/web/public/screenshots/light/Pipeline@3x.png b/web/public/screenshots/light/Pipeline@3x.png new file mode 100644 index 0000000000..619335b381 Binary files /dev/null and b/web/public/screenshots/light/Pipeline@3x.png differ