Hello, everyone!
I have typebot self hosted on easy panel in latest version (builder and viewer). It works normally when I use the bot in the URL Viewer. But when I try to insert it into my nextjs app via @typebot.io/nextjs it generates a problem. I'll explain the behavior below:
- Accessing the bot in the Viewer URL, after entering the name in the input, it continues processing normally:
Payload on /api/v1/sessions/theSessionId/continueChat (network tab of browser):
{
"message": "Test"
}
See image: url-viewer-example.png
And here
no error occurs, the chat ends as expected.
- Accessing the chat in the nextjs app with Bubble (or Popup, etc) component:
<Bubble
typebot="teste"
apiHost={process.env.NEXT_PUBLIC_TYPEBOT_VIEWER_URL}
/>
Payload on /api/v1/sessions/theSessionId/continueChat (network tab of browser):
{
"message": {
"type": "text",
"text": "Test"
}
}
See image: bubble-component-nextjs-example.png
And the following error is triggered:
{
"message": "Input validation failed",
"code": "BAD_REQUEST",
"data": {
"code": "BAD_REQUEST",
"httpStatus": 400,
"path": "continueChat"
},
"issues": [
{
"code": "invalid_type",
"expected": "string",
"received": "object",
"path": [
"message"
],
"message": "Expected string, received object"
}
]
}
I don't know why, but the payload is being sent differently when it comes to the Widget (Bubble, Popup, etc) and this seems to me to be the reason for the error.
How can I fix this?
Thanksss!