Share feedback, ideas and get community help

Updated 6 months ago

isPreview prop NextJs not working?

At a glance

The community member is trying to test a typebot on their NextJs website, but when they use the isPreview prop, they get an error indicating that some fields are missing. The error message suggests that the typebot prop should be the typebot ID, not the typebot public ID. Another community member confirms this and provides a link to the documentation on how to find the typebot ID.

Useful resources
I'm trying to test the typebot on my NextJs website, but when I try to use it with the isPreview prop I get the following error:

Plain Text
An error occurred while loading the bot.

{
  "status": 400,
  "body": {
    "message": "Input validation failed",
    "code": "BAD_REQUEST",
    "data": {
      "code": "BAD_REQUEST",
      "httpStatus": 400,
      "path": "startChatPreview"
    },
    "issues": [
      {
        "code": "invalid_type",
        "expected": "string",
        "received": "undefined",
        "path": [
          "typebot",
          "id"
        ],
        "message": "Required"
      },
      {
        "code": "invalid_type",
        "expected": "array",
        "received": "undefined",
        "path": [
          "typebot",
          "variables"
        ],
        "message": "Required"
      },
      {
        "code": "invalid_type",
        "expected": "object",
        "received": "undefined",
        "path": [
          "typebot",
          "settings"
        ],
        "message": "Required"
      },
      {
        "code": "invalid_type",
        "expected": "object",
        "received": "undefined",
        "path": [
          "typebot",
          "theme"
        ],
        "message": "Required"
      }
    ]
  }
}


The error message seems to indicate that some fields are missing. But when I remove the isPreview, the component works perfectly. This is the current code of it:

Plain Text
<Bubble
                isPreview={true}
                typebot="my-typebot-name"
                onOpen={handleClick}
                previewMessage={{
                    autoShowDelay: 6000,
                    message: "I'm waiting for you here! :)",
                    avatarUrl:
                        "avatar-url-here",
                }}
                theme={{button: {backgroundColor: "#3948ef"}}}
            />
B
2 comments
If you set isPreview then typebot needs to be the typebot ID not the typebot public ID
Add a reply
Sign up and join the conversation on Discord