🐛 (share) Enable back empty public ID for self-hosted version

Closes #576

apps/viewer/src/components/TypebotPageV3.tsx

@@ -5,11 +5,11 @@ import { SEO } from './Seo'
 
 export type TypebotPageProps = {
   url: string
-  typebot?: Pick<Typebot, 'settings' | 'theme' | 'name' | 'publicId'>
+  typebot: Pick<Typebot, 'settings' | 'theme' | 'name' | 'publicId'>
 }
 
 export const TypebotPageV3 = ({ url, typebot }: TypebotPageProps) => {
-  const { asPath, push, query } = useRouter()
+  const { asPath, push } = useRouter()
 
   const background = typebot?.theme.general.background
 
@@ -36,15 +36,13 @@ export const TypebotPageV3 = ({ url, typebot }: TypebotPageProps) => {
             : '#fff',
       }}
     >
-      {typebot && (
+      <SEO
-        <SEO
+        url={url}
-          url={url}
+        typebotName={typebot.name}
-          typebotName={typebot.name}
+        metadata={typebot.settings.metadata}
-          metadata={typebot.settings.metadata}
+      />
-        />
-      )}
       <Standard
-        typebot={typebot?.publicId ?? query.publicId?.toString() ?? 'n'}
+        typebot={typebot.publicId}
         onInit={clearQueryParamsIfNecessary}
       />
     </div>

apps/viewer/src/features/chat/api/sendMessage.ts

@@ -125,10 +125,10 @@ export const sendMessage = publicProcedure
   )
 
 const startSession = async (startParams?: StartParams, userId?: string) => {
-  if (!startParams?.typebot)
+  if (!startParams)
     throw new TRPCError({
       code: 'BAD_REQUEST',
-      message: 'No typebot provided in startParams',
+      message: 'StartParams are missing',
     })
 
   const typebot = await getTypebot(startParams, userId)

apps/viewer/src/pages/[[...publicId]].tsx

@@ -94,7 +94,14 @@ const getTypebotFromPublicId = async (
   const publishedTypebot = await prisma.publicTypebot.findFirst({
     where: { typebot: { publicId: publicId ?? '' } },
     include: {
-      typebot: { select: { name: true, isClosed: true, isArchived: true } },
+      typebot: {
+        select: {
+          name: true,
+          isClosed: true,
+          isArchived: true,
+          publicId: true,
+        },
+      },
     },
   })
   if (isNotDefined(publishedTypebot)) return null

packages/embeds/js/package.json

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

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

@@ -1,6 +1,6 @@
 import { LiteBadge } from './LiteBadge'
 import { createEffect, createSignal, onCleanup, onMount, Show } from 'solid-js'
-import { isNotEmpty } from '@typebot.io/lib'
+import { isNotDefined, isNotEmpty } from '@typebot.io/lib'
 import { getInitialChatReplyQuery } from '@/queries/getInitialChatReplyQuery'
 import { ConversationContainer } from './ConversationContainer'
 import { setIsMobile } from '@/utils/isMobileSignal'
@@ -92,7 +92,7 @@ export const Bot = (props: BotProps & { class?: string }) => {
   }
 
   createEffect(() => {
-    if (!props.typebot || isInitialized()) return
+    if (isNotDefined(props.typebot) || isInitialized()) return
     initializeBot().then()
   })
 

packages/embeds/js/src/features/blocks/bubbles/audio/components/AudioBubble.tsx

@@ -20,6 +20,14 @@ export const AudioBubble = (props: Props) => {
     typingTimeout = setTimeout(() => {
       setIsTyping(false)
       setTimeout(() => {
+        const audioElement = ref?.querySelector('audio')
+        if (audioElement) {
+          try {
+            audioElement.play()
+          } catch (e) {
+            console.warn('Could not autoplay the audio:', e)
+          }
+        }
         props.onTransitionEnd(ref?.offsetTop)
       }, showAnimationDuration)
     }, typingDuration)
@@ -49,7 +57,6 @@ export const AudioBubble = (props: Props) => {
               (isTyping() ? 'opacity-0' : 'opacity-100')
             }
             style={{ height: isTyping() ? '32px' : 'revert' }}
-            autoplay
             controls
           />
         </div>

packages/embeds/js/src/queries/getInitialChatReplyQuery.ts

@@ -1,7 +1,7 @@
 import { InitialChatReply } from '@/types'
 import { guessApiHost } from '@/utils/guessApiHost'
 import type { SendMessageInput, StartParams } from '@typebot.io/schemas'
-import { isNotEmpty, sendRequest } from '@typebot.io/lib'
+import { isNotDefined, isNotEmpty, sendRequest } from '@typebot.io/lib'
 
 export async function getInitialChatReplyQuery({
   typebot,
@@ -13,7 +13,7 @@ export async function getInitialChatReplyQuery({
 }: StartParams & {
   apiHost?: string
 }) {
-  if (!typebot)
+  if (isNotDefined(typebot))
     throw new Error('Typebot ID is required to get initial messages')
 
   return sendRequest<InitialChatReply>({

packages/embeds/react/package.json

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