2
0

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

This commit is contained in:
Baptiste Arnaud
2022-03-29 11:55:10 +02:00
parent f7d12dc995
commit 023a6f274a
2 changed files with 4 additions and 1 deletions

View File

@ -24,6 +24,7 @@ import { getLastChatStepType } from '../../services/chat'
type ChatBlockProps = { type ChatBlockProps = {
steps: Step[] steps: Step[]
startStepIndex: number startStepIndex: number
blockTitle: string
onScroll: () => void onScroll: () => void
onBlockEnd: ( onBlockEnd: (
edgeId?: string, edgeId?: string,
@ -36,6 +37,7 @@ type ChatDisplayChunk = { bubbles: BubbleStep[]; input?: InputStep }
export const ChatBlock = ({ export const ChatBlock = ({
steps, steps,
startStepIndex, startStepIndex,
blockTitle,
onScroll, onScroll,
onBlockEnd, onBlockEnd,
}: ChatBlockProps) => { }: ChatBlockProps) => {
@ -167,7 +169,7 @@ export const ChatBlock = ({
const avatarSrc = typebot.theme.chat.hostAvatar?.url const avatarSrc = typebot.theme.chat.hostAvatar?.url
return ( 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"> <div className="flex flex-col w-full min-w-0">
{displayedChunks.map((chunk, idx) => ( {displayedChunks.map((chunk, idx) => (
<ChatChunks <ChatChunks

View File

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