diff --git a/packages/embeds/js/package.json b/packages/embeds/js/package.json index dddd7a83c..4a382c30c 100644 --- a/packages/embeds/js/package.json +++ b/packages/embeds/js/package.json @@ -1,6 +1,6 @@ { "name": "@typebot.io/js", - "version": "0.2.58", + "version": "0.2.59", "description": "Javascript library to display typebots on your website", "type": "module", "main": "dist/index.js", diff --git a/packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx b/packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx index c6e46e573..ba172a925 100644 --- a/packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx +++ b/packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx @@ -70,7 +70,7 @@ type Props = { export const ConversationContainer = (props: Props) => { let chatContainer: HTMLDivElement | undefined - const [chatChunks, setChatChunks] = persist( + const [chatChunks, setChatChunks, isRecovered] = persist( createSignal([ { input: props.initialChatReply.input, @@ -81,6 +81,11 @@ export const ConversationContainer = (props: Props) => { { key: `typebot-${props.context.typebot.id}-chatChunks`, storage: props.context.storage, + onRecovered: () => { + setTimeout(() => { + chatContainer?.scrollTo(0, chatContainer.scrollHeight) + }, 200) + }, } ) const [dynamicTheme, setDynamicTheme] = createSignal< @@ -297,7 +302,10 @@ export const ConversationContainer = (props: Props) => { (chatChunk.messages.length > 0 && isSending())) } hasError={hasError() && index() === chatChunks().length - 1} - isTransitionDisabled={index() !== chatChunks().length - 1} + isTransitionDisabled={ + index() !== chatChunks().length - 1 || + (!chatChunk.input && isRecovered()) + } onNewBubbleDisplayed={handleNewBubbleDisplayed} onAllBubblesDisplayed={handleAllBubblesDisplayed} onSubmit={sendMessage} diff --git a/packages/embeds/js/src/utils/persist.ts b/packages/embeds/js/src/utils/persist.ts index f95b9fbeb..906a9abec 100644 --- a/packages/embeds/js/src/utils/persist.ts +++ b/packages/embeds/js/src/utils/persist.ts @@ -1,19 +1,24 @@ // Copied from https://github.com/solidjs-community/solid-primitives/blob/main/packages/storage/src/types.ts -// Simplifying and adding a `isEnabled` prop +// Simplified version /* eslint-disable @typescript-eslint/no-explicit-any */ import { defaultSettings } from '@typebot.io/schemas/features/typebot/settings/constants' import type { Setter, Signal } from 'solid-js' -import { untrack } from 'solid-js' +import { createSignal, untrack } from 'solid-js' import { reconcile } from 'solid-js/store' type Params = { key: string storage: 'local' | 'session' | undefined + onRecovered?: () => void } -export function persist(signal: Signal, params: Params): Signal { - if (!params.storage) return signal +export function persist( + signal: Signal, + params: Params +): [...Signal, () => boolean] { + const [isRecovered, setIsRecovered] = createSignal(false) + if (!params.storage) return [...signal, () => false] const storage = parseRememberUserStorage( params.storage || defaultSettings.general.rememberUser.storage @@ -26,12 +31,17 @@ export function persist(signal: Signal, params: Params): Signal { ? (data: string) => (signal[1] as any)(() => deserialize(data)) : (data: string) => (signal[1] as any)(reconcile(deserialize(data))) - if (init) set(init) + if (init) { + set(init) + setIsRecovered(true) + params.onRecovered?.() + } return [ signal[0], typeof signal[0] === 'function' ? (value?: T | ((prev: T) => T)) => { + setIsRecovered(false) const output = (signal[1] as Setter)(value as any) if (value) storage.setItem(params.key, serialize(output)) @@ -39,11 +49,13 @@ export function persist(signal: Signal, params: Params): Signal { return output } : (...args: any[]) => { + setIsRecovered(false) ;(signal[1] as any)(...args) const value = serialize(untrack(() => signal[0] as any)) storage.setItem(params.key, value) }, - ] as typeof signal + isRecovered, + ] as [...typeof signal, () => boolean] } const parseRememberUserStorage = ( diff --git a/packages/embeds/nextjs/package.json b/packages/embeds/nextjs/package.json index e06637126..316b4b339 100644 --- a/packages/embeds/nextjs/package.json +++ b/packages/embeds/nextjs/package.json @@ -1,6 +1,6 @@ { "name": "@typebot.io/nextjs", - "version": "0.2.58", + "version": "0.2.59", "description": "Convenient library to display typebots on your Next.js website", "main": "dist/index.js", "types": "dist/index.d.ts", diff --git a/packages/embeds/react/package.json b/packages/embeds/react/package.json index 28fee9337..91b5fdca8 100644 --- a/packages/embeds/react/package.json +++ b/packages/embeds/react/package.json @@ -1,6 +1,6 @@ { "name": "@typebot.io/react", - "version": "0.2.58", + "version": "0.2.59", "description": "Convenient library to display typebots on your React app", "main": "dist/index.js", "types": "dist/index.d.ts",