feat(engine): ♿️ Add data-block-name prop

baptisteArno · Mar 29, 2022 · 023a6f2 · 023a6f2 · vercel · Mar 29, 2022
1 parent f7d12dc
commit 023a6f2
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/packages/bot-engine/src/components/ChatBlock/ChatBlock.tsx b/packages/bot-engine/src/components/ChatBlock/ChatBlock.tsx
@@ -24,6 +24,7 @@ import { getLastChatStepType } from '../../services/chat'
 type ChatBlockProps = {
   steps: Step[]
   startStepIndex: number
+  blockTitle: string
   onScroll: () => void
   onBlockEnd: (
     edgeId?: string,
@@ -36,6 +37,7 @@ type ChatDisplayChunk = { bubbles: BubbleStep[]; input?: InputStep }
 export const ChatBlock = ({
   steps,
   startStepIndex,
+  blockTitle,
   onScroll,
   onBlockEnd,
 }: ChatBlockProps) => {
@@ -167,7 +169,7 @@ export const ChatBlock = ({
   const avatarSrc = typebot.theme.chat.hostAvatar?.url
 
   return (
-    <div className="flex w-full">
+    <div className="flex w-full" data-block-name={blockTitle}>
       <div className="flex flex-col w-full min-w-0">
         {displayedChunks.map((chunk, idx) => (
           <ChatChunks

diff --git a/packages/bot-engine/src/components/ConversationContainer.tsx b/packages/bot-engine/src/components/ConversationContainer.tsx
@@ -99,6 +99,7 @@ export const ConversationContainer = ({
           startStepIndex={displayedBlock.startStepIndex}
           onScroll={autoScrollToBottom}
           onBlockEnd={displayNextBlock}
+          blockTitle={displayedBlock.block.title}
         />
       ))}
       {/* We use a block to simulate padding because it makes iOS scroll flicker */}