feat(engine): ♿️ Add data-block-name prop
This commit is contained in:
@ -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
|
||||||
|
@ -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 */}
|
||||||
|
Reference in New Issue
Block a user