🚸 Update onboarding bot

Closes #400

packages/embeds/react/src/Bubble.tsx

@@ -18,22 +18,29 @@ declare global {
 type BubbleElement = HTMLElement & Props
 
 export const Bubble = (props: Props) => {
-  const ref = useRef<BubbleElement | null>(null)
+  const bubbleElement = useRef<BubbleElement | null>(null)
 
   const attachBubbleToDom = useCallback((props: Props) => {
-    const bubbleElement = document.createElement(
+    const newBubbleElement = document.createElement(
       'typebot-bubble'
     ) as BubbleElement
-    ref.current = bubbleElement
-    injectPropsToElement(ref.current, props)
-    document.body.append(ref.current)
+    bubbleElement.current = newBubbleElement
+    injectPropsToElement(bubbleElement.current, props)
+    document.body.append(bubbleElement.current)
   }, [])
 
   useEffect(() => {
-    if (!ref.current) attachBubbleToDom(props)
-    injectPropsToElement(ref.current as BubbleElement, props)
+    if (!bubbleElement.current) attachBubbleToDom(props)
+    injectPropsToElement(bubbleElement.current as BubbleElement, props)
   }, [attachBubbleToDom, props])
 
+  useEffect(() => {
+    return () => {
+      bubbleElement.current?.remove()
+      bubbleElement.current = null
+    }
+  }, [])
+
   const injectPropsToElement = (element: BubbleElement, props: Props) => {
     Object.assign(element, props)
   }