fix(logic): ⚡️ Make linked bot edge id work

apps/builder/components/dashboard/FolderContent/TypebotButton.tsx

@@ -159,7 +159,7 @@ export const TypebotButton = ({
         >
           {<TypebotIcon icon={typebot.icon} boxSize={'35px'} />}
         </Flex>
-        <Text>{typebot.name}</Text>
+        <Text textAlign="center">{typebot.name}</Text>
       </VStack>
       {!isReadOnly && (
         <ConfirmModal

packages/bot-engine/src/components/ChatBlock/ChatBlock.tsx

@@ -52,6 +52,7 @@ export const ChatBlock = ({
     injectLinkedTypebot,
     linkedTypebots,
     setCurrentTypebotId,
+    pushEdgeIdInLinkedTypebotQueue,
   } = useTypebot()
   const { resultValues, updateVariables } = useAnswers()
   const [processedSteps, setProcessedSteps] = useState<Step[]>([])
@@ -113,6 +114,7 @@ export const ChatBlock = ({
         onNewLog,
         createEdge,
         setCurrentTypebotId,
+        pushEdgeIdInLinkedTypebotQueue,
       })
       nextEdgeId ? onBlockEnd(nextEdgeId, linkedTypebot) : displayNextStep()
     }

packages/bot-engine/src/components/ConversationContainer.tsx

@@ -21,7 +21,12 @@ export const ConversationContainer = ({
   onNewBlockVisible,
   onCompleted,
 }: Props) => {
-  const { typebot, updateVariableValue } = useTypebot()
+  const {
+    typebot,
+    updateVariableValue,
+    linkedBotEdgeIdsQueue,
+    popEdgeIdFromLinkedTypebotQueue,
+  } = useTypebot()
   const { document: frameDocument } = useFrame()
   const [displayedBlocks, setDisplayedBlocks] = useState<
     { block: Block; startStepIndex: number }[]
@@ -36,7 +41,14 @@ export const ConversationContainer = ({
   ) => {
     const currentTypebot = updatedTypebot ?? typebot
     const nextEdge = currentTypebot.edges.find(byId(edgeId))
-    if (!nextEdge) return onCompleted()
+    if (!nextEdge) {
+      if (linkedBotEdgeIdsQueue.length > 0) {
+        const nextEdgeId = linkedBotEdgeIdsQueue[0]
+        popEdgeIdFromLinkedTypebotQueue()
+        displayNextBlock(nextEdgeId)
+      }
+      return onCompleted()
+    }
     const nextBlock = currentTypebot.blocks.find(byId(nextEdge.to.blockId))
     if (!nextBlock) return onCompleted()
     const startStepIndex = nextEdge.to.stepId

packages/bot-engine/src/contexts/TypebotContext.tsx

@@ -18,10 +18,13 @@ const typebotContext = createContext<{
   linkedTypebots: LinkedTypebot[]
   apiHost: string
   isPreview: boolean
+  linkedBotEdgeIdsQueue: string[]
   setCurrentTypebotId: (id: string) => void
   updateVariableValue: (variableId: string, value: string) => void
   createEdge: (edge: Edge) => void
   injectLinkedTypebot: (typebot: Typebot | PublicTypebot) => LinkedTypebot
+  popEdgeIdFromLinkedTypebotQueue: () => void
+  pushEdgeIdInLinkedTypebotQueue: (edgeId: string) => void
   onNewLog: (log: Omit<Log, 'id' | 'createdAt' | 'resultId'>) => void
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   //@ts-ignore
@@ -43,6 +46,9 @@ export const TypebotContext = ({
   const [localTypebot, setLocalTypebot] = useState<PublicTypebot>(typebot)
   const [linkedTypebots, setLinkedTypebots] = useState<LinkedTypebot[]>([])
   const [currentTypebotId, setCurrentTypebotId] = useState(typebot.typebotId)
+  const [linkedBotEdgeIdsQueue, setLinkedBotEdgeIdsQueue] = useState<string[]>(
+    []
+  )
 
   useEffect(() => {
     setLocalTypebot((localTypebot) => ({
@@ -87,6 +93,12 @@ export const TypebotContext = ({
     return typebotToInject
   }
 
+  const pushEdgeIdInLinkedTypebotQueue = (edgeId: string) =>
+    setLinkedBotEdgeIdsQueue((queue) => [...queue, edgeId])
+
+  const popEdgeIdFromLinkedTypebotQueue = () =>
+    setLinkedBotEdgeIdsQueue((queue) => queue.slice(1))
+
   return (
     <typebotContext.Provider
       value={{
@@ -98,6 +110,9 @@ export const TypebotContext = ({
         createEdge,
         injectLinkedTypebot,
         onNewLog,
+        linkedBotEdgeIdsQueue,
+        pushEdgeIdInLinkedTypebotQueue,
+        popEdgeIdFromLinkedTypebotQueue,
         currentTypebotId,
         setCurrentTypebotId,
       }}

packages/bot-engine/src/services/logic.ts

@@ -28,6 +28,7 @@ type LogicContext = {
   apiHost: string
   typebot: PublicTypebot
   linkedTypebots: LinkedTypebot[]
+  pushEdgeIdInLinkedTypebotQueue: (edgeId: EdgeId) => void
   setCurrentTypebotId: (id: string) => void
   updateVariableValue: (variableId: string, value: string) => void
   updateVariables: (variables: VariableWithValue[]) => void
@@ -149,8 +150,14 @@ const executeTypebotLink = async (
   nextEdgeId?: EdgeId
   linkedTypebot?: PublicTypebot | LinkedTypebot
 }> => {
-  const { typebot, linkedTypebots, onNewLog, createEdge, setCurrentTypebotId } =
+  const {
-    context
+    typebot,
+    linkedTypebots,
+    onNewLog,
+    createEdge,
+    setCurrentTypebotId,
+    pushEdgeIdInLinkedTypebotQueue,
+  } = context
   const linkedTypebot = (
     step.options.typebotId === 'current'
       ? typebot
@@ -165,6 +172,7 @@ const executeTypebotLink = async (
     })
     return { nextEdgeId: step.outgoingEdgeId }
   }
+  if (step.outgoingEdgeId) pushEdgeIdInLinkedTypebotQueue(step.outgoingEdgeId)
   setCurrentTypebotId(
     'typebotId' in linkedTypebot ? linkedTypebot.typebotId : linkedTypebot.id
   )