🐛 Fix remember user streaming messages

packages/embeds/js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/js",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "Javascript library to display typebots on your website",
   "type": "module",
   "main": "dist/index.js",

packages/embeds/js/src/components/ConversationContainer/ChatChunk.tsx

@@ -171,7 +171,10 @@ export const ChatChunk = (props: Props) => {
                     : '100%',
               }}
             >
-              <StreamingBubble streamingMessageId={streamingMessageId} />
+              <StreamingBubble
+                streamingMessageId={streamingMessageId}
+                context={props.context}
+              />
             </div>
           </div>
         )}

packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx

@@ -73,7 +73,7 @@ type Props = {
 
 export const ConversationContainer = (props: Props) => {
   let chatContainer: HTMLDivElement | undefined
-  const [chatChunks, setChatChunks, isRecovered] = persist(
+  const [chatChunks, setChatChunks, isRecovered, setIsRecovered] = persist(
     createSignal<ChatChunkType[]>([
       {
         input: props.initialChatReply.input,
@@ -146,6 +146,7 @@ export const ConversationContainer = (props: Props) => {
     message?: string,
     attachments?: Answer['attachments']
   ) => {
+    setIsRecovered(false)
     setHasError(false)
     const currentInputBlock = [...chatChunks()].pop()?.input
     if (currentInputBlock?.id && props.onAnswer && message)
@@ -274,6 +275,7 @@ export const ConversationContainer = (props: Props) => {
   const processClientSideActions = async (
     actions: NonNullable<ContinueChatResponse['clientSideActions']>
   ) => {
+    console.log('YES')
     if (isRecovered()) return
     for (const action of actions) {
       if (

packages/embeds/js/src/components/bubbles/StreamingBubble.tsx

@@ -3,13 +3,19 @@ import { For, createEffect, createSignal } from 'solid-js'
 import { marked } from 'marked'
 import domPurify from 'dompurify'
 import { isNotEmpty } from '@typebot.io/lib'
+import { persist } from '@/utils/persist'
+import { BotContext } from '@/types'
 
 type Props = {
   streamingMessageId: string
+  context: BotContext
 }
 
 export const StreamingBubble = (props: Props) => {
-  const [content, setContent] = createSignal<string[]>([])
+  const [content, setContent] = persist(createSignal<string[]>([]), {
+    key: `typebot-streaming-message-${props.streamingMessageId}`,
+    storage: props.context.storage,
+  })
 
   marked.use({
     renderer: {

packages/embeds/js/src/utils/persist.ts

@@ -16,9 +16,9 @@ type Params = {
 export function persist<T>(
   signal: Signal<T>,
   params: Params
-): [...Signal<T>, () => boolean] {
+): [...Signal<T>, () => boolean, Setter<boolean>] {
   const [isRecovered, setIsRecovered] = createSignal(false)
-  if (!params.storage) return [...signal, () => false]
+  if (!params.storage) return [...signal, isRecovered, setIsRecovered]
 
   const storage = parseRememberUserStorage(
     params.storage || defaultSettings.general.rememberUser.storage
@@ -55,7 +55,8 @@ export function persist<T>(
           storage.setItem(params.key, value)
         },
     isRecovered,
-  ] as [...typeof signal, () => boolean]
+    setIsRecovered,
+  ] as [...typeof signal, typeof isRecovered, typeof setIsRecovered]
 }
 
 const parseRememberUserStorage = (

packages/embeds/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/nextjs",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "Convenient library to display typebots on your Next.js website",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

packages/embeds/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/react",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "Convenient library to display typebots on your React app",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",