feat: add ingestion pipeline children delimiters configs (#11979)

### What problem does this PR solve?

Add children delimiters for Ingestion pipeline config

### Type of change

- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/form/splitter-form/index.tsx

@@ -2,7 +2,8 @@ import { DelimiterInput } from '@/components/delimiter-form-field';
 import { RAGFlowFormItem } from '@/components/ragflow-form';
 import { SliderInputFormField } from '@/components/slider-input-form-field';
 import { BlockButton, Button } from '@/components/ui/button';
-import { Form } from '@/components/ui/form';
+import { Form, FormControl, FormField, FormItem } from '@/components/ui/form';
+import { Switch } from '@/components/ui/switch';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { Trash2 } from 'lucide-react';
 import { memo } from 'react';
@@ -26,6 +27,12 @@ export const FormSchema = z.object({
       value: z.string().optional(),
     }),
   ),
+  enable_children: z.boolean(),
+  children_delimiters: z.array(
+    z.object({
+      value: z.string().optional(),
+    }),
+  ),
   overlapped_percent: z.number(), // 0.0 - 0.3 , 0% - 30%
 });
 
@@ -46,6 +53,11 @@ const SplitterForm = ({ node }: INextOperatorForm) => {
     control: form.control,
   });
 
+  const childrenDelimiters = useFieldArray({
+    name: 'children_delimiters',
+    control: form.control,
+  });
+
   useWatchFormChange(node?.id, form);
 
   return (
@@ -90,6 +102,59 @@ const SplitterForm = ({ node }: INextOperatorForm) => {
         <BlockButton onClick={() => append({ value: '\n' })}>
           {t('common.add')}
         </BlockButton>
+
+        <fieldset>
+          <div className="mb-2 flex justify-between items-center gap-1">
+            <span>{t('flow.enableChildrenDelimiters')}</span>
+
+            <FormField
+              control={form.control}
+              name="enable_children"
+              render={({ field: { value, onChange, ...restProps } }) => (
+                <FormItem>
+                  <FormControl>
+                    <Switch
+                      checked={value}
+                      onCheckedChange={onChange}
+                      {...restProps}
+                    />
+                  </FormControl>
+                </FormItem>
+              )}
+            />
+          </div>
+
+          {form.getValues('enable_children') && (
+            <div className="space-y-4">
+              {childrenDelimiters.fields.map((field, index) => (
+                <div key={field.id} className="flex items-center gap-2">
+                  <RAGFlowFormItem
+                    name={`children_delimiters.${index}.value`}
+                    label="children_delimiter"
+                    labelClassName="!hidden"
+                    className="flex-auto space-y-0"
+                  >
+                    <DelimiterInput className="!m-0"></DelimiterInput>
+                  </RAGFlowFormItem>
+
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    onClick={() => childrenDelimiters.remove(index)}
+                  >
+                    <Trash2 />
+                  </Button>
+                </div>
+              ))}
+
+              <BlockButton
+                onClick={() => childrenDelimiters.append({ value: '\n' })}
+              >
+                {t('common.add')}
+              </BlockButton>
+            </div>
+          )}
+        </fieldset>
       </FormWrapper>
       <div className="p-5">
         <Output list={outputList}></Output>

web/src/pages/agent/utils.ts

@@ -288,6 +288,11 @@ function transformSplitterParams(params: SplitterFormSchemaType) {
     ...params,
     overlapped_percent: Number(params.overlapped_percent) / 100,
     delimiters: transformObjectArrayToPureArray(params.delimiters, 'value'),
+
+    // Unset children delimiters if this option is not enabled
+    children_delimiters: params.enable_children
+      ? transformObjectArrayToPureArray(params.children_delimiters, 'value')
+      : [],
   };
 }
 
@@ -713,7 +718,7 @@ export function convertToObjectArray<T extends string | number | boolean>(
 
 /**
    * convert the following object into a list
-   * 
+   *
    * {
       "product_related": {
       "description": "The question is about product usage, appearance and how it works.",

web/src/pages/dataset/dataset-setting/configuration/naive.tsx

@@ -2,6 +2,7 @@ import {
   AutoKeywordsFormField,
   AutoQuestionsFormField,
 } from '@/components/auto-keywords-form-field';
+import { ChildrenDelimiterForm } from '@/components/children-delimiter-form';
 import { DelimiterFormField } from '@/components/delimiter-form-field';
 import { ExcelToHtmlFormField } from '@/components/excel-to-html-form-field';
 import { LayoutRecognizeFormField } from '@/components/layout-recognize-form-field';
@@ -21,6 +22,7 @@ export function NaiveConfiguration() {
         <MinerUOptionsFormField></MinerUOptionsFormField>
         <MaxTokenNumberFormField initialValue={512}></MaxTokenNumberFormField>
         <DelimiterFormField></DelimiterFormField>
+        <ChildrenDelimiterForm />
         <EnableTocToggle />
         <OverlappedPercent />
       </ConfigurationFormContainer>

web/src/pages/dataset/dataset-setting/form-schema.ts

@@ -24,6 +24,8 @@ export const formSchema = z
         layout_recognize: z.string(),
         chunk_token_num: z.number(),
         delimiter: z.string(),
+        enable_children: z.boolean(),
+        children_delimiter: z.string(),
         auto_keywords: z.number().optional(),
         auto_questions: z.number().optional(),
         html4excel: z.boolean(),

web/src/pages/dataset/dataset-setting/index.tsx

@@ -63,6 +63,8 @@ export default function DatasetSettings() {
         layout_recognize: DocumentType.DeepDOC,
         chunk_token_num: 512,
         delimiter: `\n`,
+        enable_children: false,
+        children_delimiter: `\n`,
         auto_keywords: 0,
         auto_questions: 0,
         html4excel: false,

web/src/pages/dataset/dataset-setting/saving-button.tsx

@@ -67,6 +67,13 @@ export function SavingButton() {
                 await saveKnowledgeConfiguration({
                   kb_id,
                   ...values,
+                  parser_config: {
+                    ...values.parser_config,
+                    // Unset children delimiter if this option is not enabled
+                    children_delimiter: values.parser_config.enable_children
+                      ? values.parser_config.children_delimiter
+                      : null,
+                  },
                 });
               })();
             }