diff --git a/web/app/components/workflow/nodes/_base/components/title-description-input.tsx b/web/app/components/workflow/nodes/_base/components/title-description-input.tsx index 062190aee9..4a5c3fe400 100644 --- a/web/app/components/workflow/nodes/_base/components/title-description-input.tsx +++ b/web/app/components/workflow/nodes/_base/components/title-description-input.tsx @@ -1,6 +1,7 @@ import { memo, useCallback, + useEffect, useState, } from 'react' import Textarea from 'react-textarea-autosize' @@ -28,10 +29,27 @@ export const TitleInput = memo(({ onBlur(localValue) } + const handleChange = useCallback((e: React.ChangeEvent) => { + setLocalValue(e.target.value) + }, []) + + const handleKeyDown = useCallback((e: React.KeyboardEvent) => { + if (e.key === 'Enter') { + e.preventDefault() + ;(e.target as HTMLInputElement).blur() + } + }, []) + + // Sync local state with incoming collaborative updates so remote title edits appear immediately. + useEffect(() => { + setLocalValue(value) + }, [value]) + return ( setLocalValue(e.target.value)} + onChange={handleChange} + onKeyDown={handleKeyDown} className={` system-xl-semibold mr-2 h-7 min-w-0 grow appearance-none rounded-md border border-transparent bg-transparent px-1 text-text-primary outline-none focus:shadow-xs