diff --git a/packages/bot-engine/src/features/blocks/bubbles/audio/components/AudioBubble.tsx b/packages/bot-engine/src/features/blocks/bubbles/audio/components/AudioBubble.tsx index bdbafbb40..bb3a0c6d4 100644 --- a/packages/bot-engine/src/features/blocks/bubbles/audio/components/AudioBubble.tsx +++ b/packages/bot-engine/src/features/blocks/bubbles/audio/components/AudioBubble.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useMemo, useRef, useState } from 'react' +import { useEffect, useRef, useState } from 'react' import { useTypebot } from '@/providers/TypebotProvider' import { AudioBubbleContent } from 'models' import { TypingBubble } from '@/components/TypingBubble' @@ -16,11 +16,7 @@ export const AudioBubble = ({ url, onTransitionEnd }: Props) => { const { typebot, isLoading } = useTypebot() const audio = useRef(null) const [isTyping, setIsTyping] = useState(true) - - const parsedUrl = useMemo( - () => parseVariables(typebot.variables)(url), - [url, typebot.variables] - ) + const [parsedUrl] = useState(parseVariables(typebot.variables)(url)) useEffect(() => { if (!isTyping || isLoading) return diff --git a/packages/bot-engine/src/features/blocks/bubbles/embed/components/EmbedBubble.tsx b/packages/bot-engine/src/features/blocks/bubbles/embed/components/EmbedBubble.tsx index 85282f917..ec4817540 100644 --- a/packages/bot-engine/src/features/blocks/bubbles/embed/components/EmbedBubble.tsx +++ b/packages/bot-engine/src/features/blocks/bubbles/embed/components/EmbedBubble.tsx @@ -1,4 +1,4 @@ -import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { useCallback, useEffect, useRef, useState } from 'react' import { EmbedBubbleBlock } from 'models' import { TypingBubble } from '../../../../../components/TypingBubble' import { parseVariables } from '@/features/variables' @@ -15,11 +15,7 @@ export const EmbedBubble = ({ block, onTransitionEnd }: Props) => { const { typebot, isLoading } = useTypebot() const messageContainer = useRef(null) const [isTyping, setIsTyping] = useState(true) - - const url = useMemo( - () => parseVariables(typebot.variables)(block.content?.url), - [block.content?.url, typebot.variables] - ) + const [url] = useState(parseVariables(typebot.variables)(block.content?.url)) const onTypingEnd = useCallback(() => { setIsTyping(false) diff --git a/packages/bot-engine/src/features/blocks/bubbles/image/components/ImageBubble.tsx b/packages/bot-engine/src/features/blocks/bubbles/image/components/ImageBubble.tsx index 8f63ea3ac..4307b43e6 100644 --- a/packages/bot-engine/src/features/blocks/bubbles/image/components/ImageBubble.tsx +++ b/packages/bot-engine/src/features/blocks/bubbles/image/components/ImageBubble.tsx @@ -1,4 +1,4 @@ -import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { useCallback, useEffect, useRef, useState } from 'react' import { useTypebot } from '@/providers/TypebotProvider' import { ImageBubbleBlock } from 'models' import { TypingBubble } from '@/components/TypingBubble' @@ -18,11 +18,7 @@ export const ImageBubble = ({ block, onTransitionEnd }: Props) => { const messageContainer = useRef(null) const image = useRef(null) const [isTyping, setIsTyping] = useState(true) - - const url = useMemo( - () => parseVariables(typebot.variables)(block.content?.url), - [block.content?.url, typebot.variables] - ) + const [url] = useState(parseVariables(typebot.variables)(block.content?.url)) const onTypingEnd = useCallback(() => { setIsTyping(false) diff --git a/packages/bot-engine/src/features/blocks/bubbles/video/components/VideoBubble.tsx b/packages/bot-engine/src/features/blocks/bubbles/video/components/VideoBubble.tsx index a401cf224..82225a5c0 100644 --- a/packages/bot-engine/src/features/blocks/bubbles/video/components/VideoBubble.tsx +++ b/packages/bot-engine/src/features/blocks/bubbles/video/components/VideoBubble.tsx @@ -1,4 +1,4 @@ -import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { useCallback, useEffect, useRef, useState } from 'react' import { useTypebot } from '@/providers/TypebotProvider' import { Variable, @@ -75,12 +75,10 @@ const VideoContent = ({ isTyping: boolean variables: Variable[] }) => { - const url = useMemo( - () => parseVariables(variables)(content?.url), - // eslint-disable-next-line react-hooks/exhaustive-deps - [variables] - ) + const [url] = useState(parseVariables(variables)(content?.url)) + if (!content?.type) return <> + switch (content.type) { case VideoBubbleContentType.URL: { const isSafariBrowser = window.navigator.vendor.match(/apple/i)