diff --git a/apps/builder/src/features/editor/providers/typebotActions/blocks.ts b/apps/builder/src/features/editor/providers/typebotActions/blocks.ts index 49c574812..379152b47 100644 --- a/apps/builder/src/features/editor/providers/typebotActions/blocks.ts +++ b/apps/builder/src/features/editor/providers/typebotActions/blocks.ts @@ -16,7 +16,10 @@ import { duplicateItemDraft } from './items' import { parseNewBlock } from '@/features/typebot/helpers/parseNewBlock' export type BlocksActions = { - createBlock: (block: BlockV6 | BlockV6['type'], indices: BlockIndices) => void + createBlock: ( + block: BlockV6 | BlockV6['type'], + indices: BlockIndices + ) => string | undefined updateBlock: ( indices: BlockIndices, updates: Partial> @@ -35,12 +38,15 @@ export type WebhookCallBacks = { } export const blocksAction = (setTypebot: SetTypebot): BlocksActions => ({ - createBlock: (block: BlockV6 | BlockV6['type'], indices: BlockIndices) => + createBlock: (block: BlockV6 | BlockV6['type'], indices: BlockIndices) => { + let blockId setTypebot((typebot) => produce(typebot, (typebot) => { - createBlockDraft(typebot, block, indices) + blockId = createBlockDraft(typebot, block, indices) }) - ), + ) + return blockId + }, updateBlock: ( { groupIndex, blockIndex }: BlockIndices, updates: Partial> @@ -97,19 +103,22 @@ export const createBlockDraft = ( edgeId: blocks[blockIndex - 1].outgoingEdgeId as string, groupIndex, }) - typeof block === 'string' - ? createNewBlock(typebot, block, { groupIndex, blockIndex }) - : moveBlockToGroup(typebot, block, { groupIndex, blockIndex }) + const blockId = + typeof block === 'string' + ? createNewBlock(typebot, block, { groupIndex, blockIndex }) + : moveBlockToGroup(typebot, block, { groupIndex, blockIndex }) removeEmptyGroups(typebot) + return blockId } -const createNewBlock = async ( +const createNewBlock = ( typebot: Draft, type: BlockV6['type'], { groupIndex, blockIndex }: BlockIndices ) => { const newBlock = parseNewBlock(type) typebot.groups[groupIndex].blocks.splice(blockIndex ?? 0, 0, newBlock) + return newBlock.id } const moveBlockToGroup = ( diff --git a/apps/builder/src/features/editor/providers/typebotActions/groups.ts b/apps/builder/src/features/editor/providers/typebotActions/groups.ts index 14aee9486..bead6f60e 100644 --- a/apps/builder/src/features/editor/providers/typebotActions/groups.ts +++ b/apps/builder/src/features/editor/providers/typebotActions/groups.ts @@ -26,7 +26,7 @@ export type GroupsActions = { block: BlockV6 | BlockV6['type'] indices: BlockIndices } - ) => void + ) => string | void updateGroup: ( groupIndex: number, updates: Partial> @@ -54,7 +54,8 @@ const groupsActions = (setTypebot: SetTypebot): GroupsActions => ({ groupLabel?: string block: BlockV6 | BlockV6['type'] indices: BlockIndices - }) => + }) => { + let newBlockId setTypebot((typebot) => produce(typebot, (typebot) => { const newGroup: GroupV6 = { @@ -64,9 +65,11 @@ const groupsActions = (setTypebot: SetTypebot): GroupsActions => ({ blocks: [], } typebot.groups.push(newGroup) - createBlockDraft(typebot, block, indices) + newBlockId = createBlockDraft(typebot, block, indices) }) - ), + ) + return newBlockId + }, updateGroup: (groupIndex: number, updates: Partial>) => setTypebot((typebot) => produce(typebot, (typebot) => { diff --git a/apps/builder/src/features/graph/components/Graph.tsx b/apps/builder/src/features/graph/components/Graph.tsx index 9a8f63571..e8fa147e8 100644 --- a/apps/builder/src/features/graph/components/Graph.tsx +++ b/apps/builder/src/features/graph/components/Graph.tsx @@ -148,7 +148,7 @@ export const Graph = ({ ) const id = createId() updateGroupCoordinates(id, coordinates) - createGroup({ + const newBlockId = createGroup({ id, ...coordinates, block: draggedBlock ?? (draggedBlockType as BlockV6['type']), @@ -156,6 +156,7 @@ export const Graph = ({ }) setDraggedBlock(undefined) setDraggedBlockType(undefined) + if (newBlockId) setOpenedBlockId(newBlockId) } const handleCaptureMouseDown = (e: MouseEvent) => { diff --git a/apps/builder/src/features/graph/components/nodes/block/BlockNode.tsx b/apps/builder/src/features/graph/components/nodes/block/BlockNode.tsx index 5b93d0b05..c487fcb29 100644 --- a/apps/builder/src/features/graph/components/nodes/block/BlockNode.tsx +++ b/apps/builder/src/features/graph/components/nodes/block/BlockNode.tsx @@ -147,6 +147,7 @@ export const BlockNode = ({ const handleCloseEditor = (content: TElement[]) => { const updatedBlock = { ...block, content: { richText: content } } updateBlock(indices, updatedBlock) + setOpenedBlockId(undefined) } const handleClick = (e: React.MouseEvent) => { diff --git a/apps/builder/src/features/graph/components/nodes/block/BlockNodesList.tsx b/apps/builder/src/features/graph/components/nodes/block/BlockNodesList.tsx index df6ec5e8b..e6882e581 100644 --- a/apps/builder/src/features/graph/components/nodes/block/BlockNodesList.tsx +++ b/apps/builder/src/features/graph/components/nodes/block/BlockNodesList.tsx @@ -27,7 +27,7 @@ export const BlockNodesList = ({ blocks, groupIndex, groupRef }: Props) => { setDraggedBlockType, } = useBlockDnd() const { typebot, createBlock, detachBlockFromGroup } = useTypebot() - const { isReadOnly, graphPosition } = useGraph() + const { isReadOnly, graphPosition, setOpenedBlockId } = useGraph() const [expandedPlaceholderIndex, setExpandedPlaceholderIndex] = useState< number | undefined >() @@ -72,7 +72,7 @@ export const BlockNodesList = ({ blocks, groupIndex, groupRef }: Props) => { e.clientY, placeholderRefs ) - createBlock( + const blockId = createBlock( (draggedBlock || draggedBlockType) as BlockV6 | BlockV6['type'], { groupIndex, @@ -81,6 +81,7 @@ export const BlockNodesList = ({ blocks, groupIndex, groupRef }: Props) => { ) setDraggedBlock(undefined) setDraggedBlockType(undefined) + if (blockId) setOpenedBlockId(blockId) } const handleBlockMouseDown =