Working webchat extension


#1

Hello i would like to make a custom web chat extension i am working in botpress x version 10.47.1

I followed this tutorial to the letter https://botpress.io/docs/10.50/recipes/webchat-ext/ but i cannot get it to work

i created a new module and the tutorial says to add this code in the index.js file

export const Plugin = ({ slots, id, onSendData }) => {
  const handleChange = e => {
    onSendData({
      type: "text",
      text: `Selected ${e.target.value} date-time`,
      data: { date: e.target.value, messageId: id }
    });
  };

  return (
    <select onChange={handleChange}>
      {(slots || []).map((slot, i) => (
        <option value={slot} key={i}>
          {slot}
        </option>
      ))}
    </select>
  );
};

export const Entry = () => null;

Which index.js file should we use the one in src> index.js or srs > vies> index.js

also getting this error
Module build failed: SyntaxError: C:/Users/soufyan.bargach/Desktop/Projects/multichannel-bot/multichannel-bot/modules/botpress-multi-select/src/index.js: Unexpected token (12:4)

  10 |
  11 |   return (
> 12 |     <select onChange={handleChange}>
     |     ^
  13 |       {(slots || []).map((slot, i) => (
  14 |         <option value={slot.id} key={slot.id}>
  15 |           {slot.name}

So i want to render checkboxes to my users to be able to select multiple choices if we cannot add a webchat extension could i use renderer to render checkboxes and would there be a method to retrieve selected checkboxes?


#2

Hey! I have been try to do the same. Someone already built this Plugin! Still not working for me.


#3

@alex do you know more?


#4

There’s an example at https://github.com/botpress/botpress-webchat-plugin-calendar/blob/master/src/index.js . It can be outdated though.
Did you make sure to have similar setting under "boptpress" key of package.json?


#5

@alex Yess tried exactly the same and it gives me the above error could you try to replicate a webchat extension to see where the problem lies?