How to prompt user to access chat bot in webchat as seen in rasa demo bot?

Rashmi · February 24, 2020, 6:28am

rasa%20prompt

JiteshGaikwad · February 24, 2020, 9:07am

hey @Rashmi, I think so you can use the tooltip prop of the webchat:

GitHub - botfront/rasa-webchat: A feature-rich chat widget for Rasa and Botfront

botfront/rasa-webchat/blob/9d6e692ea780e3b5b0ef394a3889e0240979689a/src/index.js#L167


      
          embedded: PropTypes.bool,
          // eslint-disable-next-line react/forbid-prop-types
          params: PropTypes.object,
          openLauncherImage: PropTypes.string,
          closeImage: PropTypes.string,
          docViewer: PropTypes.bool,
          customComponent: PropTypes.func,
          displayUnreadCount: PropTypes.bool,
          showMessageDate: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
          customMessageDelay: PropTypes.func,
          tooltipPayload: PropTypes.string,
          tooltipDelay: PropTypes.number,
          onWidgetEvent: PropTypes.shape({
            onChatOpen: PropTypes.func,
            onChatClose: PropTypes.func,
            onChatVisible: PropTypes.func,
            onChatHidden: PropTypes.func
          }),
          disableTooltips: PropTypes.bool,
          defaultHighlightCss: PropTypes.string,
          defaultHighlightAnimation: PropTypes.string

JiteshGaikwad · February 24, 2020, 9:44am

Attaching the code which worked for me:

Capture

           WebChat.default.init({
            selector: "#webchat",
            initPayload: "/get_started",
            customData: { "language": "en" }, // arbitrary custom data. Stay minimal as this will be added to the socket
            socketUrl: "http://localhost:5005",
            socketPath: "/socket.io/",
            title: "Moodbot",
            tooltipPayload: "/greet",
            tooltipDelay: 500,
            subtitle: "",
        })

I have triggered my greeting intent from tooltipPayloadprop and it send me the response for the greeting intent.

Rashmi · February 24, 2020, 10:00am

Thank you ! This worked

JiteshGaikwad · February 24, 2020, 10:00am

@Rashmi Glad that worked Thanks for trying it out

priya359 · September 9, 2020, 11:06am

I tried the same but tooltipPayload prop not working could you please help me out !

RaphSchwagmeir · October 14, 2020, 6:27pm

Hello, I have a similar question to this topic related to the tooltipPayload. In my current configuration, I have something like this:

WebChat.default.init({
        selector: "#webchat",
        initPayload: "/welcome",
        socketUrl: "http://localhost:5005",
        socketPath: "/socket.io/",
        title: "Testbot",
        tooltipPayload: "/Popup",
        subtitle: "",
    })

The issue is that only the tooltipPayload is sent taken into account by the bot. Ideally, I would like the bot to show the tooltip when the webchat is closed, and once a user opens it the initPayload is sent to the bot.

Is there something I’m missing?