From e6cf00cb3327688545a98925f2f0b448a908e336 Mon Sep 17 00:00:00 2001 From: balibabu Date: Mon, 22 Sep 2025 14:37:06 +0800 Subject: [PATCH] Feat: Add suffix field to all operators #9869 (#10195) ### What problem does this PR solve? Feat: Add suffix field to all operators #9869 ### Type of change - [x] New Feature (non-breaking change which adds functionality) --- web/src/components/delimiter-form-field.tsx | 10 ++- web/src/pages/data-flow/constant.tsx | 49 ++++++++++- .../form/hierarchical-merger-form/index.tsx | 12 +-- .../data-flow/log-sheet/dataflow-timeline.tsx | 83 ++++++++++++++++++- web/src/pages/data-flow/log-sheet/index.tsx | 3 +- web/src/pages/data-flow/utils.ts | 6 +- 6 files changed, 146 insertions(+), 17 deletions(-) diff --git a/web/src/components/delimiter-form-field.tsx b/web/src/components/delimiter-form-field.tsx index 4b6d031c9..ef23fec3b 100644 --- a/web/src/components/delimiter-form-field.tsx +++ b/web/src/components/delimiter-form-field.tsx @@ -17,10 +17,16 @@ interface IProps { export const DelimiterInput = forwardRef( ({ value, onChange, maxLength, defaultValue, ...props }, ref) => { - const nextValue = value?.replaceAll('\n', '\\n'); + const nextValue = value + ?.replaceAll('\n', '\\n') + .replaceAll('\t', '\\t') + .replaceAll('\r', '\\r'); const handleInputChange = (e: React.ChangeEvent) => { const val = e.target.value; - const nextValue = val.replaceAll('\\n', '\n'); + const nextValue = val + .replaceAll('\\n', '\n') + .replaceAll('\\t', '\t') + .replaceAll('\\r', '\r'); onChange?.(nextValue); }; return ( diff --git a/web/src/pages/data-flow/constant.tsx b/web/src/pages/data-flow/constant.tsx index 8c0d3459d..16649a8d1 100644 --- a/web/src/pages/data-flow/constant.tsx +++ b/web/src/pages/data-flow/constant.tsx @@ -381,7 +381,24 @@ export const initialSplitterValues = { delimiters: [{ value: '\n' }], }; -export const initialHierarchicalMergerValues = { outputs: {} }; +export enum Hierarchy { + H1 = '1', + H2 = '2', + H3 = '3', + H4 = '4', + H5 = '5', +} + +export const initialHierarchicalMergerValues = { + outputs: {}, + hierarchy: Hierarchy.H3, + levels: [ + { expressions: [{ expression: '^#[^#]' }] }, + { expressions: [{ expression: '^##[^#]' }] }, + { expressions: [{ expression: '^###[^#]' }] }, + { expressions: [{ expression: '^####[^#]' }] }, + ], +}; export const CategorizeAnchorPointPositions = [ { top: 1, right: 34 }, @@ -463,8 +480,36 @@ export enum FileType { Image = 'image', Email = 'email', TextMarkdown = 'text&markdown', - Docx = 'docx', + Docx = 'word', PowerPoint = 'ppt', Video = 'video', Audio = 'audio', } + +export const FileTypeSuffixMap = { + [FileType.PDF]: ['pdf'], + [FileType.Spreadsheet]: ['xls', 'xlsx', 'csv'], + [FileType.Image]: ['jpg', 'jpeg', 'png', 'gif'], + [FileType.Email]: ['eml', 'msg'], + [FileType.TextMarkdown]: ['md', 'markdown', 'mdx', 'txt'], + [FileType.Docx]: ['doc', 'docx'], + [FileType.PowerPoint]: ['pptx'], + [FileType.Video]: [], + [FileType.Audio]: [ + 'da', + 'wave', + 'wav', + 'mp3', + 'aac', + 'flac', + 'ogg', + 'aiff', + 'au', + 'midi', + 'wma', + 'realaudio', + 'vqf', + 'oggvorbis', + 'ape', + ], +}; diff --git a/web/src/pages/data-flow/form/hierarchical-merger-form/index.tsx b/web/src/pages/data-flow/form/hierarchical-merger-form/index.tsx index 15cf11aeb..6ce32fd6b 100644 --- a/web/src/pages/data-flow/form/hierarchical-merger-form/index.tsx +++ b/web/src/pages/data-flow/form/hierarchical-merger-form/index.tsx @@ -10,7 +10,7 @@ import { memo } from 'react'; import { useFieldArray, useForm, useFormContext } from 'react-hook-form'; import { useTranslation } from 'react-i18next'; import { z } from 'zod'; -import { initialHierarchicalMergerValues } from '../../constant'; +import { Hierarchy, initialHierarchicalMergerValues } from '../../constant'; import { useFormValues } from '../../hooks/use-form-values'; import { useWatchFormChange } from '../../hooks/use-watch-form-change'; import { INextOperatorForm } from '../../interface'; @@ -20,14 +20,6 @@ import { Output } from '../components/output'; const outputList = buildOutputList(initialHierarchicalMergerValues.outputs); -enum Hierarchy { - H1 = '1', - H2 = '2', - H3 = '3', - H4 = '4', - H5 = '5', -} - const HierarchyOptions = [ { label: 'H1', value: Hierarchy.H1 }, { label: 'H2', value: Hierarchy.H2 }, @@ -37,7 +29,7 @@ const HierarchyOptions = [ ]; export const FormSchema = z.object({ - hierarchy: z.number(), + hierarchy: z.string(), levels: z.array( z.object({ expressions: z.array( diff --git a/web/src/pages/data-flow/log-sheet/dataflow-timeline.tsx b/web/src/pages/data-flow/log-sheet/dataflow-timeline.tsx index 7876750fa..9008f847d 100644 --- a/web/src/pages/data-flow/log-sheet/dataflow-timeline.tsx +++ b/web/src/pages/data-flow/log-sheet/dataflow-timeline.tsx @@ -1,3 +1,84 @@ +import { + Timeline, + TimelineContent, + TimelineDate, + TimelineHeader, + TimelineIndicator, + TimelineItem, + TimelineSeparator, + TimelineTitle, +} from '@/components/originui/timeline'; +import { Aperture } from 'lucide-react'; + +const items = [ + { + id: 1, + date: '15 minutes ago', + title: 'Hannah Kandell', + action: 'opened a new issue', + description: + "I'm having trouble with the new component library. It's not rendering properly.", + image: '/avatar-40-01.jpg', + }, + { + id: 2, + date: '10 minutes ago', + title: 'Chris Tompson', + action: 'commented on', + description: + "Hey Hannah, I'm having trouble with the new component library. It's not rendering properly.", + image: '/avatar-40-02.jpg', + }, + { + id: 3, + date: '5 minutes ago', + title: 'Emma Davis', + action: 'assigned you to', + description: + 'The new component library is not rendering properly. Can you take a look?', + image: '/avatar-40-03.jpg', + }, + { + id: 4, + date: '2 minutes ago', + title: 'Alex Morgan', + action: 'closed the issue', + description: 'The issue has been fixed. Please review the changes.', + image: '/avatar-40-05.jpg', + }, +]; + export function DataflowTimeline() { - return
xx
; + return ( + + {items.map((item) => ( + + + + + {/* {item.title} + + {item.action} + */} + + {item.description} + {item.date} + + + + + + + {/* + {item.description} + {item.date} + */} + + ))} + + ); } diff --git a/web/src/pages/data-flow/log-sheet/index.tsx b/web/src/pages/data-flow/log-sheet/index.tsx index d8db50907..c268fc97b 100644 --- a/web/src/pages/data-flow/log-sheet/index.tsx +++ b/web/src/pages/data-flow/log-sheet/index.tsx @@ -8,6 +8,7 @@ import { IModalProps } from '@/interfaces/common'; import { cn } from '@/lib/utils'; import { NotebookText } from 'lucide-react'; import 'react18-json-view/src/style.css'; +import { DataflowTimeline } from './dataflow-timeline'; type LogSheetProps = IModalProps; @@ -18,7 +19,7 @@ export function LogSheet({ hideModal }: LogSheetProps) { - Log +
diff --git a/web/src/pages/data-flow/utils.ts b/web/src/pages/data-flow/utils.ts index a13a3bc7b..f1d0a6393 100644 --- a/web/src/pages/data-flow/utils.ts +++ b/web/src/pages/data-flow/utils.ts @@ -22,6 +22,7 @@ import isObject from 'lodash/isObject'; import { CategorizeAnchorPointPositions, FileType, + FileTypeSuffixMap, NoDebugOperatorsList, NodeHandleId, Operator, @@ -102,8 +103,11 @@ function transformParserParams(params: ParserFormSchemaType) { Record >((pre, cur) => { if (cur.fileFormat) { - let filteredSetup: Partial = { + let filteredSetup: Partial< + ParserFormSchemaType['setups'][0] & { suffix: string[] } + > = { output_format: cur.output_format, + suffix: FileTypeSuffixMap[cur.fileFormat as FileType], }; switch (cur.fileFormat) {