sync node title

This commit is contained in:
hjlarry 2025-10-11 15:48:51 +08:00
parent 79beb25530
commit 3006133f0e

View File

@ -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<HTMLInputElement>) => {
setLocalValue(e.target.value)
}, [])
const handleKeyDown = useCallback((e: React.KeyboardEvent<HTMLInputElement>) => {
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 (
<input
value={localValue}
onChange={e => 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