2
0

🐛 (editor) Fix multiple text editor focus

Closes #1312
This commit is contained in:
Baptiste Arnaud
2024-03-15 14:05:32 +01:00
parent 065a70ea28
commit 9b9282e3d9
2 changed files with 3 additions and 16 deletions

View File

@ -152,7 +152,6 @@ export const PreCheckoutModal = ({
<Select <Select
placeholder={t('billing.preCheckoutModal.taxId.placeholder')} placeholder={t('billing.preCheckoutModal.taxId.placeholder')}
items={vatCodeLabels} items={vatCodeLabels}
isPopoverMatchingInputWidth={false}
onSelect={updateVatType} onSelect={updateVatType}
/> />
<TextInput <TextInput

View File

@ -79,12 +79,6 @@ export const BlockNode = ({
const { mouseOverBlock, setMouseOverBlock } = useBlockDnd() const { mouseOverBlock, setMouseOverBlock } = useBlockDnd()
const { typebot, updateBlock } = useTypebot() const { typebot, updateBlock } = useTypebot()
const [isConnecting, setIsConnecting] = useState(false) const [isConnecting, setIsConnecting] = useState(false)
const [isPopoverOpened, setIsPopoverOpened] = useState(
openedBlockId === block.id
)
const [isEditing, setIsEditing] = useState<boolean>(
isTextBubbleBlock(block) && (block.content?.richText?.length ?? 0) === 0
)
const blockRef = useRef<HTMLDivElement | null>(null) const blockRef = useRef<HTMLDivElement | null>(null)
const isPreviewing = const isPreviewing =
@ -105,7 +99,7 @@ export const BlockNode = ({
ref: blockRef, ref: blockRef,
onDrag, onDrag,
isDisabled: !onMouseDown, isDisabled: !onMouseDown,
deps: [isEditing], deps: [openedBlockId],
}) })
const { const {
@ -153,13 +147,11 @@ export const BlockNode = ({
const handleCloseEditor = (content: TElement[]) => { const handleCloseEditor = (content: TElement[]) => {
const updatedBlock = { ...block, content: { richText: content } } const updatedBlock = { ...block, content: { richText: content } }
updateBlock(indices, updatedBlock) updateBlock(indices, updatedBlock)
setIsEditing(false)
} }
const handleClick = (e: React.MouseEvent) => { const handleClick = (e: React.MouseEvent) => {
setFocusedGroupId(groupId) setFocusedGroupId(groupId)
e.stopPropagation() e.stopPropagation()
if (isTextBubbleBlock(block) && !isReadOnly) setIsEditing(true)
setOpenedBlockId(block.id) setOpenedBlockId(block.id)
} }
@ -174,10 +166,6 @@ export const BlockNode = ({
const handleContentChange = (content: BubbleBlockContent) => const handleContentChange = (content: BubbleBlockContent) =>
updateBlock(indices, { ...block, content } as Block) updateBlock(indices, { ...block, content } as Block)
useEffect(() => {
setIsPopoverOpened(openedBlockId === block.id)
}, [block.id, openedBlockId])
useEffect(() => { useEffect(() => {
if (!blockRef.current) return if (!blockRef.current) return
const blockElement = blockRef.current const blockElement = blockRef.current
@ -230,7 +218,7 @@ export const BlockNode = ({
return edge.to.blockId === block.id return edge.to.blockId === block.id
}) })
return isEditing && isTextBubbleBlock(block) ? ( return openedBlockId === block.id && isTextBubbleBlock(block) ? (
<TextBubbleEditor <TextBubbleEditor
id={block.id} id={block.id}
initialValue={block.content?.richText ?? []} initialValue={block.content?.richText ?? []}
@ -253,7 +241,7 @@ export const BlockNode = ({
<Popover <Popover
placement="left" placement="left"
isLazy isLazy
isOpen={isPopoverOpened} isOpen={openedBlockId === block.id}
closeOnBlur={false} closeOnBlur={false}
> >
<PopoverTrigger> <PopoverTrigger>