🚸 Display error toast when script or set vari…

packages/embeds/js/package.json

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

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

@@ -131,18 +131,18 @@ export const ConversationContainer = (props: Props) => {
     )
   })
 
-  const sendMessage = async (
-    message: string | undefined,
-    clientLogs?: ChatLog[]
-  ) => {
-    if (clientLogs) {
-      props.onNewLogs?.(clientLogs)
-      await saveClientLogsQuery({
-        apiHost: props.context.apiHost,
-        sessionId: props.initialChatReply.sessionId,
-        clientLogs,
-      })
-    }
+  const saveLogs = async (clientLogs?: ChatLog[]) => {
+    if (!clientLogs) return
+    props.onNewLogs?.(clientLogs)
+    if (props.context.isPreview) return
+    await saveClientLogsQuery({
+      apiHost: props.context.apiHost,
+      sessionId: props.initialChatReply.sessionId,
+      clientLogs,
+    })
+  }
+
+  const sendMessage = async (message: string | undefined) => {
     setHasError(false)
     const currentInputBlock = [...chatChunks()].pop()?.input
     if (currentInputBlock?.id && props.onAnswer && message)
@@ -288,9 +288,10 @@ export const ConversationContainer = (props: Props) => {
         },
         onMessageStream: streamMessage,
       })
+      if (response && 'logs' in response) saveLogs(response.logs)
       if (response && 'replyToSend' in response) {
         setIsSending(false)
-        sendMessage(response.replyToSend, response.logs)
+        sendMessage(response.replyToSend)
         return
       }
       if (response && 'blockedPopupUrl' in response)

packages/embeds/js/src/features/blocks/logic/script/executeScript.ts

@@ -1,9 +1,13 @@
-import type { ScriptToExecute } from '@typebot.io/schemas'
+import { stringifyError } from '@typebot.io/lib/stringifyError'
+import type { ChatLog, ScriptToExecute } from '@typebot.io/schemas'
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor
 
-export const executeScript = async ({ content, args }: ScriptToExecute) => {
+export const executeScript = async ({
+  content,
+  args,
+}: ScriptToExecute): Promise<void | { logs: ChatLog[] }> => {
   try {
     const func = AsyncFunction(
       ...args.map((arg) => arg.id),
@@ -11,7 +15,15 @@ export const executeScript = async ({ content, args }: ScriptToExecute) => {
     )
     await func(...args.map((arg) => arg.value))
   } catch (err) {
-    console.warn('Script threw an error:', err)
+    return {
+      logs: [
+        {
+          status: 'error',
+          description: 'Script block failed to execute',
+          details: stringifyError(err),
+        },
+      ],
+    }
   }
 }
 

packages/embeds/js/src/features/blocks/logic/setVariable/executeSetVariable.ts

@@ -1,5 +1,6 @@
-import type { ScriptToExecute } from '@typebot.io/schemas'
+import type { ChatLog, ScriptToExecute } from '@typebot.io/schemas'
 import { safeStringify } from '@typebot.io/lib/safeStringify'
+import { stringifyError } from '@typebot.io/lib/stringifyError'
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor
@@ -7,7 +8,11 @@ const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor
 export const executeSetVariable = async ({
   content,
   args,
-}: ScriptToExecute): Promise<{ replyToSend: string | undefined }> => {
+  isCode,
+}: ScriptToExecute): Promise<{
+  replyToSend: string | undefined
+  logs?: ChatLog[]
+}> => {
   try {
     // To avoid octal number evaluation
     if (!isNaN(content as unknown as number) && /0[^.].+/.test(content))
@@ -26,6 +31,15 @@ export const executeSetVariable = async ({
     console.error(err)
     return {
       replyToSend: safeStringify(content) ?? undefined,
+      logs: isCode
+        ? [
+            {
+              status: 'error',
+              description: 'Failed to execute Set Variable code',
+              details: stringifyError(err),
+            },
+          ]
+        : undefined,
     }
   }
 }

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

@@ -27,6 +27,7 @@ export const executeClientSideAction = async ({
 }: Props): Promise<
   | { blockedPopupUrl: string }
   | { replyToSend: string | undefined; logs?: ChatLog[] }
+  | { logs: ChatLog[] }
   | void
 > => {
   if ('chatwoot' in clientSideAction) {

packages/embeds/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/nextjs",
-  "version": "0.2.86",
+  "version": "0.2.87",
   "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.2.86",
+  "version": "0.2.87",
   "description": "Convenient library to display typebots on your React app",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",