From dd9be2ed90c2e00111ff7f9d4058cf9d5f5557c4 Mon Sep 17 00:00:00 2001 From: zhaoying Date: Fri, 27 Feb 2026 18:48:02 +0800 Subject: [PATCH 1/2] fix(web): AutocompletePlugin key up/down support scroll --- .../Editor/plugin/AutocompletePlugin.tsx | 34 ++++++++++++++++--- 1 file changed, 30 insertions(+), 4 deletions(-) diff --git a/web/src/views/Workflow/components/Editor/plugin/AutocompletePlugin.tsx b/web/src/views/Workflow/components/Editor/plugin/AutocompletePlugin.tsx index 8e2687f1..f9fe097e 100644 --- a/web/src/views/Workflow/components/Editor/plugin/AutocompletePlugin.tsx +++ b/web/src/views/Workflow/components/Editor/plugin/AutocompletePlugin.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState, type FC } from 'react'; +import { useEffect, useState, useRef, type FC } from 'react'; import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'; import { $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_HIGH, KEY_ENTER_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ESCAPE_COMMAND } from 'lexical'; @@ -22,6 +22,26 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> const [showSuggestions, setShowSuggestions] = useState(false); const [selectedIndex, setSelectedIndex] = useState(0); const [popupPosition, setPopupPosition] = useState({ top: 0, left: 0 }); + const popupRef = useRef(null); + + const scrollSelectedIntoView = () => { + if (!popupRef.current) return; + + const selectedElement = popupRef.current.querySelector('[data-selected="true"]'); + if (!selectedElement) return; + + const container = popupRef.current; + const element = selectedElement as HTMLElement; + + const containerRect = container.getBoundingClientRect(); + const elementRect = element.getBoundingClientRect(); + + if (elementRect.bottom > containerRect.bottom) { + container.scrollTop += elementRect.bottom - containerRect.bottom; + } else if (elementRect.top < containerRect.top) { + container.scrollTop -= containerRect.top - elementRect.top; + } + }; useEffect(() => { return editor.registerUpdateListener(({ editorState }) => { @@ -116,7 +136,7 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> setShowSuggestions(false); }; - const groupedSuggestions = options.reduce((groups: Record, suggestion) => { + const groupedSuggestions = options.reduce((groups: Record, suggestion) => { const { nodeData } = suggestion const nodeId = nodeData.id as string; if (!groups[nodeId]) { @@ -163,7 +183,9 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> while (nextIndex < allOptions.length && allOptions[nextIndex].disabled) { nextIndex++; } - return nextIndex >= allOptions.length ? prev : nextIndex; + const newIndex = nextIndex >= allOptions.length ? prev : nextIndex; + setTimeout(() => scrollSelectedIntoView(), 0); + return newIndex; }); return true; } @@ -182,7 +204,9 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> while (prevIndex >= 0 && allOptions[prevIndex].disabled) { prevIndex--; } - return prevIndex < 0 ? prev : prevIndex; + const newIndex = prevIndex < 0 ? prev : prevIndex; + setTimeout(() => scrollSelectedIntoView(), 0); + return newIndex; }); return true; } @@ -218,6 +242,7 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> } return (
e.preventDefault()} style={{ @@ -248,6 +273,7 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }> return (
Date: Fri, 27 Feb 2026 18:59:58 +0800 Subject: [PATCH 2/2] feat(web): create space storage type add recommend --- web/src/components/RadioGroupCard/index.tsx | 7 ++++++- web/src/i18n/en.ts | 1 + web/src/i18n/zh.ts | 1 + web/src/views/SpaceManagement/components/SpaceModal.tsx | 8 ++++++-- 4 files changed, 14 insertions(+), 3 deletions(-) diff --git a/web/src/components/RadioGroupCard/index.tsx b/web/src/components/RadioGroupCard/index.tsx index 41924c61..e09466cd 100644 --- a/web/src/components/RadioGroupCard/index.tsx +++ b/web/src/components/RadioGroupCard/index.tsx @@ -20,6 +20,7 @@ import { type FC, type Key, type ReactNode, useEffect } from 'react'; import { type RadioGroupProps } from 'antd'; import clsx from 'clsx' +import { useTranslation } from 'react-i18next'; /** Radio card option interface */ interface RadioCardOption { @@ -33,6 +34,8 @@ interface RadioCardOption { icon?: string; /** Whether the option is disabled */ disabled?: boolean; + /** Whether the option is recommended */ + recommend?: boolean; /** Additional properties */ [key: string]: string | number | boolean | undefined | null | Key; } @@ -63,6 +66,7 @@ const RadioGroupCard: FC = ({ allowClear = true, block = false, }) => { + const { t } = useTranslation(); /** Listen to value changes and trigger side effects via onValueChange callback */ useEffect(() => { if (onValueChange) { @@ -91,12 +95,13 @@ const RadioGroupCard: FC = ({ })}> {/* Render each option as a selectable card */} {options.map(option => ( -
handleChange(option)}> + {option.recommend &&
{t('common.recommend')}
} {/* Use custom render or default card layout */} {itemRender ? itemRender(option) : ( <> diff --git a/web/src/i18n/en.ts b/web/src/i18n/en.ts index 8dfb68db..f2b4eaa4 100644 --- a/web/src/i18n/en.ts +++ b/web/src/i18n/en.ts @@ -452,6 +452,7 @@ export const en = { nextStep: 'Next Step', prevStep: 'Previous Step', exportSuccess: 'Export successful', + recommend: 'Recommend', }, model: { searchPlaceholder: 'search model…', diff --git a/web/src/i18n/zh.ts b/web/src/i18n/zh.ts index feefc843..e2e7082a 100644 --- a/web/src/i18n/zh.ts +++ b/web/src/i18n/zh.ts @@ -1019,6 +1019,7 @@ export const zh = { nextStep: '下一步', prevStep: '上一步', exportSuccess: '导出成功', + recommend: '推荐', }, model: { searchPlaceholder: '搜索模型…', diff --git a/web/src/views/SpaceManagement/components/SpaceModal.tsx b/web/src/views/SpaceManagement/components/SpaceModal.tsx index a0703d81..4f37b246 100644 --- a/web/src/views/SpaceManagement/components/SpaceModal.tsx +++ b/web/src/views/SpaceManagement/components/SpaceModal.tsx @@ -34,8 +34,8 @@ interface SpaceModalProps { } /** Storage types */ const types: StorageType[] = [ - 'rag', 'neo4j', + 'rag', ] /** Type icons mapping */ const typeIcons: Record = { @@ -154,6 +154,9 @@ const SpaceModal = forwardRef(({
(({ value: type, label: t(`space.${type}`), labelDesc: t(`space.${type}Desc`), - icon: typeIcons[type] + icon: typeIcons[type], + recommend: type === 'neo4j', }))} block={true} />