From 5114569017b7b55b1bfd1364de7c2da5717bccd1 Mon Sep 17 00:00:00 2001
From: twwu <twwu@dify.ai>
Date: Thu, 4 Sep 2025 09:59:55 +0800
Subject: [PATCH] refactor(document-picker): enhance chunking mode handling and
 improve parent mode label logic

---
 .../datasets/common/document-picker/index.tsx     | 15 ++++++++++++---
 .../datasets/documents/detail/index.tsx           | 14 +++++---------
 web/hooks/use-metadata.ts                         | 14 +++++++++++---
 3 files changed, 28 insertions(+), 15 deletions(-)

diff --git a/web/app/components/datasets/common/document-picker/index.tsx b/web/app/components/datasets/common/document-picker/index.tsx
index fd1e8ea3be..0629ff0e48 100644
--- a/web/app/components/datasets/common/document-picker/index.tsx
+++ b/web/app/components/datasets/common/document-picker/index.tsx
@@ -1,6 +1,6 @@
 'use client'
 import type { FC } from 'react'
-import React, { useCallback, useState } from 'react'
+import React, { useCallback, useMemo, useState } from 'react'
 import { useBoolean } from 'ahooks'
 import { RiArrowDownSLine } from '@remixicon/react'
 import { useTranslation } from 'react-i18next'
@@ -53,7 +53,9 @@ const DocumentPicker: FC<Props> = ({
     },
   })
   const documentsList = data?.data
+  const isGeneralMode = chunkingMode === ChunkingMode.text
   const isParentChild = chunkingMode === ChunkingMode.parentChild
+  const isQAMode = chunkingMode === ChunkingMode.qa
   const TypeIcon = isParentChild ? ParentChildChunk : GeneralChunk
 
   const [open, {
@@ -67,6 +69,12 @@ const DocumentPicker: FC<Props> = ({
     setOpen(false)
   }, [documentsList, onChange, setOpen])
 
+  const parentModeLabel = useMemo(() => {
+    if (!parentMode)
+      return '--'
+    return parentMode === 'paragraph' ? t('dataset.parentMode.paragraph') : t('dataset.parentMode.fullDoc')
+  }, [parentMode, t])
+
   return (
     <PortalToFollowElem
       open={open}
@@ -84,8 +92,9 @@ const DocumentPicker: FC<Props> = ({
             <div className='flex h-3 items-center space-x-0.5 text-text-tertiary'>
               <TypeIcon className='h-3 w-3' />
               <span className={cn('system-2xs-medium-uppercase', isParentChild && 'mt-0.5' /* to icon problem cause not ver align */)}>
-                {isParentChild ? t('dataset.chunkingMode.parentChild') : t('dataset.chunkingMode.general')}
-                {isParentChild && ` · ${!parentMode ? '--' : parentMode === 'paragraph' ? t('dataset.parentMode.paragraph') : t('dataset.parentMode.fullDoc')}`}
+                {isGeneralMode && t('dataset.chunkingMode.general')}
+                {isQAMode && t('dataset.chunkingMode.qa')}
+                {isParentChild && `${t('dataset.chunkingMode.parentChild')} · ${parentModeLabel}`}
               </span>
             </div>
           </div>
diff --git a/web/app/components/datasets/documents/detail/index.tsx b/web/app/components/datasets/documents/detail/index.tsx
index e3dc202d99..f23412db3c 100644
--- a/web/app/components/datasets/documents/detail/index.tsx
+++ b/web/app/components/datasets/documents/detail/index.tsx
@@ -16,7 +16,8 @@ import cn from '@/utils/classnames'
 import Divider from '@/app/components/base/divider'
 import Loading from '@/app/components/base/loading'
 import Toast from '@/app/components/base/toast'
-import type { ChunkingMode, FileItem } from '@/models/datasets'
+import { ChunkingMode } from '@/models/datasets'
+import type { FileItem } from '@/models/datasets'
 import { useDatasetDetailContextWithSelector } from '@/context/dataset-detail'
 import FloatRightContainer from '@/app/components/base/float-right-container'
 import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
@@ -129,19 +130,14 @@ const DocumentDetail: FC<DocumentDetailProps> = ({ datasetId, documentId }) => {
     }
   }
 
-  const mode = useMemo(() => {
-    if (documentDetail?.document_process_rule?.mode)
-      return documentDetail.document_process_rule.mode
-    return documentDetail?.doc_form === 'hierarchical_model' ? 'hierarchical' : 'custom'
-  }, [documentDetail?.document_process_rule?.mode, documentDetail?.dataset_process_rule?.mode])
-
   const parentMode = useMemo(() => {
     return documentDetail?.document_process_rule?.rules?.parent_mode || documentDetail?.dataset_process_rule?.rules?.parent_mode || 'paragraph'
   }, [documentDetail?.document_process_rule?.rules?.parent_mode, documentDetail?.dataset_process_rule?.rules?.parent_mode])
 
   const isFullDocMode = useMemo(() => {
-    return mode === 'hierarchical' && parentMode === 'full-doc'
-  }, [mode, parentMode])
+    const chunkMode = documentDetail?.doc_form
+    return chunkMode === ChunkingMode.parentChild && parentMode === 'full-doc'
+  }, [documentDetail?.doc_form, parentMode])
 
   return (
     <DocumentContext.Provider value={{
diff --git a/web/hooks/use-metadata.ts b/web/hooks/use-metadata.ts
index fa11095e91..436747c86e 100644
--- a/web/hooks/use-metadata.ts
+++ b/web/hooks/use-metadata.ts
@@ -1,7 +1,7 @@
 'use client'
 import { useTranslation } from 'react-i18next'
 import { formatFileSize, formatNumber, formatTime } from '@/utils/format'
-import { type DocType, ProcessMode } from '@/models/datasets'
+import { ChunkingMode, type DocType } from '@/models/datasets'
 import useTimestamp from '@/hooks/use-timestamp'
 
 export type inputType = 'input' | 'select' | 'textarea'
@@ -248,9 +248,17 @@ export const useMetadataMap = (): MetadataMap => {
       text: t('datasetDocuments.metadata.type.technicalParameters'),
       allowEdit: false,
       subFieldsMap: {
-        'dataset_process_rule.mode': {
+        'doc_form': {
           label: t(`${fieldPrefix}.technicalParameters.segmentSpecification`),
-          render: value => value === ProcessMode.general ? (t('datasetDocuments.embedding.custom') as string) : (t('datasetDocuments.embedding.hierarchical') as string),
+          render: (value) => {
+            if (value === ChunkingMode.text)
+              return t('dataset.chunkingMode.general')
+            if (value === ChunkingMode.qa)
+              return t('dataset.chunkingMode.qa')
+            if (value === ChunkingMode.parentChild)
+              return t('dataset.chunkingMode.parentChild')
+            return '--'
+          },
         },
         'dataset_process_rule.rules.segmentation.max_tokens': {
           label: t(`${fieldPrefix}.technicalParameters.segmentLength`),